1 files changed, 92 insertions, 57 deletions

diff --git a/WebCore/inspector/front-end/inspector.css b/WebCore/inspector/front-end/inspector.css
index 848afdc..0662954 100644
--- a/WebCore/inspector/front-end/inspector.css
+++ b/WebCore/inspector/front-end/inspector.css
@@ -810,6 +810,7 @@ body.platform-linux .monospace, body.platform-linux .source-code {
 .resource-view {
     display: none;
     position: absolute;
+    background: white;
     top: 0;
     left: 0;
     right: 0;
@@ -820,7 +821,7 @@ body.platform-linux .monospace, body.platform-linux .source-code {
     display: block;
 }
 
-.resource-view .scope-bar {
+.resource-view .tabbed-pane-header {
     display: none;
     position: absolute;
     height: 20px;
@@ -831,7 +832,7 @@ body.platform-linux .monospace, body.platform-linux .source-code {
     border-bottom: 1px solid rgb(163, 163, 163);
 }
 
-.resource-view.headers-visible .scope-bar {
+.resource-view.headers-visible .tabbed-pane-header {
     display: block;
 }
 
@@ -1373,10 +1374,10 @@ body.inactive .placard.selected {
 
 .section .properties, .event-bar .event-properties {
     display: none;
-    margin: 0;
-    padding: 2px 6px 3px;
-    list-style: none;
-    min-height: 18px;
+}
+
+.section.expanded .properties, .event-bar.expanded .event-properties {
+    display: block;
 }
 
 .section.no-affect .properties li {
@@ -1387,11 +1388,14 @@ body.inactive .placard.selected {
     opacity: 1.0;
 }
 
-.section.expanded .properties, .event-bar.expanded .event-properties {
-    display: block;
+.properties-tree {
+    margin: 0;
+    padding: 2px 6px 3px;
+    list-style: none;
+    min-height: 18px;
 }
 
-.section .properties li, .event-properties li {
+.properties-tree li {
     margin-left: 12px;
     white-space: nowrap;
     text-overflow: ellipsis;
@@ -1400,26 +1404,11 @@ body.inactive .placard.selected {
     cursor: auto;
 }
 
-.section .properties li.parent, .event-properties li.parent {
+.properties-tree li.parent {
     margin-left: 1px;
 }
 
-.section .properties ol, .event-properties ol, .stack-trace ol, ol.stack-trace {
-    display: none;
-    margin: 0;
-    -webkit-padding-start: 12px;
-    list-style: none;
-}
-
-ol.stack-trace {
-    -webkit-padding-start: 0px;
-}
-
-.section .properties ol.expanded, .event-properties ol.expanded, .stack-trace ol, ol.stack-trace {
-    display: block;
-}
-
-.section .properties li.parent::before, .event-properties li.parent::before {
+.properties-tree li.parent::before {
     content: url(Images/treeRightTriangleBlack.png);
     opacity: 0.75;
     float: left;
@@ -1431,16 +1420,47 @@ ol.stack-trace {
     cursor: default;
 }
 
-.section .properties li.parent.expanded::before, .event-properties li.parent.expanded::before {
+.properties-tree li.parent.expanded::before {
     content: url(Images/treeDownTriangleBlack.png);
     margin-top: 1px;
 }
 
-.section .properties li .info, .event-properties li .info {
+.properties-tree li .info {
     padding-top: 4px;
     padding-bottom: 3px;
 }
 
+.properties-tree ol, .stack-trace ol, ol.stack-trace {
+    display: none;
+    margin: 0;
+    -webkit-padding-start: 12px;
+    list-style: none;
+}
+
+.properties-tree ol.expanded, .stack-trace ol, ol.stack-trace {
+    display: block;
+}
+
+ol.stack-trace {
+    -webkit-padding-start: 0px;
+}
+
+.event-listener-breakpoints .event-category {
+    font-size: 12px;
+    font-weight: bold;
+    color: rgb(110, 110, 110);
+}
+
+.event-listener-breakpoints.properties-tree .children li {
+    margin-left: 17px;
+}
+
+.event-listener-breakpoints .checkbox-elem {
+    float: left;
+    margin-top: 1px;
+    margin-left: 0px;
+}
+
 .section .event-bars {
     display: none;
 }
@@ -2086,22 +2106,27 @@ body.inactive .sidebar {
     background-image: url(Images/glossyHeaderSelectedPressed.png);
 }
 
-.data-grid th.sort-ascending div::after {
+.data-grid th.sort-ascending > div::after {
     position: absolute;
     top: 0;
+    bottom: 0;
     right: 0;
+    height: 12px;
+    margin-bottom: auto;
+    margin-top: auto;
     width: 8px;
-    height: 8px;
     content: url(Images/treeUpTriangleBlack.png);
 }
 
-.data-grid th.sort-descending div::after {
+.data-grid th.sort-descending > div::after {
     position: absolute;
     top: 0;
+    bottom: 0;
     right: 0;
-    margin-top: 1px;
-    width: 8px;
     height: 8px;
+    margin-bottom: auto;
+    margin-top: auto;
+    width: 8px;
     content: url(Images/treeDownTriangleBlack.png);
 }
 
@@ -2560,6 +2585,33 @@ button.enable-toggle-status-bar-item.toggled-on .glyph {
     margin-top: 1px;
 }
 
+.tabbed-pane-header {
+    height: 23px;
+    padding: 0 10px;
+    border-bottom: 1px solid rgb(163, 163, 163);
+}
+
+.tabbed-pane-header li {
+    display: inline-block;
+    margin-top: 2px;
+    font-size: 11px;
+    font-weight: bold;
+    color: rgb(46, 46, 46);
+    background: transparent;
+    text-shadow: rgba(255, 255, 255, 0.5) 0 1px 0;
+    vertical-align: middle;
+    padding: 1px 7px 2px;
+    height: 18px;
+    border: 1px solid transparent;
+    border-bottom: none;
+}
+
+.tabbed-pane-header li.selected {
+    background-color: white;
+    border: 1px solid rgb(163, 163, 163);
+    border-bottom: none;
+}
+
 .scope-bar {
     height: 23px;
     padding: 2px 10px 0;
@@ -2580,7 +2632,7 @@ button.enable-toggle-status-bar-item.toggled-on .glyph {
     vertical-align: middle;
 }
 
-.scope-bar .divider {
+.scope-bar-divider {
     margin: 1px 9px 0 8px;
     background-color: rgba(0, 0, 0, 0.4);
     height: 16px;
@@ -2718,7 +2770,7 @@ button.enable-toggle-status-bar-item.toggled-on .glyph {
 .resources-event-dividers {
     position: absolute;
     left: 0;
-    right: 0;
+    right: 5px;
     height: 100%;
     top: 0;
     z-index: 300;
@@ -3837,8 +3889,7 @@ body.inactive .sidebar-tree-item.selected .bubble.search-matches {
     bottom: 0;
 }
 
-#timeline-view-status-bar-items,
-#profile-view-status-bar-items {
+.status-bar-items {
     position: absolute;
     top: 0;
     bottom: 0;
@@ -3962,30 +4013,10 @@ button.enable-toggle-status-bar-item .glyph {
     -webkit-mask-image: url(Images/excludeButtonGlyph.png);
 }
 
-#storage-view-status-bar-items {
-    position: absolute;
-    top: 0;
-    bottom: 0;
-    left: 200px;
-    overflow: hidden;
-    border-left: 1px solid rgb(184, 184, 184);
-    margin-left: -1px;
-}
-
 .refresh-storage-status-bar-item .glyph {
     -webkit-mask-image: url(Images/reloadButtonGlyph.png);
 }
 
-#storage-view-status-bar-items {
-    position: absolute;
-    top: 0;
-    bottom: 0;
-    left: 200px;
-    overflow: hidden;
-    border-left: 1px solid rgb(184, 184, 184);
-    margin-left: -1px;
-}
-
 ol.breakpoint-list {
     -webkit-padding-start: 2px;
     list-style: none;
@@ -4020,6 +4051,10 @@ ol.breakpoint-list {
     margin: 2px 0 0px 20px;
 }
 
+.breakpoint-list .breakpoint-hit {
+    background-color: yellow;
+}
+
 .webkit-html-js-node, .webkit-html-css-node {
     white-space: pre;
 }