DevTools Security panel: Update the sidebar to match new Material specs.

third_party/WebKit/Source/devtools/front_end/security/sidebar.css

Index: third_party/WebKit/Source/devtools/front_end/security/sidebar.css
diff --git a/third_party/WebKit/Source/devtools/front_end/security/sidebar.css b/third_party/WebKit/Source/devtools/front_end/security/sidebar.css
index 695312156e4e6d39e096313a094a550479fbc31f..be742dc702868f6dc5a6e2f29a274d726d62a0f1 100644
--- a/third_party/WebKit/Source/devtools/front_end/security/sidebar.css
+++ b/third_party/WebKit/Source/devtools/front_end/security/sidebar.css
@@ -7,57 +7,32 @@
     padding: 0;
 }
 
-.tree-outline li {
-    display: flex;
-    flex-direction: row;
-    align-items: center;
+.tree-outline li::before {
+    /* Hide dropdown triangles, since the Security panel doesn't use them. */

[pfeldman, 2016/08/13 00:08:09]

They still work though.

[lgarron, 2016/08/13 00:42:27]

Really? I can't click on them.

(Note: this is not a new part of the file, I just moved it up and added a
clarifying comment because the purpose wasn't immediately obvious to me.)

+    content: none;
 }
 
-.tree-outline:focus li.selected .lock-icon,
-.tree-outline:focus .security-sidebar-tree-item.selected .icon
-{
+.tree-outline:focus li.selected .icon {
     background-color: white;
 }
 
 .tree-outline .security-main-view-sidebar-tree-item {
-    border-bottom: 1px solid rgb(230, 230, 230);
-    padding: 16px 0;
-}
-
-.tree-outline .security-sidebar-origins {
-    padding: 1px 8px 6px 8px;
-    margin-top: 1em;
-    margin-bottom: 0.5em;
-    color: rgb(90, 90, 90);
-}
-
-.tree-outline ol {
-    padding-left: 0;
-}
-
-.tree-outline li::before {
-    content: none;
-}
-
-.tree-outline .security-main-view-sidebar-tree-item,
-.tree-outline .security-sidebar-origins,
-.tree-outline .sidebar-tree-section + .children > .sidebar-tree-item {
-    padding-left: 16px;
+    border-bottom: 1px solid #DDD;
+    padding: 16px 12px;
 }
 
 .tree-outline .sidebar-tree-item .lock-icon,
 .tree-outline .sidebar-tree-item .security-property {
     margin-right: 4px;
-    flex: none;
 }
 
-.security-sidebar-tree-item {
-    padding: 2px 0;
+.tree-outline .security-sidebar-origins {
+    color: rgba(0, 0, 0, 0.5);
+    padding: 16px 12px 8px;
 }
 
-.security-sidebar-tree-item .titles {
-    overflow: hidden;
-    margin-right: 5px;
+.security-sidebar-tree-item {
+    padding: 2px 0px;
 }
 
 .sidebar-tree-item.security-main-view-reload-message .title {