now it looks fantastic. Nothing under!

client/partials/directives/key.html

@@ -3,6 +3,7 @@
     
     <span ng-style="{visibility: showTools ? 'inline': 'hidden'}">
         <!-- place to but some hoover information-->
+        <i class="fa fa-signal" ng-show="canMakeHistogram"></i> 
     </span>
     <span class="right" style="color:#008CBA;">
         <i class="fa fa-sort-numeric-asc" ng-show="hasIndexAsc"></i>

client/partials/directives/value.html

@@ -1,12 +1,19 @@
 <span>
     <span ng-show="isString">
-        <pre> {{value}} </pre>
+        <pre ng-show="isSmallString(value)"> {{value}} </pre>
+        
+        <a ng-hide="isSmallString(value)" ng-href="{{ url() }}">
+            <pre> {{ getSmallPrefix(value) }} </pre>
+        </a>
+        
     </span>
     <span ng-show="isNumber">
         {{value | number | replaceAllCommasBySpaces}}
     </span>
     <span ng-show="isObject || isArray">
-        <pre>{{value | niceJSON}}</pre>
+        <pre ng-show="isSmallObject(value)" >{{value | niceJSON}}</pre>
+        <a ng-hide="isSmallObject(value)" ng-href="{{ url() }}">
+            <pre> {{value | niceJSON | onlyNthLines:5}} </pre>
+        </a>
     </span>
-    
 </span>

client/partials/document.html

@@ -34,10 +34,10 @@
             <tbody>
               <tr ng-repeat="(key, value) in doc">
                 <td style="vertical-align: top;">
-                    <vul-key key-name="key" indexes="meta.indexes" ></vul-key>
+                    <vul-key key-name="key" value="value" indexes="meta.indexes" ></vul-key>
                 </td>
                 <td>
-                    <vul-value value="value"></vul-value>
+                    <vul-value value="value" key="key" doc-id="doc._id"></vul-value>
                 </td>
               </tr>
             </tbody>

client/partials/field.html

@@ -0,0 +1,22 @@
+<div class="row">
+    <div class="large-12 columns" >
+        <dl class="sub-nav" >
+            <dd ng-repeat="f in fields" ng-class="{active: f == field}">
+                <a ng-href="{{ fieldUrl(f) }}">{{ f }}</a>
+            </dd>
+        </dl>
+    </div>
+</div>
+
+<div class="row">
+    <div class="large-12 columns">
+        <pre ng-show="!_.isObject(value)" style="overflow: initial;">
+            {{ value }}
+        </pre>
+        
+        <pre ng-show="_.isObject(value)" style="overflow: initial;">
+            {{ value | niceJSON }}
+        </pre>
+    </div>
+</div>
+