Changeset 246684 in webkit


Ignore:
Timestamp:
Jun 21, 2019 10:53:33 AM (5 years ago)
Author:
Matt Baker
Message:

Web Inspector: remove .legacy-mac/.latest-mac CSS classes, standardize on .latest-mac UI
​https://bugs.webkit.org/show_bug.cgi?id=199109
<rdar://problem/51991129>

Reviewed by Timothy Hatcher.

Drop legacy macOS version support from Web Inspector UI.

  • UserInterface/Base/Main.js:
  • UserInterface/Views/DefaultDashboardView.css:

(@media (prefers-color-scheme: dark)):
(body.latest-mac .toolbar .dashboard .item.button): Deleted.

  • UserInterface/Views/Toolbar.css:

(.toolbar):
(.toolbar .item.button,):
(.toolbar .search-bar > input[type="search"]):
(.toolbar .search-bar > input[type="search"]:focus):
(@media (-webkit-min-device-pixel-ratio: 2)):
(.toolbar .item.button:active):
(body.window-inactive .toolbar .item.button,):
(@media (prefers-color-scheme: dark)):
(.toolbar .search-bar > input[type="search"]::placeholder):
(body.window-inactive .toolbar .search-bar > input[type="search"]::placeholder):
(body.window-inactive .toolbar .search-bar > input[type="search"]::-webkit-search-results-button):
(.toolbar .dashboard-container):
(body .toolbar): Deleted.
(body.legacy-mac .toolbar .item.button,): Deleted.
(body.legacy-mac .toolbar .search-bar > input[type="search"]): Deleted.
(body.legacy-mac .toolbar .search-bar > input[type="search"]:focus): Deleted.
(body.legacy-mac .toolbar .item.button:active): Deleted.
(body.window-inactive.legacy-mac .toolbar .item.button,): Deleted.
(body.latest-mac .toolbar .item.button,): Deleted.
(body.latest-mac .toolbar .search-bar > input[type="search"]): Deleted.
(body.latest-mac .toolbar .search-bar > input[type="search"]:focus): Deleted.
(body.latest-mac .toolbar .item.button:active): Deleted.
(body.latest-mac.window-inactive .toolbar .item.button,): Deleted.
(body.latest-mac .toolbar .search-bar > input[type="search"]::placeholder): Deleted.
(body.latest-mac.window-inactive .toolbar .search-bar > input[type="search"]::placeholder): Deleted.
(body.latest-mac.window-inactive .toolbar .search-bar > input[type="search"]::-webkit-search-results-button): Deleted.
(body.latest-mac .toolbar .dashboard-container): Deleted.

Location:
trunk/Source/WebInspectorUI
Files:
4 edited

Legend:

Unmodified
Added
Removed

  • trunk/Source/WebInspectorUI/ChangeLog

    r246672 r246684  
     12019-06-21  Matt Baker  <mattbaker@apple.com>
     2
     3        Web Inspector: remove .legacy-mac/.latest-mac CSS classes, standardize on .latest-mac UI
     4        https://bugs.webkit.org/show_bug.cgi?id=199109
     5        <rdar://problem/51991129>
     6
     7        Reviewed by Timothy Hatcher.
     8
     9        Drop legacy macOS version support from Web Inspector UI.
     10
     11        * UserInterface/Base/Main.js:
     12
     13        * UserInterface/Views/DefaultDashboardView.css:
     14        (@media (prefers-color-scheme: dark)):
     15        (body.latest-mac .toolbar .dashboard .item.button): Deleted.
     16
     17        * UserInterface/Views/Toolbar.css:
     18        (.toolbar):
     19        (.toolbar .item.button,):
     20        (.toolbar .search-bar > input[type="search"]):
     21        (.toolbar .search-bar > input[type="search"]:focus):
     22        (@media (-webkit-min-device-pixel-ratio: 2)):
     23        (.toolbar .item.button:active):
     24        (body.window-inactive .toolbar .item.button,):
     25        (@media (prefers-color-scheme: dark)):
     26        (.toolbar .search-bar > input[type="search"]::placeholder):
     27        (body.window-inactive .toolbar .search-bar > input[type="search"]::placeholder):
     28        (body.window-inactive .toolbar .search-bar > input[type="search"]::-webkit-search-results-button):
     29        (.toolbar .dashboard-container):
     30        (body .toolbar): Deleted.
     31        (body.legacy-mac .toolbar .item.button,): Deleted.
     32        (body.legacy-mac .toolbar .search-bar > input[type="search"]): Deleted.
     33        (body.legacy-mac .toolbar .search-bar > input[type="search"]:focus): Deleted.
     34        (body.legacy-mac .toolbar .item.button:active): Deleted.
     35        (body.window-inactive.legacy-mac .toolbar .item.button,): Deleted.
     36        (body.latest-mac .toolbar .item.button,): Deleted.
     37        (body.latest-mac .toolbar .search-bar > input[type="search"]): Deleted.
     38        (body.latest-mac .toolbar .search-bar > input[type="search"]:focus): Deleted.
     39        (body.latest-mac .toolbar .item.button:active): Deleted.
     40        (body.latest-mac.window-inactive .toolbar .item.button,): Deleted.
     41        (body.latest-mac .toolbar .search-bar > input[type="search"]::placeholder): Deleted.
     42        (body.latest-mac.window-inactive .toolbar .search-bar > input[type="search"]::placeholder): Deleted.
     43        (body.latest-mac.window-inactive .toolbar .search-bar > input[type="search"]::-webkit-search-results-button): Deleted.
     44        (body.latest-mac .toolbar .dashboard-container): Deleted.
     45
    1462019-06-20  Matt Baker  <mattbaker@apple.com>
    247

  • trunk/Source/WebInspectorUI/UserInterface/Base/Main.js

    r246602 r246684  
    291291        document.body.classList.add("nightly-build");
    292292
    293     if (WI.Platform.name === "mac") {
     293    if (WI.Platform.name === "mac")
    294294        document.body.classList.add(WI.Platform.version.name);
    295 
    296         if (WI.Platform.version.release >= 11)
    297             document.body.classList.add("latest-mac");
    298         else
    299             document.body.classList.add("legacy-mac");
    300     }
    301295
    302296    document.body.classList.add(WI.sharedApp.debuggableType);

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

    r242768 r246684  
    201201    }
    202202
    203     body.latest-mac .toolbar .dashboard .item.button {
    204         background: unset;
    205     }
    206 
    207203    .dashboard-container .advance-arrow {
    208204        filter: var(--filter-invert);

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

    r246666 r246684  
    3939
    4040    outline: none;
    41 }
    42 
    43 body .toolbar {
     41
    4442    background-image: linear-gradient(to bottom, hsl(0, 0%, 92%), hsl(0, 0%, 87%));
    4543    box-shadow: inset hsla(0, 0%, 100%, 0.5) 0 1px 1px;
    … …  
    117115}
    118116
    119 body.legacy-mac .toolbar .item.button,
    120 body.legacy-mac .toolbar .search-bar > input[type="search"],
    121 body.legacy-mac .toolbar .dashboard-container {
    122     background-color: hsl(0, 0%, 99%);
    123     border: 1px solid transparent;
    124     border-top-color: hsl(0, 0%, 100%);
    125     box-shadow: hsla(0, 0%, 0%, 0.15) 0 1px 0;
    126     border-radius: 4px;
    127 }
    128 
    129 body.legacy-mac .toolbar .search-bar > input[type="search"] {
    130     box-shadow: 0 0 0 7px hsla(211, 96%, 48%, 0);
    131     transition: box-shadow .25s cubic-bezier(0.165, 0.840, 0.440, 1) /* easeOutQuart */;
    132 }
    133 
    134 body.legacy-mac .toolbar .search-bar > input[type="search"]:focus {
    135     box-shadow: hsla(0, 0%, 0%, 0.15) 0 1px 0, 0 0 0 3px hsla(211, 96%, 48%, 0.4);
    136 }
    137 
    138 body.legacy-mac .toolbar .item.button:active {
    139     border-top-color: hsl(0, 0%, 94%);
    140     background-color: hsl(0, 0%, 89%);
    141 }
    142 
    143 body.window-inactive.legacy-mac .toolbar .item.button,
    144 body.window-inactive.legacy-mac .toolbar .search-bar > input[type="search"],
    145 body.window-inactive.legacy-mac .toolbar .dashboard-container {
    146     border: 1px solid hsl(0, 0%, 86%);
    147     background-color: hsl(0, 0%, 96%);
    148     box-shadow: none;
    149 }
    150 
    151 body.latest-mac .toolbar .item.button,
    152 body.latest-mac .toolbar .search-bar > input[type="search"],
    153 body.latest-mac .toolbar .dashboard-container {
     117.toolbar .item.button,
     118.toolbar .search-bar > input[type="search"],
     119.toolbar .dashboard-container {
    154120    background-image: linear-gradient(hsl(0, 0%, 99%), var(--panel-background-color));
    155121    box-shadow: hsla(0, 0%, 0%, 0.3) 0 1px 1px -1px;
    … …  
    161127}
    162128
    163 body.latest-mac .toolbar .search-bar > input[type="search"] {
     129.toolbar .search-bar > input[type="search"] {
    164130    box-shadow: hsla(0, 0%, 0%, 0.3) 0 1px 1px -1px, 0 0 0 7px hsla(211, 96%, 48%, 0);
    165131    transition: box-shadow .25s cubic-bezier(0.165, 0.840, 0.440, 1) /* easeOutQuart */;
    166132}
    167133
    168 body.latest-mac .toolbar .search-bar > input[type="search"]:focus {
     134.toolbar .search-bar > input[type="search"]:focus {
    169135    box-shadow: hsla(0, 0%, 0%, 0.15) 0 1px 0, 0 0 0 3px hsla(211, 96%, 48%, 0.4);
    170136}
    171137
    172138@media (-webkit-min-device-pixel-ratio: 2) {
    173     body.latest-mac .toolbar .item.button,
    174     body.latest-mac .toolbar .search-bar > input[type="search"],
    175     body.latest-mac .toolbar .dashboard-container {
     139    .toolbar .item.button,
     140    .toolbar .search-bar > input[type="search"],
     141    .toolbar .dashboard-container {
    176142        border: 0.5px solid hsl(0, 0%, 78%);
    177143        border-top-color: hsl(0, 0%, 80%);
    … …  
    180146}
    181147
    182 body.latest-mac .toolbar .item.button:active {
     148.toolbar .item.button:active {
    183149    background-image: linear-gradient(hsl(0, 0%, 89%), hsl(0, 0%, 86%));
    184150    box-shadow: hsla(0, 0%, 0%, 0.3) 0 1px 1px -1px, inset 0 1px 1px -1px white;
    185151}
    186152
    187 body.latest-mac.window-inactive .toolbar .item.button,
    188 body.latest-mac.window-inactive .toolbar .search-bar > input[type="search"],
    189 body.latest-mac.window-inactive .toolbar .dashboard-container {
     153body.window-inactive .toolbar .item.button,
     154body.window-inactive .toolbar .search-bar > input[type="search"],
     155body.window-inactive .toolbar .dashboard-container {
    190156    opacity: 0.65;
    191157    border-color: hsla(0, 0%, 0%, 0.15);
    … …  
    195161
    196162@media (-webkit-min-device-pixel-ratio: 2) {
    197     body.latest-mac.window-inactive .toolbar .item.button,
    198     body.latest-mac.window-inactive .toolbar .search-bar > input[type="search"],
    199     body.latest-mac.window-inactive .toolbar .dashboard-container {
     163    body.window-inactive .toolbar .item.button,
     164    body.window-inactive .toolbar .search-bar > input[type="search"],
     165    body.window-inactive .toolbar .dashboard-container {
    200166        box-shadow: inset 0 0 1px 0 hsla(0, 0%, 0%, 0.1);
    201167    }
    … …  
    209175
    210176@media (prefers-color-scheme: dark) {
    211     body .toolbar {
     177    .toolbar {
    212178        background-image: linear-gradient(to bottom, hsl(0, 0%, 26%), hsl(0, 0%, 23%));
    213179        box-shadow: none;
    … …  
    218184    }
    219185
    220     body.latest-mac .toolbar .item.button,
    221     body.latest-mac .toolbar .search-bar > input[type="search"] {
     186    .toolbar .item.button,
     187    .toolbar .search-bar > input[type="search"] {
    222188        background-image: none;
    223189        background-color: var(--button-background-color);
    … …  
    227193    }
    228194
    229     body.latest-mac .toolbar .search-bar > input[type="search"] {
     195    .toolbar .search-bar > input[type="search"] {
    230196        color: var(--text-color);
    231197    }
    232198
    233     body.latest-mac .toolbar .search-bar > input[type="search"]:focus {
     199    .toolbar .search-bar > input[type="search"]:focus {
    234200        color: var(--text-color-active);
    235201
    … …  
    241207    }
    242208
    243     body.latest-mac .toolbar .search-bar > input[type="search"]::placeholder {
     209    .toolbar .search-bar > input[type="search"]::placeholder {
    244210        color: var(--text-color-secondary);
    245211    }
    246212
    247     body.latest-mac.window-inactive .toolbar .search-bar > input[type="search"]::placeholder {
     213    body.window-inactive .toolbar .search-bar > input[type="search"]::placeholder {
    248214        color: var(--text-color-tertiary);
    249215    }
    250216
    251     body.latest-mac.window-inactive .toolbar .search-bar > input[type="search"]::-webkit-search-results-button {
     217    body.window-inactive .toolbar .search-bar > input[type="search"]::-webkit-search-results-button {
    252218        /* Setting `color` has no effect on the magnifying glass icon. */
    253219        opacity: 0.5;
    254220    }
    255221
    256     body.latest-mac .toolbar .dashboard-container {
     222    .toolbar .dashboard-container {
    257223        background-image: none;
    258224        background-color: var(--dashboard-background-color);
    … …  
    262228    }
    263229
    264     body.latest-mac .toolbar .item.button:active {
     230    .toolbar .item.button:active {
    265231        background-image: none;
    266232        border-top-color: hsla(0, 100%, 100%, 0.2);
    … …  
    268234    }
    269235
    270     body.latest-mac.window-inactive .toolbar .item.button,
    271     body.latest-mac.window-inactive .toolbar .search-bar > input[type="search"],
    272     body.latest-mac.window-inactive .toolbar .dashboard-container {
     236    body.window-inactive .toolbar .item.button,
     237    body.window-inactive .toolbar .search-bar > input[type="search"],
     238    body.window-inactive .toolbar .dashboard-container {
    273239        opacity: 1;
    274240        color: var(--glyph-color);
Note: See TracChangeset for help on using the changeset viewer.