fixed #12: schema representation on Safari

lib/components/JsonSchema/json-schema-common.scss

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

lib/components/JsonSchema/json-schema.html

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

lib/components/JsonSchema/json-schema.js

@@ -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() {
+  ngAfterViewInit() {
-    setTimeout(() => this.adjustNameColumnWidth());
+    this.adjustNameColumnWidth();
   }
 }
 JsonSchema.parameters = JsonSchema.parameters.concat([[ElementRef]]);

lib/components/JsonSchema/json-schema.scss

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

lib/components/ParamsList/params-list.html

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