CS-14844

-If value label in detail view gets too long, then add horizontal
 scrollbar to value, to avoid truncation

-Lower font size to 11px (-1px) to better fit longer data into UI

reviewed-by: sonny

Author: bfederle

ui/css/cloudstack3.css

@@ -1411,6 +1411,22 @@ div.list-view td.state.off span {
   text-indent: 0;
 }
 
+.detail-group .main-groups table td.value span {
+  display: block;
+  height: 30px;
+  overflow: auto;
+  position: relative;
+  top: 9px;
+}
+
+.detail-group .main-groups table td.value span {
+  width: 355px;
+}
+
+.panel.always-maximized .detail-group .main-groups table td.value span {
+  width: 565px;
+}
+
 .detail-group.head table td.name {
   padding: 20px 0px 17px;
 }

ui/scripts/ui/widgets/detailView.js

@@ -668,7 +668,7 @@
 
         var $detail = $('<tr></tr>').addClass(key).appendTo($detailTable);
         var $name = $('<td></td>').addClass('name').appendTo($detail);
-        var $value = $('<td></td>').addClass('value').appendTo($detail);
+        var $value = $('<span>').appendTo($('<td></td>').addClass('value').appendTo($detail));
         var content = data[key];
 
         if (this.converter) content = this.converter(content);