diff --git a/lib/components/JsonSchema/json-schema.html b/lib/components/JsonSchema/json-schema.html
index 7cd1203e..aa72d2aa 100644
--- a/lib/components/JsonSchema/json-schema.html
+++ b/lib/components/JsonSchema/json-schema.html
@@ -2,7 +2,7 @@
   <div *ng-for="#prop of data.properties" class="param-wrap">
     <div class="param">
       <div class="param-name">
-        <span> {{prop._name}} </span>
+        <span>{{prop._name}}</span>
       </div>
       <div class="param-info">
         <div>
diff --git a/lib/components/JsonSchema/json-schema.scss b/lib/components/JsonSchema/json-schema.scss
index 63339942..2e2ccd77 100644
--- a/lib/components/JsonSchema/json-schema.scss
+++ b/lib/components/JsonSchema/json-schema.scss
@@ -1,9 +1,19 @@
 @import '../../common/styles/variables';
+$lines-width: 1px;
+$bullet-size: 7px;
+$cell-spacing: 25px;
+$cell-padding: 5px;
+$bullet-margin: 10px;
+$line-border: $lines-width solid $tree-lines-color;
+$line-border-erase: $lines-width solid white;
+
+$param-name-height: 20px;
+
+$sub-schema-offset: ($bullet-size/2) + $bullet-margin;
 
 .param-schema {
-  padding-left: 13px;
-  padding-top: 5px;
-  border-left: 1px solid #7D97CE;
+  padding-left: $sub-schema-offset - $lines-width;
+  border-left: $line-border;
 }
 
 .param-wrap {
@@ -13,22 +23,32 @@
 .param-schema:before {
   content: "";
   position: absolute;
-  left: 14px;
-  top: 10px;
+  left: $sub-schema-offset;
+  top: ($param-name-height/2) + $cell-padding;
   bottom: 0;
-  border-left: 1px solid $tree-lines-color;
+  border-left: $line-border;
 }
 
 .param-name {
-  padding: 0 5px;
+  font-size: 14px;
+  padding: $cell-padding $cell-spacing $cell-padding 0;
   font-weight: bold;
   box-sizing: border-box;
+  line-height: $param-name-height;
+  border-left: $line-border;
+  white-space: nowrap;
+  position: relative;
+
+  > span {
+    vertical-align: middle;
+  }
 }
 
 .param-info {
   width: 100%;
-  padding: 0 5px;
+  padding: $cell-padding 0;
   box-sizing: border-box;
+  border-bottom: 1px solid #ccc;
 }
 
 .param {
@@ -39,64 +59,58 @@
   color: red;
   font-weight: bold;
   font-size: 12px;
-}
-
-.param-description {
-  padding: 0.5em 0;
-  border-bottom: 1px solid #999;
+  line-height: $param-name-height;
+  vertical-align: middle;
 }
 
 .param-type {
   text-transform: capitalize;
   color: #999;
   font-size: 12px;
-  line-height: 2;
+  line-height: $param-name-height;
+  vertical-align: middle;
   font-weight: bold;
 }
 
-.param-name {
-  border-left: 1px solid $tree-lines-color;
-  white-space: nowrap;
-  position: relative;
-}
 /* tree */
+
+// Bullet
 .param-name > span:before {
   content: "";
   display: inline-block;
-  width: 8px;
-  height: 8px;
+  width: $bullet-size;
+  height: $bullet-size;
   background-color: $tree-lines-color;
-  margin: 0 5px;
-  top: -1px;
-  position: relative;
+  margin: 0 $bullet-margin;
+  vertical-align: middle;
 }
 
 .param-name > span:after {
   content: "";
   position: absolute;
-  border-top: 1px solid $tree-lines-color;
-  width: 10px;
+  border-top: $line-border;
+  width: $bullet-margin;
   left: 0;
-  top: 10px;
+  top: ($param-name-height/2) + $cell-padding;
 }
 
 .param-wrap:first-of-type .param-name:before {
   content: "";
   display: block;
   position: absolute;
-  left: -1px;
-  width: 1px;
-  background-color: white;
-  height: 10px;
+  left: -$lines-width;
+  top: 0;
+  border-left: $line-border-erase;
+  height: ($param-name-height/2) + $cell-padding;
 }
 
 .param-wrap:last-of-type > .param > .param-name:after {
   content: "";
   display: block;
   position: absolute;
-  left: -1px;
-  width: 1px;
-  top: 11px;
+  left: -$lines-width;
+  border-left: $line-border-erase;
+  top: ($param-name-height/2) + $cell-padding + $lines-width;
   background-color: white;
   bottom: 0;
 }
diff --git a/lib/components/ParamsList/params-list.html b/lib/components/ParamsList/params-list.html
index 4d3ba560..5d72fa55 100644
--- a/lib/components/ParamsList/params-list.html
+++ b/lib/components/ParamsList/params-list.html
@@ -1,16 +1,16 @@
 <h2 class="param-list-header" *ng-if="data.params.length"> Parameters </h2>
 <div class="params-wrap">
   <div *ng-for="#param of data.params" class="param">
-    <div class="param-name">
-      <span> {{param.name}} </span>
-    </div>
-    <div class="param-info">
-      <div>
-        <span class="param-type" [ng-class]="param.type">{{param.type}}</span>
-        <span *ng-if="param.required" class="param-required">Required</span>
+      <div class="param-name">
+        <span> {{param.name}} </span>
+      </div>
+      <div class="param-info">
+        <div>
+          <span class="param-type" [ng-class]="param.type">{{param.type}}</span>
+          <span *ng-if="param.required" class="param-required">Required</span>
+        </div>
+        <div class="param-description" inner-html="{{param.description | marked}}"></div>
       </div>
-      <div class="param-description" inner-html="{{param.description | marked}}"></div>
-    </div>
   </div>
 </div>
 
diff --git a/lib/components/ParamsList/params-list.scss b/lib/components/ParamsList/params-list.scss
index 793a5a84..af9a4d91 100644
--- a/lib/components/ParamsList/params-list.scss
+++ b/lib/components/ParamsList/params-list.scss
@@ -1,5 +1,3 @@
-@import '../../common/styles/variables';
-
 .param-list-header {
   border-bottom: 1px solid #999;
   font-size: 18px;
@@ -8,87 +6,44 @@
   color: #253137;
 }
 
+@import '../JsonSchema/json-schema.scss';
+
+
+// paramters can't be multilevel so table representation works for it without javascript
 .params-wrap {
   display: table;
 }
 
 .param-name {
   display: table-cell;
-  padding: 0 5px;
-  font-weight: bold;
+  vertical-align: top;
 }
 
 .param-info {
   display: table-cell;
-  width: 100%;
-  padding: 0 5px;
 }
 
 .param {
   display: table-row;
 }
 
-.param-required {
-  color: red;
-  font-weight: bold;
-  font-size: 12px;
-}
-
-.param-description {
-  padding: 0.5em 0;
-  border-bottom: 1px solid #999;
-}
-
-.param-type {
-  text-transform: capitalize;
-  color: #999;
-  font-weight: bold;
-  font-size: 12px;
-}
-
-.param-name {
-  border-left: 1px solid $tree-lines-color;
-  white-space: nowrap;
-  position: relative;
-}
-/* tree */
-.param-name > span:before {
-  content: "";
-  display: inline-block;
-  width: 8px;
-  height: 8px;
-  background-color: $tree-lines-color;
-  margin: 0 5px;
-  top: -1px;
-  position: relative;
-}
-
-.param-name > span:after {
-  content: "";
-  position: absolute;
-  border-top: 1px solid $tree-lines-color;
-  width: 10px;
-  left: 0;
-  top: 10px;
-}
-
 .param:first-of-type .param-name:before {
   content: "";
   display: block;
   position: absolute;
-  left: -2px;
-  width: 2px;
-  background-color: white;
-  height: 10px;
+  left: -$lines-width;
+  top: 0;
+  border-left: $line-border-erase;
+  height: ($param-name-height/2) + $cell-padding;
 }
 
 .param:last-of-type .param-name:after {
   content: "";
   display: block;
   position: absolute;
-  left: -2px;
-  width: 2px;
-  top: 11px;
+  left: -$lines-width;
+  border-left: $line-border-erase;
+  top: ($param-name-height/2) + $cell-padding + $lines-width;
   background-color: white;
   bottom: 0;
 }