fixed #12: schema representation on Safari

This commit is contained in:
Roman Hotsiy 2016-02-06 18:02:10 +02:00
parent e861ae9add
commit 7f57558225
5 changed files with 15 additions and 7 deletions

View File

@ -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 {

View File

@ -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>

View File

@ -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]]);

View File

@ -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;

View File

@ -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>