mirror of
				https://github.com/Redocly/redoc.git
				synced 2025-10-31 07:47:29 +03:00 
			
		
		
		
	
		
			
				
	
	
		
			91 lines
		
	
	
		
			1.7 KiB
		
	
	
	
		
			SCSS
		
	
	
	
	
	
			
		
		
	
	
			91 lines
		
	
	
		
			1.7 KiB
		
	
	
	
		
			SCSS
		
	
	
	
	
	
| @import '../../shared/styles/variables';
 | |
| 
 | |
| $hint-color: #999999;
 | |
| 
 | |
| .param-list-header {
 | |
|   border-bottom: 1px solid rgba($text-color, .3);
 | |
|   padding: 0.2em 0;
 | |
|   margin: 3.5em 0 .8em 0;
 | |
|   color: rgba($text-color, .5);
 | |
|   font-weight: normal;
 | |
|   text-transform: uppercase;
 | |
| }
 | |
| 
 | |
| @import '../JsonSchema/json-schema-common';
 | |
| 
 | |
| header.paramType {
 | |
|   margin: 10px 0;
 | |
|   text-transform: capitalize;
 | |
| }
 | |
| 
 | |
| // paramters can't be multilevel so table representation works for it without javascript
 | |
| .params-wrap {
 | |
|   display: table;
 | |
|   width: 100%;
 | |
| }
 | |
| 
 | |
| .param-name {
 | |
|   display: table-cell;
 | |
|   vertical-align: top;
 | |
| }
 | |
| 
 | |
| .param-info {
 | |
|   display: table-cell;
 | |
|   width: 100%;
 | |
| }
 | |
| 
 | |
| .param {
 | |
|   display: table-row;
 | |
| }
 | |
| 
 | |
| .param:last-of-type > .param-name {
 | |
|   border-left: 0;
 | |
|   &:after {
 | |
|     content: "";
 | |
|     display: block;
 | |
|     position: absolute;
 | |
|     left: 0;
 | |
|     border-left: $line-border;
 | |
|     height: ($param-name-height/2) + $cell-padding + $lines-width;
 | |
|     background-color: white;
 | |
|     top: 0;
 | |
|   }
 | |
| }
 | |
| 
 | |
| .param:first-of-type .param-name:after {
 | |
|   content: "";
 | |
|   display: block;
 | |
|   position: absolute;
 | |
|   left: -$lines-width;
 | |
|   border-left: $line-border-erase;
 | |
|   height: ($param-name-height/2) + $cell-padding;
 | |
|   background-color: white;
 | |
|   top: 0;
 | |
| }
 | |
| 
 | |
| [data-hint] {
 | |
|   width: 1.2em;
 | |
|   text-align: center;
 | |
|   border-radius: 50%;
 | |
|   vertical-align: middle;
 | |
|   color: $hint-color;
 | |
|   line-height: 1.2;
 | |
|   text-transform: none;
 | |
|   cursor: help;
 | |
|   border: 1px solid $hint-color;
 | |
|   margin-left: 0.5em;
 | |
| }
 | |
| 
 | |
| @media (max-width: 520px) {
 | |
|   [data-hint] {
 | |
|     float: right;
 | |
|   }
 | |
| 
 | |
|   [data-hint]:after {
 | |
|     margin-left: 12px;
 | |
|     transform: translateX(-100%) translateY(-8px);
 | |
|     -moz-transform: translateX(-100%) translateY(-8px);
 | |
|     -webkit-transform: translateX(-100%) translateY(-8px);
 | |
|   }
 | |
| }
 |