Converted Observatory code-view element

runtime/observatory/lib/src/elements/css/shared.css

 /* Global styles */
 * {
   margin: 0;
   padding: 0;
   box-sizing: border-box;
 }
 
 body {
   padding-top: 56px;
   color: #333;
@@ skipping 560 matching lines @@
   line-height: 25px;
   height: 25px;
   padding-left: 10%;
   padding-right: 10%;
 }
 
 class-tree virtual-tree .class-tree-item .name {
   margin-left: 0.5em;
 }
 
+/* code-view */
+
+code-view .table {
+  table-layout: fixed;
+}
+
+code-view th:nth-of-type(1),
+code-view td:nth-of-type(1) {
+  min-width: 10em;
+  text-align: left;
+}
+
+code-view th:nth-of-type(2),
+code-view td:nth-of-type(2) {
+  min-width: 8em;
+  text-align: left;
+}
+
+code-view th:nth-of-type(3),
+code-view td:nth-of-type(3) {
+  min-width: 8em;
+  text-align: left;
+}
+
+code-view th:nth-of-type(4),
+code-view td:nth-of-type(4) {
+  text-align: left;
+  overflow: visible;
+  white-space: pre;
+  padding-right: 1em;
+  width: 1px;
+}
+
+code-view th:nth-of-type(5),
+code-view td:nth-of-type(5) {
+  text-align: left;
+  overflow: visible;
+}
+
+code-view tr:hover > td {
+  background-color: #F4C7C3;
+}
+
+code-view .code-comment {
+  color: grey;
+  font-style: italic;
+}
+
 /* context-ref */
 /* TODO(cbernaschina) fix context-ref-wrapped to context-ref when wrapper
 removed */
 
 context-ref-wrapped > a[href]:hover {
     text-decoration: underline;
 }
 context-ref-wrapped > a[href] {
     color: #0489c3;
     text-decoration: none;
@@ skipping 1149 matching lines @@
 
 vm-connect-target > button.delete-button:hover {
   background: #ff0000;
 }
 
 /* vm-connect */
 
 vm-connect ul {
   list-style-type: none;
 }