⚠ Archived content — this site is no longer maintained.   Current WebKit documentation is at docs.webkit.org.

Changeset 249118 in webkit


Ignore:
Timestamp:
Aug 26, 2019, 2:59:24 PM (7 years ago)
Author:
Devin Rousso
Message:

Web Inspector: decrease horizontal padding of WI.ScopeBar to have more room
​https://bugs.webkit.org/show_bug.cgi?id=201090

Reviewed by Joseph Pecoraro.

There's a lot of "wasted" padding space around each item that we could reuse (or "move") for
other navigation items.

  • UserInterface/Views/FilterBar.css:

(.filter-bar > .navigation-bar > .item.scope-bar):

  • UserInterface/Views/RadioButtonNavigationItem.css:

(.navigation-bar .item.radio.button.text-only):

  • UserInterface/Views/ScopeBar.css:

(.scope-bar):
(body[dir=ltr] .scope-bar > li.multiple > select):
(body[dir=rtl] .scope-bar > li.multiple > select):
(.scope-bar > li.multiple > .arrows):

  • UserInterface/Views/RadioButtonNavigationItem.js:

(WI.RadioButtonNavigationItem):
(WI.RadioButtonNavigationItem.prototype.update): Deleted.
There's no reason to forcibly set the min-width since all instances are just text.

  • UserInterface/Views/AuditTestGroupContentView.js:

(WI.AuditTestGroupContentView.prototype.initialLayout):

  • UserInterface/Views/AuditTestGroupContentView.css:

(.content-view.audit-test-group > header > nav:not(:empty):before): Deleted.
Remove the unnecessary "Showing: " prefix before the WI.ScopeBar.

  • UserInterface/Views/ScopeRadioButtonNavigationItem.js: Removed.
  • UserInterface/Views/ScopeRadioButtonNavigationItem.css: Removed.

These classes were never used.

  • Localizations/en.lproj/localizedStrings.js:
Location:
trunk/Source/WebInspectorUI
Files:
2 deleted
9 edited

Legend:

Unmodified
Added
Removed

  • trunk/Source/WebInspectorUI/ChangeLog

    r249089 r249118  
     12019-08-26  Devin Rousso  <drousso@apple.com>
     2
     3        Web Inspector: decrease horizontal padding of `WI.ScopeBar` to have more room
     4        https://bugs.webkit.org/show_bug.cgi?id=201090
     5
     6        Reviewed by Joseph Pecoraro.
     7
     8        There's a lot of "wasted" padding space around each item that we could reuse (or "move") for
     9        other navigation items.
     10
     11        * UserInterface/Views/FilterBar.css:
     12        (.filter-bar > .navigation-bar > .item.scope-bar):
     13        * UserInterface/Views/RadioButtonNavigationItem.css:
     14        (.navigation-bar .item.radio.button.text-only):
     15        * UserInterface/Views/ScopeBar.css:
     16        (.scope-bar):
     17        (body[dir=ltr] .scope-bar > li.multiple > select):
     18        (body[dir=rtl] .scope-bar > li.multiple > select):
     19        (.scope-bar > li.multiple > .arrows):
     20
     21        * UserInterface/Views/RadioButtonNavigationItem.js:
     22        (WI.RadioButtonNavigationItem):
     23        (WI.RadioButtonNavigationItem.prototype.update): Deleted.
     24        There's no reason to forcibly set the `min-width` since all instances are just text.
     25
     26        * UserInterface/Views/AuditTestGroupContentView.js:
     27        (WI.AuditTestGroupContentView.prototype.initialLayout):
     28        * UserInterface/Views/AuditTestGroupContentView.css:
     29        (.content-view.audit-test-group > header > nav:not(:empty):before): Deleted.
     30        Remove the unnecessary "Showing: " prefix before the `WI.ScopeBar`.
     31
     32        * UserInterface/Views/ScopeRadioButtonNavigationItem.js: Removed.
     33        * UserInterface/Views/ScopeRadioButtonNavigationItem.css: Removed.
     34        These classes were never used.
     35
     36        * Localizations/en.lproj/localizedStrings.js:
     37
    1382019-08-24  Devin Rousso  <drousso@apple.com>
    239

  • trunk/Source/WebInspectorUI/Localizations/en.lproj/localizedStrings.js

    r248916 r249118  
    10191019localizedStrings["Show warnings logged to the Console"] = "Show warnings logged to the Console";
    10201020localizedStrings["Show:"] = "Show:";
    1021 localizedStrings["Showing:"] = "Showing:";
    10221021localizedStrings["Site-specific Hacks"] = "Site-specific Hacks";
    10231022localizedStrings["Size"] = "Size";

  • trunk/Source/WebInspectorUI/UserInterface/Main.html

    r248912 r249118  
    183183    <link rel="stylesheet" href="Views/ScopeBar.css">
    184184    <link rel="stylesheet" href="Views/ScopeChainDetailsSidebarPanel.css">
    185     <link rel="stylesheet" href="Views/ScopeRadioButtonNavigationItem.css">
    186185    <link rel="stylesheet" href="Views/ScriptContentView.css">
    187186    <link rel="stylesheet" href="Views/ScriptDetailsTimelineView.css">
    … …  
    778777    <script src="Views/ScopeBarItem.js"></script>
    779778    <script src="Views/ScopeChainDetailsSidebarPanel.js"></script>
    780     <script src="Views/ScopeRadioButtonNavigationItem.js"></script>
    781779    <script src="Views/ScriptClusterTimelineView.js"></script>
    782780    <script src="Views/ScriptContentView.js"></script>

  • trunk/Source/WebInspectorUI/UserInterface/Views/AuditTestGroupContentView.css

    r244353 r249118  
    7373.content-view.audit-test-group > header > nav:empty {
    7474    display: none;
    75 }
    76 
    77 .content-view.audit-test-group > header > nav:not(:empty):before {
    78     content: attr(data-prefix);
    7975}
    8076

  • trunk/Source/WebInspectorUI/UserInterface/Views/AuditTestGroupContentView.js

    r245827 r249118  
    5757
    5858        this._levelNavigationBar = new WI.NavigationBar(document.createElement("nav"));
    59         this._levelNavigationBar.element.dataset.prefix = WI.UIString("Showing:");
    6059        this.headerView.addSubview(this._levelNavigationBar);
    6160

  • trunk/Source/WebInspectorUI/UserInterface/Views/FilterBar.css

    r248940 r249118  
    4848
    4949.filter-bar > .navigation-bar > .item.scope-bar {
    50     --scope-bar-padding-override: 4px;
    5150    --scope-bar-margin-override: 0;
    5251}

  • trunk/Source/WebInspectorUI/UserInterface/Views/RadioButtonNavigationItem.css

    r242118 r249118  
    3434.navigation-bar .item.radio.button.text-only {
    3535    position: relative;
    36     padding: 2px 9px 4px;
     36    padding: 2px 4px 4px;
    3737    border: none;
    3838    z-index: 0;

  • trunk/Source/WebInspectorUI/UserInterface/Views/RadioButtonNavigationItem.js

    r248818 r249118  
    2929    {
    3030        super(identifier, toolTip, image, imageWidth, imageHeight, null, "tab");
    31 
    32         this._initializedMinWidth = false;
    3331    }
    3432
    … …  
    6159    }
    6260
    63     update(options = {})
    64     {
    65         super.update(options);
    66 
    67         if (options.expandOnly)
    68             return;
    69 
    70         var isSelected = this.selected;
    71 
    72         if (!isSelected) {
    73             this.element.classList.add(WI.RadioButtonNavigationItem.SelectedStyleClassName);
    74             this.element.setAttribute("aria-selected", "true");
    75         }
    76 
    77         if (!this._initializedMinWidth) {
    78             var width = this.element.offsetWidth;
    79             if (width) {
    80                 this._initializedMinWidth = true;
    81                 this.element.style.minWidth = width + "px";
    82             }
    83         }
    84 
    85         if (!isSelected) {
    86             this.element.classList.remove(WI.RadioButtonNavigationItem.SelectedStyleClassName);
    87             this.element.setAttribute("aria-selected", "false");
    88         }
    89     }
    90 
    9161    // Protected
    9262

  • trunk/Source/WebInspectorUI/UserInterface/Views/ScopeBar.css

    r248916 r249118  
    2929
    3030    --scope-bar-margin-default: 2px;
    31     --scope-bar-padding-default: 9px;
     31    --scope-bar-padding-default: 4px;
    3232    --scope-bar-text-color-default: var(--text-color);
    3333    --scope-bar-background-color-default: unset;
    … …  
    9898
    9999body[dir=ltr] .scope-bar > li.multiple > select {
    100     left: calc(var(--scope-bar-padding) - var(--scope-bar-padding-default) + 1px);
     100    left: calc(var(--scope-bar-padding) - var(--scope-bar-padding-default) - 4px);
    101101}
    102102
    103103body[dir=rtl] .scope-bar > li.multiple > select {
    104     right: calc(var(--scope-bar-padding) - var(--scope-bar-padding-default) + 1px);
     104    right: calc(var(--scope-bar-padding) - var(--scope-bar-padding-default) - 4px);
    105105}
    106106
    … …  
    117117    margin-bottom: -1px;
    118118    -webkit-margin-start: 6px;
     119    -webkit-margin-end: 2px;
    119120}
Note: See TracChangeset for help on using the changeset viewer.