Web Inspector: remove .legacy-mac/.latest-mac CSS classes, standardize on .latest...
authormattbaker@apple.com <mattbaker@apple.com@268f45cc-cd09-0410-ab3c-d52691b4dbfc>
Fri, 21 Jun 2019 17:53:33 +0000 (17:53 +0000)
committermattbaker@apple.com <mattbaker@apple.com@268f45cc-cd09-0410-ab3c-d52691b4dbfc>
Fri, 21 Jun 2019 17:53:33 +0000 (17:53 +0000)
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.

git-svn-id: https://svn.webkit.org/repository/webkit/trunk@246684 268f45cc-cd09-0410-ab3c-d52691b4dbfc

Source/WebInspectorUI/ChangeLog
Source/WebInspectorUI/UserInterface/Base/Main.js
Source/WebInspectorUI/UserInterface/Views/DefaultDashboardView.css
Source/WebInspectorUI/UserInterface/Views/Toolbar.css

index 5a960b9..1a56286 100644 (file)
@@ -1,3 +1,48 @@
+2019-06-21  Matt Baker  <mattbaker@apple.com>
+
+        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.
+
 2019-06-20  Matt Baker  <mattbaker@apple.com>
 
         Web Inspector: rename shadowRootPushed parameter to match protocol
index 5fd8112..5bfde51 100644 (file)
@@ -290,15 +290,9 @@ WI.contentLoaded = function()
     if (WI.Platform.isNightlyBuild)
         document.body.classList.add("nightly-build");
 
-    if (WI.Platform.name === "mac") {
+    if (WI.Platform.name === "mac")
         document.body.classList.add(WI.Platform.version.name);
 
-        if (WI.Platform.version.release >= 11)
-            document.body.classList.add("latest-mac");
-        else
-            document.body.classList.add("legacy-mac");
-    }
-
     document.body.classList.add(WI.sharedApp.debuggableType);
     document.body.setAttribute("dir", WI.resolvedLayoutDirection());
 
index b9e517f..e705867 100644 (file)
@@ -200,10 +200,6 @@ body:not(.web) .toolbar .dashboard.default > :matches(.resourcesCount, .resource
         filter: var(--filter-invert);
     }
 
-    body.latest-mac .toolbar .dashboard .item.button {
-        background: unset;
-    }
-
     .dashboard-container .advance-arrow {
         filter: var(--filter-invert);
     }
index 3297f8a..4aa1925 100644 (file)
@@ -38,9 +38,7 @@
     overflow: hidden;
 
     outline: none;
-}
 
-body .toolbar {
     background-image: linear-gradient(to bottom, hsl(0, 0%, 92%), hsl(0, 0%, 87%));
     box-shadow: inset hsla(0, 0%, 100%, 0.5) 0 1px 1px;
 }
@@ -116,41 +114,9 @@ body.mac-platform:not(.docked) {
     margin-left: 4px;
 }
 
-body.legacy-mac .toolbar .item.button,
-body.legacy-mac .toolbar .search-bar > input[type="search"],
-body.legacy-mac .toolbar .dashboard-container {
-    background-color: hsl(0, 0%, 99%);
-    border: 1px solid transparent;
-    border-top-color: hsl(0, 0%, 100%);
-    box-shadow: hsla(0, 0%, 0%, 0.15) 0 1px 0;
-    border-radius: 4px;
-}
-
-body.legacy-mac .toolbar .search-bar > input[type="search"] {
-    box-shadow: 0 0 0 7px hsla(211, 96%, 48%, 0);
-    transition: box-shadow .25s cubic-bezier(0.165, 0.840, 0.440, 1) /* easeOutQuart */;
-}
-
-body.legacy-mac .toolbar .search-bar > input[type="search"]:focus {
-    box-shadow: hsla(0, 0%, 0%, 0.15) 0 1px 0, 0 0 0 3px hsla(211, 96%, 48%, 0.4);
-}
-
-body.legacy-mac .toolbar .item.button:active {
-    border-top-color: hsl(0, 0%, 94%);
-    background-color: hsl(0, 0%, 89%);
-}
-
-body.window-inactive.legacy-mac .toolbar .item.button,
-body.window-inactive.legacy-mac .toolbar .search-bar > input[type="search"],
-body.window-inactive.legacy-mac .toolbar .dashboard-container {
-    border: 1px solid hsl(0, 0%, 86%);
-    background-color: hsl(0, 0%, 96%);
-    box-shadow: none;
-}
-
-body.latest-mac .toolbar .item.button,
-body.latest-mac .toolbar .search-bar > input[type="search"],
-body.latest-mac .toolbar .dashboard-container {
+.toolbar .item.button,
+.toolbar .search-bar > input[type="search"],
+.toolbar .dashboard-container {
     background-image: linear-gradient(hsl(0, 0%, 99%), var(--panel-background-color));
     box-shadow: hsla(0, 0%, 0%, 0.3) 0 1px 1px -1px;
 
@@ -160,33 +126,33 @@ body.latest-mac .toolbar .dashboard-container {
     border-bottom-color: hsl(0, 0%, 76%);
 }
 
-body.latest-mac .toolbar .search-bar > input[type="search"] {
+.toolbar .search-bar > input[type="search"] {
     box-shadow: hsla(0, 0%, 0%, 0.3) 0 1px 1px -1px, 0 0 0 7px hsla(211, 96%, 48%, 0);
     transition: box-shadow .25s cubic-bezier(0.165, 0.840, 0.440, 1) /* easeOutQuart */;
 }
 
-body.latest-mac .toolbar .search-bar > input[type="search"]:focus {
+.toolbar .search-bar > input[type="search"]:focus {
     box-shadow: hsla(0, 0%, 0%, 0.15) 0 1px 0, 0 0 0 3px hsla(211, 96%, 48%, 0.4);
 }
 
 @media (-webkit-min-device-pixel-ratio: 2) {
-    body.latest-mac .toolbar .item.button,
-    body.latest-mac .toolbar .search-bar > input[type="search"],
-    body.latest-mac .toolbar .dashboard-container {
+    .toolbar .item.button,
+    .toolbar .search-bar > input[type="search"],
+    .toolbar .dashboard-container {
         border: 0.5px solid hsl(0, 0%, 78%);
         border-top-color: hsl(0, 0%, 80%);
         border-bottom-color: hsl(0, 0%, 65%);
     }
 }
 
-body.latest-mac .toolbar .item.button:active {
+.toolbar .item.button:active {
     background-image: linear-gradient(hsl(0, 0%, 89%), hsl(0, 0%, 86%));
     box-shadow: hsla(0, 0%, 0%, 0.3) 0 1px 1px -1px, inset 0 1px 1px -1px white;
 }
 
-body.latest-mac.window-inactive .toolbar .item.button,
-body.latest-mac.window-inactive .toolbar .search-bar > input[type="search"],
-body.latest-mac.window-inactive .toolbar .dashboard-container {
+body.window-inactive .toolbar .item.button,
+body.window-inactive .toolbar .search-bar > input[type="search"],
+body.window-inactive .toolbar .dashboard-container {
     opacity: 0.65;
     border-color: hsla(0, 0%, 0%, 0.15);
     background-color: transparent;
@@ -194,9 +160,9 @@ body.latest-mac.window-inactive .toolbar .dashboard-container {
 }
 
 @media (-webkit-min-device-pixel-ratio: 2) {
-    body.latest-mac.window-inactive .toolbar .item.button,
-    body.latest-mac.window-inactive .toolbar .search-bar > input[type="search"],
-    body.latest-mac.window-inactive .toolbar .dashboard-container {
+    body.window-inactive .toolbar .item.button,
+    body.window-inactive .toolbar .search-bar > input[type="search"],
+    body.window-inactive .toolbar .dashboard-container {
         box-shadow: inset 0 0 1px 0 hsla(0, 0%, 0%, 0.1);
     }
 }
@@ -208,7 +174,7 @@ body.latest-mac.window-inactive .toolbar .dashboard-container {
 }
 
 @media (prefers-color-scheme: dark) {
-    body .toolbar {
+    .toolbar {
         background-image: linear-gradient(to bottom, hsl(0, 0%, 26%), hsl(0, 0%, 23%));
         box-shadow: none;
     }
@@ -217,8 +183,8 @@ body.latest-mac.window-inactive .toolbar .dashboard-container {
         background-color: var(--background-color);
     }
 
-    body.latest-mac .toolbar .item.button,
-    body.latest-mac .toolbar .search-bar > input[type="search"] {
+    .toolbar .item.button,
+    .toolbar .search-bar > input[type="search"] {
         background-image: none;
         background-color: var(--button-background-color);
         border-color: var(--button-background-color);
@@ -226,11 +192,11 @@ body.latest-mac.window-inactive .toolbar .dashboard-container {
         box-shadow: none;
     }
 
-    body.latest-mac .toolbar .search-bar > input[type="search"] {
+    .toolbar .search-bar > input[type="search"] {
         color: var(--text-color);
     }
 
-    body.latest-mac .toolbar .search-bar > input[type="search"]:focus {
+    .toolbar .search-bar > input[type="search"]:focus {
         color: var(--text-color-active);
 
         /* FIXME: Use native outline for the default theme as well. */
@@ -240,20 +206,20 @@ body.latest-mac.window-inactive .toolbar .dashboard-container {
         outline-offset: -3px;
     }
 
-    body.latest-mac .toolbar .search-bar > input[type="search"]::placeholder {
+    .toolbar .search-bar > input[type="search"]::placeholder {
         color: var(--text-color-secondary);
     }
 
-    body.latest-mac.window-inactive .toolbar .search-bar > input[type="search"]::placeholder {
+    body.window-inactive .toolbar .search-bar > input[type="search"]::placeholder {
         color: var(--text-color-tertiary);
     }
 
-    body.latest-mac.window-inactive .toolbar .search-bar > input[type="search"]::-webkit-search-results-button {
+    body.window-inactive .toolbar .search-bar > input[type="search"]::-webkit-search-results-button {
         /* Setting `color` has no effect on the magnifying glass icon. */
         opacity: 0.5;
     }
 
-    body.latest-mac .toolbar .dashboard-container {
+    .toolbar .dashboard-container {
         background-image: none;
         background-color: var(--dashboard-background-color);
         border-color: var(--dashboard-background-color);
@@ -261,15 +227,15 @@ body.latest-mac.window-inactive .toolbar .dashboard-container {
         box-shadow: none;
     }
 
-    body.latest-mac .toolbar .item.button:active {
+    .toolbar .item.button:active {
         background-image: none;
         border-top-color: hsla(0, 100%, 100%, 0.2);
         box-shadow: none;
     }
 
-    body.latest-mac.window-inactive .toolbar .item.button,
-    body.latest-mac.window-inactive .toolbar .search-bar > input[type="search"],
-    body.latest-mac.window-inactive .toolbar .dashboard-container {
+    body.window-inactive .toolbar .item.button,
+    body.window-inactive .toolbar .search-bar > input[type="search"],
+    body.window-inactive .toolbar .dashboard-container {
         opacity: 1;
         color: var(--glyph-color);
         border-color: transparent;