mirror of
				https://github.com/Redocly/redoc.git
				synced 2025-11-04 01:37:32 +03:00 
			
		
		
		
	fixed #12: schema representation on Safari
This commit is contained in:
		
							parent
							
								
									e861ae9add
								
							
						
					
					
						commit
						7f57558225
					
				| 
						 | 
				
			
			@ -30,8 +30,9 @@ $sub-schema-offset: ($bullet-size/2) + $bullet-margin;
 | 
			
		|||
}
 | 
			
		||||
 | 
			
		||||
.param-name {
 | 
			
		||||
  display: inline-block;
 | 
			
		||||
  font-size: 14px;
 | 
			
		||||
  padding: $cell-padding $cell-spacing $cell-padding 0;
 | 
			
		||||
  padding: $cell-padding 0 $cell-padding 0;
 | 
			
		||||
  font-weight: bold;
 | 
			
		||||
  box-sizing: border-box;
 | 
			
		||||
  line-height: $param-name-height;
 | 
			
		||||
| 
						 | 
				
			
			@ -40,11 +41,17 @@ $sub-schema-offset: ($bullet-size/2) + $bullet-margin;
 | 
			
		|||
  position: relative;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
.param-name-content {
 | 
			
		||||
  padding-right: $cell-spacing;
 | 
			
		||||
  display: inline-block;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
.param-info {
 | 
			
		||||
  width: 100%;
 | 
			
		||||
  padding: $cell-padding 0;
 | 
			
		||||
  box-sizing: border-box;
 | 
			
		||||
  border-bottom: 1px solid #ccc;
 | 
			
		||||
  display: inline-block;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
.param {
 | 
			
		||||
| 
						 | 
				
			
			
 | 
			
		|||
| 
						 | 
				
			
			@ -6,7 +6,7 @@
 | 
			
		|||
  <div *ngFor="#prop of data.properties" class="param-wrap">
 | 
			
		||||
    <div class="param" [ngClass]="{'discriminator': prop.isDiscriminator}">
 | 
			
		||||
      <div class="param-name">
 | 
			
		||||
        <span>{{prop._name}}</span>
 | 
			
		||||
        <span class="param-name-content">{{prop._name}}</span>
 | 
			
		||||
      </div>
 | 
			
		||||
      <div class="param-info">
 | 
			
		||||
        <div>
 | 
			
		||||
| 
						 | 
				
			
			
 | 
			
		|||
| 
						 | 
				
			
			@ -86,12 +86,12 @@ export default class JsonSchema extends BaseComponent {
 | 
			
		|||
 | 
			
		||||
  adjustNameColumnWidth() {
 | 
			
		||||
    // TODO handle internal schemes differently
 | 
			
		||||
    let names = [].slice.call(this.element.querySelectorAll('.param-name'));
 | 
			
		||||
    let names = [].slice.call(this.element.querySelectorAll('.param-name-content'));
 | 
			
		||||
    let widths = names.map(el => el.offsetWidth);
 | 
			
		||||
    let maxWidth = Math.max(...widths);
 | 
			
		||||
    if (!maxWidth) return;
 | 
			
		||||
    names.forEach(el => {
 | 
			
		||||
      el.style.minWidth = maxWidth + 'px';
 | 
			
		||||
      el.parentNode.style.minWidth = maxWidth + 'px';
 | 
			
		||||
    });
 | 
			
		||||
 | 
			
		||||
    let discrValues = this.element.querySelector('tabs ul');
 | 
			
		||||
| 
						 | 
				
			
			@ -141,8 +141,8 @@ export default class JsonSchema extends BaseComponent {
 | 
			
		|||
    return propData;
 | 
			
		||||
  }
 | 
			
		||||
 | 
			
		||||
  init() {
 | 
			
		||||
    setTimeout(() => this.adjustNameColumnWidth());
 | 
			
		||||
  ngAfterViewInit() {
 | 
			
		||||
    this.adjustNameColumnWidth();
 | 
			
		||||
  }
 | 
			
		||||
}
 | 
			
		||||
JsonSchema.parameters = JsonSchema.parameters.concat([[ElementRef]]);
 | 
			
		||||
| 
						 | 
				
			
			
 | 
			
		|||
| 
						 | 
				
			
			@ -3,6 +3,7 @@
 | 
			
		|||
/* styles for array-schema for array */
 | 
			
		||||
$array-marker-font-sz: 12px;
 | 
			
		||||
$array-marker-line-height: 1.5;
 | 
			
		||||
 | 
			
		||||
.params-wrap.params-array:before, .params-wrap.params-array:after {
 | 
			
		||||
  display: block;
 | 
			
		||||
  font-weight: bold;
 | 
			
		||||
| 
						 | 
				
			
			
 | 
			
		|||
| 
						 | 
				
			
			@ -2,7 +2,7 @@
 | 
			
		|||
<div class="params-wrap">
 | 
			
		||||
  <div *ngFor="#param of data.params" class="param">
 | 
			
		||||
      <div class="param-name">
 | 
			
		||||
        <span> {{param.name}} </span>
 | 
			
		||||
        <span class="param-name-content"> {{param.name}} </span>
 | 
			
		||||
      </div>
 | 
			
		||||
      <div class="param-info">
 | 
			
		||||
        <div>
 | 
			
		||||
| 
						 | 
				
			
			
 | 
			
		|||
		Loading…
	
		Reference in New Issue
	
	Block a user