Changeset 288469 in webkit

Timestamp:

Jan 24, 2022 2:31:35 PM (6 months ago)

Author:

Devin Rousso

Message:

Web Inspector: Network: collapse type filter scope bar into a single button to save space
​https://bugs.webkit.org/show_bug.cgi?id=235537

Reviewed by Patrick Angle.

• UserInterface/Views/NetworkTableContentView.js:

(WI.NetworkTableContentView):

• UserInterface/Views/NetworkTableContentView.css:

(.network-type-filter-scope-bar.default-item-selected:not(:hover)): Added.
(.network-type-filter-scope-bar.default-item-selected:hover): Added.

Location:

trunk/Source/WebInspectorUI

Files:

• ChangeLog (modified) (1 diff)
• UserInterface/Views/NetworkTableContentView.css (modified) (1 diff)
• UserInterface/Views/NetworkTableContentView.js (modified) (2 diffs)

trunk/Source/WebInspectorUI/ChangeLog

@@ +1 @@
+2022-01-24  Devin Rousso  <drousso@apple.com>
+
+        Web Inspector: Network: collapse type filter scope bar into a single button to save space
+        https://bugs.webkit.org/show_bug.cgi?id=235537
+
+        Reviewed by Patrick Angle.
+
+        * UserInterface/Views/NetworkTableContentView.js:
+        (WI.NetworkTableContentView):
+        * UserInterface/Views/NetworkTableContentView.css:
+        (.network-type-filter-scope-bar.default-item-selected:not(:hover)): Added.
+        (.network-type-filter-scope-bar.default-item-selected:hover): Added.
+
 2022-01-21  Nikita Vasilyev  <nvasilyev@apple.com>
 

trunk/Source/WebInspectorUI/UserInterface/Views/NetworkTableContentView.css

@@ -24 +24 @@
  */
 
+.network-type-filter-scope-bar.default-item-selected:not(:hover) {
+    --scope-bar-text-color-override: var(--text-color);
+    --scope-bar-background-color-override: transparent;
+    --scope-bar-border-color-override: transparent;
+}
+
+.network-type-filter-scope-bar.default-item-selected:hover {
+    --scope-bar-background-opacity-override: 0.5;
+}
+
 .content-view.tab.network > .content-browser > .navigation-bar .hierarchical-path .icon {
     margin-inline: 8px 4px;

trunk/Source/WebInspectorUI/UserInterface/Views/NetworkTableContentView.js

@@ -61 +61 @@
         this.element.classList.add("network-table");
 
-        this._typeFilterScopeBarItemAll = new WI.ScopeBarItem("network-type-filter-all", WI.UIString("All"), {exclusive: true});
+        this._typeFilterScopeBarItemAll = new WI.ScopeBarItem("network-type-filter-all", WI.UIString("All"));
         let typeFilterScopeBarItems = [this._typeFilterScopeBarItemAll];
 
@@ -85 +85 @@
         });
 
-        this._typeFilterScopeBar = new WI.ScopeBar("network-type-filter-scope-bar", typeFilterScopeBarItems, typeFilterScopeBarItems[0]);
+        const shouldGroupNonExclusiveItems = true;
+        this._typeFilterScopeBar = new WI.ScopeBar("network-type-filter-scope-bar", typeFilterScopeBarItems, typeFilterScopeBarItems[0], shouldGroupNonExclusiveItems);
         this._typeFilterScopeBar.visibilityPriority = WI.NavigationItem.VisibilityPriority.High;
         this._typeFilterScopeBar.addEventListener(WI.ScopeBar.Event.SelectionChanged, this._typeFilterScopeBarSelectionChanged, this);