mongodb-js · kangas · May 20, 2015 · May 20, 2015 · May 20, 2015
diff --git a/scout-ui/src/field-list/array-field.jade b/scout-ui/src/field-list/array-field.jade
@@ -1,4 +1,5 @@
 .schema-field.schema-field-array
+  hr.field-divider
   .schema-field-name
     span.caret
     span(data-hook='name')

diff --git a/scout-ui/src/field-list/basic-field.jade b/scout-ui/src/field-list/basic-field.jade
@@ -1,7 +1,8 @@
 .schema-field.schema-field-basic
-  .schema-field-name(data-hook='name')
+  hr.field-divider
   .row
     .col-sm-4
+      .schema-field-name(data-hook='name')
       div(data-hook='types-container')
-    .col-sm-8
+    .col-sm-7.col-sm-offset-1
       div(data-hook='minicharts-container')
diff --git a/scout-ui/src/field-list/object-field.jade b/scout-ui/src/field-list/object-field.jade
@@ -1,4 +1,5 @@
 .schema-field.schema-field-object
+  hr.field-divider
   .schema-field-name
     span.caret
     span(data-hook='name')

diff --git a/scout-ui/src/home/index.less b/scout-ui/src/home/index.less
@@ -58,27 +58,27 @@
 
   .schema-field {
     // .list-group-item;
-    border-bottom: 1px solid @gray7;
-    padding: 12px 0;
+    // padding: 12px 0;
     margin: 12px 0;
 
-    // second level
+    hr.field-divider {
+      margin-bottom: 12px;
+      border-top: 1px solid @gray7;
+    }
+
     .schema-field-list {
-      .schema-field-name {
-        margin-left: 50px;
-      }
-      .schema-field-type-list {
+      // second level
+      .schema-field-name,
+      .schema-field-type-list,
+      hr.field-divider {
         margin-left: 50px;
       }
 
       // third level
-      .schema-field-list {
-        .schema-field-name {
-          margin-left: 100px;
-        }
-        .schema-field-type-list {
-          margin-left: 100px;
-        }
+      .schema-field-name,
+      .schema-field-type-list,
+      hr.field-divider {
+        margin-left: 100px;
       }
     }
 
@@ -127,6 +127,7 @@
 
   .schema-field-type {
     .progress-bar;
+    margin-right: 2px;
     background: @gray1;
   }
 

diff --git a/scout-ui/src/minicharts/index.less b/scout-ui/src/minicharts/index.less
@@ -4,28 +4,31 @@
 @mc-bar-hl: #BEDFF0;
 
 div.minichart.unique {
-  font: 12px sans-serif;
-
-  .desc {
-    font-weight: bold;
-    i.fa {
-      padding-right: 5px;
-      color: #999;
-      cursor: pointer;
-    }
-  }
+  font-size: 12px;
 
-  .value {
+  dl.dl-horizontal {
+    padding-top: 12px;
+    max-height: 112px;
     overflow: hidden;
+
+    dt {
+      color: @gray3;
+      width: 20px;
 
-    ul {
-      white-space: nowrap;
-      list-style-type: none;
-      li {
+      a {
+        color: @gray3;
         display: inline-block;
-        padding-right: 10px;
+
+        &:hover {
+          text-decoration: none;
+          color: @gray1;
+        }
       }
     }
+    dd {
+      margin-left: 30px;
+      overflow: hidden;
+    }
   }
 }
 

diff --git a/scout-ui/src/minicharts/unique.jade b/scout-ui/src/minicharts/unique.jade
@@ -1,21 +1,19 @@
 div(data-hook='viz-container')
-  .row
-    .col-sm-3.desc min
-    .col-sm-9.value
-      = minValue
+  dl.dl-horizontal
+    //- dt min
+    //- dd
+    //-   = minValue
 
-  .row
-    .col-sm-3.desc
-      i.fa.fa-refresh(data-hook='refresh')
-      | random
-    .col-sm-9.value
-      ul
+    dt
+      a(href="#")
+        i.mms-icon-continuous(data-hook='refresh')
+    dd
+      ul.list-inline
         each val in randomValues
           li= val
 
-  .row
-    .col-sm-3.desc max
-    .col-sm-9.value
-      = maxValue
+    //- dt max
+    //- dd
+    //-   = maxValue
 
 
diff --git a/scout-ui/src/minicharts/unique.js b/scout-ui/src/minicharts/unique.js
@@ -30,7 +30,7 @@ module.exports = VizView.extend({
       deps: ['orderedValues'],
       cache: false,
       fn: function() {
-        return this.orderedValues.slice(1, 5);
+        return this.orderedValues.slice(1, 15);
       }
     }
   },