Diff
Modified: trunk/Source/WebInspectorUI/ChangeLog (202063 => 202064)
--- trunk/Source/WebInspectorUI/ChangeLog 2016-06-14 21:28:37 UTC (rev 202063)
+++ trunk/Source/WebInspectorUI/ChangeLog 2016-06-14 21:42:35 UTC (rev 202064)
@@ -1,3 +1,39 @@
+2016-06-14 Nikita Vasilyev <nvasil...@apple.com>
+
+ Web Inspector: Introduce --navigation-bar-height CSS variable
+ https://bugs.webkit.org/show_bug.cgi?id=158752
+
+ Reviewed by Timothy Hatcher.
+
+ Abstract a commonly repeated height value (29px) into a variable.
+
+ * UserInterface/Views/CSSStyleDetailsSidebarPanel.css:
+ (.sidebar > .panel.details.css-style > .content.has-filter-bar):
+ * UserInterface/Views/DebuggerSidebarPanel.css:
+ (.sidebar > .panel.navigation.debugger > :matches(.content, .empty-content-placeholder)):
+ * UserInterface/Views/FilterBar.css:
+ (.filter-bar):
+ * UserInterface/Views/NavigationBar.css:
+ (.navigation-bar):
+ * UserInterface/Views/NavigationSidebarPanel.css:
+ (.sidebar > .panel.navigation > .content):
+ (.sidebar > .panel.navigation > .overflow-shadow.top):
+ * UserInterface/Views/NetworkSidebarPanel.css:
+ (.sidebar > .panel.navigation.network > .title-bar):
+ * UserInterface/Views/ResourceSidebarPanel.css:
+ (.sidebar > .panel.navigation.resource > :matches(.content, .empty-content-placeholder)):
+ * UserInterface/Views/SearchSidebarPanel.css:
+ (.sidebar > .panel.navigation.search > :matches(.content, .empty-content-placeholder)):
+ (.sidebar > .panel.navigation.search > .search-bar):
+ * UserInterface/Views/Sidebar.css:
+ (.sidebar.has-navigation-bar > .panel):
+ * UserInterface/Views/StorageSidebarPanel.css:
+ (.sidebar > .panel.navigation.storage > :matches(.content, .empty-content-placeholder)):
+ * UserInterface/Views/TimelineRecordingContentView.css:
+ (.content-view.timeline-recording > .content-browser .recording-progress):
+ * UserInterface/Views/Variables.css:
+ (:root):
+
2016-06-14 Saam Barati <sbar...@apple.com>
Follow up to: Web Inspector: Call Trees view should have a 'Top Functions'-like mode
Modified: trunk/Source/WebInspectorUI/UserInterface/Views/CSSStyleDetailsSidebarPanel.css (202063 => 202064)
--- trunk/Source/WebInspectorUI/UserInterface/Views/CSSStyleDetailsSidebarPanel.css 2016-06-14 21:28:37 UTC (rev 202063)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/CSSStyleDetailsSidebarPanel.css 2016-06-14 21:42:35 UTC (rev 202064)
@@ -35,7 +35,7 @@
}
.sidebar > .panel.details.css-style > .content.has-filter-bar {
- bottom: 28px;
+ bottom: calc(var(--navigation-bar-height) - 1px);
}
.sidebar > .panel.details.css-style > .content > .pseudo-classes {
Modified: trunk/Source/WebInspectorUI/UserInterface/Views/DebuggerSidebarPanel.css (202063 => 202064)
--- trunk/Source/WebInspectorUI/UserInterface/Views/DebuggerSidebarPanel.css 2016-06-14 21:28:37 UTC (rev 202063)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/DebuggerSidebarPanel.css 2016-06-14 21:42:35 UTC (rev 202064)
@@ -24,7 +24,7 @@
*/
.sidebar > .panel.navigation.debugger > :matches(.content, .empty-content-placeholder) {
- top: 29px;
+ top: var(--navigation-bar-height);
}
.sidebar > .panel.navigation.debugger > .navigation-bar {
Modified: trunk/Source/WebInspectorUI/UserInterface/Views/FilterBar.css (202063 => 202064)
--- trunk/Source/WebInspectorUI/UserInterface/Views/FilterBar.css 2016-06-14 21:28:37 UTC (rev 202063)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/FilterBar.css 2016-06-14 21:42:35 UTC (rev 202064)
@@ -26,7 +26,7 @@
.filter-bar {
display: flex;
- height: 29px;
+ height: var(--navigation-bar-height);
white-space: nowrap;
overflow: hidden;
Modified: trunk/Source/WebInspectorUI/UserInterface/Views/NavigationBar.css (202063 => 202064)
--- trunk/Source/WebInspectorUI/UserInterface/Views/NavigationBar.css 2016-06-14 21:28:37 UTC (rev 202063)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/NavigationBar.css 2016-06-14 21:42:35 UTC (rev 202064)
@@ -30,7 +30,7 @@
border-bottom: 1px solid var(--border-color);
- height: 29px;
+ height: var(--navigation-bar-height);
white-space: nowrap;
overflow: hidden;
Modified: trunk/Source/WebInspectorUI/UserInterface/Views/NavigationSidebarPanel.css (202063 => 202064)
--- trunk/Source/WebInspectorUI/UserInterface/Views/NavigationSidebarPanel.css 2016-06-14 21:28:37 UTC (rev 202063)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/NavigationSidebarPanel.css 2016-06-14 21:42:35 UTC (rev 202064)
@@ -24,7 +24,7 @@
*/
.sidebar > .panel.navigation > .content {
- bottom: 29px;
+ bottom: var(--navigation-bar-height);
}
.sidebar > .panel.navigation > .filter-bar {
@@ -49,7 +49,7 @@
}
.sidebar > .panel.navigation > .overflow-shadow.top {
- top: 28px;
+ top: calc(var(--navigation-bar-height) - 1px);
bottom: initial;
}
Modified: trunk/Source/WebInspectorUI/UserInterface/Views/NetworkSidebarPanel.css (202063 => 202064)
--- trunk/Source/WebInspectorUI/UserInterface/Views/NetworkSidebarPanel.css 2016-06-14 21:28:37 UTC (rev 202063)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/NetworkSidebarPanel.css 2016-06-14 21:42:35 UTC (rev 202064)
@@ -36,7 +36,7 @@
.sidebar > .panel.navigation.network > .title-bar {
position: absolute;
- top: 29px;
+ top: var(--navigation-bar-height);
left: 0;
right: 0;
Modified: trunk/Source/WebInspectorUI/UserInterface/Views/ResourceSidebarPanel.css (202063 => 202064)
--- trunk/Source/WebInspectorUI/UserInterface/Views/ResourceSidebarPanel.css 2016-06-14 21:28:37 UTC (rev 202063)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/ResourceSidebarPanel.css 2016-06-14 21:42:35 UTC (rev 202064)
@@ -24,7 +24,7 @@
*/
.sidebar > .panel.navigation.resource > :matches(.content, .empty-content-placeholder) {
- top: 29px;
+ top: var(--navigation-bar-height);
}
.sidebar > .panel.navigation.resource > .navigation-bar {
Modified: trunk/Source/WebInspectorUI/UserInterface/Views/SearchSidebarPanel.css (202063 => 202064)
--- trunk/Source/WebInspectorUI/UserInterface/Views/SearchSidebarPanel.css 2016-06-14 21:28:37 UTC (rev 202063)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/SearchSidebarPanel.css 2016-06-14 21:42:35 UTC (rev 202064)
@@ -24,7 +24,7 @@
*/
.sidebar > .panel.navigation.search > :matches(.content, .empty-content-placeholder) {
- top: 28px;
+ top: calc(var(--navigation-bar-height) - 1px);
}
.sidebar > .panel.navigation.search > .search-bar {
@@ -35,7 +35,7 @@
display: flex;
- height: 28px;
+ height: calc(var(--navigation-bar-height) - 1px);
white-space: nowrap;
overflow: hidden;
Modified: trunk/Source/WebInspectorUI/UserInterface/Views/Sidebar.css (202063 => 202064)
--- trunk/Source/WebInspectorUI/UserInterface/Views/Sidebar.css 2016-06-14 21:28:37 UTC (rev 202063)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/Sidebar.css 2016-06-14 21:42:35 UTC (rev 202064)
@@ -57,7 +57,7 @@
}
.sidebar.has-navigation-bar > .panel {
- top: 29px;
+ top: var(--navigation-bar-height);
}
.sidebar > .panel.selected {
Modified: trunk/Source/WebInspectorUI/UserInterface/Views/StorageSidebarPanel.css (202063 => 202064)
--- trunk/Source/WebInspectorUI/UserInterface/Views/StorageSidebarPanel.css 2016-06-14 21:28:37 UTC (rev 202063)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/StorageSidebarPanel.css 2016-06-14 21:42:35 UTC (rev 202064)
@@ -24,7 +24,7 @@
*/
.sidebar > .panel.navigation.storage > :matches(.content, .empty-content-placeholder) {
- top: 29px;
+ top: var(--navigation-bar-height);
}
.sidebar > .panel.navigation.storage > .navigation-bar {
Modified: trunk/Source/WebInspectorUI/UserInterface/Views/TimelineRecordingContentView.css (202063 => 202064)
--- trunk/Source/WebInspectorUI/UserInterface/Views/TimelineRecordingContentView.css 2016-06-14 21:28:37 UTC (rev 202063)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/TimelineRecordingContentView.css 2016-06-14 21:42:35 UTC (rev 202064)
@@ -66,7 +66,7 @@
position: absolute;
left: 0;
right: 0;
- top: 29px;
+ top: var(--navigation-bar-height);
bottom: 0;
text-align: center;
background-color: var(--panel-background-color-light);
Modified: trunk/Source/WebInspectorUI/UserInterface/Views/Variables.css (202063 => 202064)
--- trunk/Source/WebInspectorUI/UserInterface/Views/Variables.css 2016-06-14 21:28:37 UTC (rev 202063)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/Variables.css 2016-06-14 21:42:35 UTC (rev 202064)
@@ -75,6 +75,7 @@
--toolbar-height: 36px;
--tab-bar-height: 24px;
+ --navigation-bar-height: 29px;
}
body.window-inactive {
