Title: [248681] trunk/Source/WebInspectorUI
Revision
248681
Author
drou...@apple.com
Date
2019-08-14 11:41:11 -0700 (Wed, 14 Aug 2019)

Log Message

Web Inspector: Elements: Computed: the background of the Properties/Variables sections should match the Box Model section when expanded
https://bugs.webkit.org/show_bug.cgi?id=200724

Reviewed by Joseph Pecoraro.

* UserInterface/Views/ComputedStyleDetailsPanel.css:
(.sidebar > .panel.details.css-style > .content > .computed > .details-section:not(.collapsed) > :matches(.header, .content)): Added.
(.sidebar > .panel.details.css-style > .content > .computed .computed-style-properties): Added.
(.sidebar > .panel.details.css-style > .content > .computed .computed-style-properties .property .go-to-arrow): Added.
(.sidebar > .panel.details.css-style > .content > .computed .computed-style-properties .property:hover .go-to-arrow): Added.
(.sidebar > .panel.details.css-style > .content > .computed .details-section:matches(.computed-style-properties, .computed-style-variables) > .content): Added.
(.details-section:matches(.computed-style-properties, .computed-style-box-model):not(.collapsed) > :matches(.header, .content)): Deleted.
(.computed-style-properties): Deleted.
(.computed-style-properties .property .go-to-arrow): Deleted.
(.computed-style-properties .property:hover .go-to-arrow): Deleted.
(.details-section.computed-style-properties:not(.collapsed) > :matches(.header, .content)): Deleted.
(.details-section.computed-style-properties > .content): Deleted.
(@media (prefers-color-scheme: dark)): Deleted.
Use more specific selectors to match overall Web Inspector style.

* UserInterface/Views/ComputedStyleSection.css:
(.computed-style-section .computed-property-item.expanded):
Darken the background of any expanded computed property in light mode.

Modified Paths

Diff

Modified: trunk/Source/WebInspectorUI/ChangeLog (248680 => 248681)


--- trunk/Source/WebInspectorUI/ChangeLog	2019-08-14 18:20:17 UTC (rev 248680)
+++ trunk/Source/WebInspectorUI/ChangeLog	2019-08-14 18:41:11 UTC (rev 248681)
@@ -1,3 +1,29 @@
+2019-08-14  Devin Rousso  <drou...@apple.com>
+
+        Web Inspector: Elements: Computed: the background of the Properties/Variables sections should match the Box Model section when expanded
+        https://bugs.webkit.org/show_bug.cgi?id=200724
+
+        Reviewed by Joseph Pecoraro.
+
+        * UserInterface/Views/ComputedStyleDetailsPanel.css:
+        (.sidebar > .panel.details.css-style > .content > .computed > .details-section:not(.collapsed) > :matches(.header, .content)): Added.
+        (.sidebar > .panel.details.css-style > .content > .computed .computed-style-properties): Added.
+        (.sidebar > .panel.details.css-style > .content > .computed .computed-style-properties .property .go-to-arrow): Added.
+        (.sidebar > .panel.details.css-style > .content > .computed .computed-style-properties .property:hover .go-to-arrow): Added.
+        (.sidebar > .panel.details.css-style > .content > .computed .details-section:matches(.computed-style-properties, .computed-style-variables) > .content): Added.
+        (.details-section:matches(.computed-style-properties, .computed-style-box-model):not(.collapsed) > :matches(.header, .content)): Deleted.
+        (.computed-style-properties): Deleted.
+        (.computed-style-properties .property .go-to-arrow): Deleted.
+        (.computed-style-properties .property:hover .go-to-arrow): Deleted.
+        (.details-section.computed-style-properties:not(.collapsed) > :matches(.header, .content)): Deleted.
+        (.details-section.computed-style-properties > .content): Deleted.
+        (@media (prefers-color-scheme: dark)): Deleted.
+        Use more specific selectors to match overall Web Inspector style.
+
+        * UserInterface/Views/ComputedStyleSection.css:
+        (.computed-style-section .computed-property-item.expanded):
+        Darken the background of any expanded computed property in light mode.
+
 2019-08-13  Joseph Pecoraro  <pecor...@apple.com>
 
         Uncaught Exception: content.isJSON is not a function selecting image resource

Modified: trunk/Source/WebInspectorUI/UserInterface/Views/ComputedStyleDetailsPanel.css (248680 => 248681)


--- trunk/Source/WebInspectorUI/UserInterface/Views/ComputedStyleDetailsPanel.css	2019-08-14 18:20:17 UTC (rev 248680)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/ComputedStyleDetailsPanel.css	2019-08-14 18:41:11 UTC (rev 248681)
@@ -1,5 +1,6 @@
 /*
  * Copyright (C) 2013 Adobe Systems Inc. All rights reserved.
+ * Copyright (C) 2019 Apple Inc. All rights reserved.
  *
  * Redistribution and use in source and binary forms, with or without
  * modification, are permitted provided that the following conditions
@@ -23,15 +24,15 @@
  * THE POSSIBILITY OF SUCH DAMAGE.
  */
 
-.details-section:matches(.computed-style-properties, .computed-style-box-model):not(.collapsed) > :matches(.header, .content) {
+.sidebar > .panel.details.css-style > .content > .computed > .details-section:not(.collapsed) > :matches(.header, .content) {
     background-color: var(--background-color);
 }
 
-.computed-style-properties {
+.sidebar > .panel.details.css-style > .content > .computed .computed-style-properties {
     --disclosure-button-size: 15px;
 }
 
-.computed-style-properties .property .go-to-arrow {
+.sidebar > .panel.details.css-style > .content > .computed .computed-style-properties .property .go-to-arrow {
     display: none;
     position: absolute;
     width: var(--disclosure-button-size);
@@ -39,20 +40,10 @@
     vertical-align: text-bottom;
 }
 
-.computed-style-properties .property:hover .go-to-arrow {
+.sidebar > .panel.details.css-style > .content > .computed .computed-style-properties .property:hover .go-to-arrow {
     display: initial;
 }
 
-.details-section.computed-style-properties:not(.collapsed) > :matches(.header, .content) {
-    background-color: hsl(0, 0%, 97%);
-}
-
-.details-section.computed-style-properties > .content {
+.sidebar > .panel.details.css-style > .content > .computed .details-section:matches(.computed-style-properties, .computed-style-variables) > .content {
     font: 12px -webkit-system-font, sans-serif;
 }
-
-@media (prefers-color-scheme: dark) {
-    .details-section.computed-style-properties:not(.collapsed) > :matches(.header, .content) {
-        background-color: var(--background-color);
-    }
-}

Modified: trunk/Source/WebInspectorUI/UserInterface/Views/ComputedStyleSection.css (248680 => 248681)


--- trunk/Source/WebInspectorUI/UserInterface/Views/ComputedStyleSection.css	2019-08-14 18:20:17 UTC (rev 248680)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/ComputedStyleSection.css	2019-08-14 18:41:11 UTC (rev 248681)
@@ -42,7 +42,7 @@
 
 .computed-style-section .computed-property-item.expanded {
     padding-bottom: 2px;
-    background-color: var(--background-color-code);
+    background-color: hsl(0, 0%, 97%);
     border-top-color: var(--text-color-quaternary);
 }
 
_______________________________________________
webkit-changes mailing list
webkit-changes@lists.webkit.org
https://lists.webkit.org/mailman/listinfo/webkit-changes

Reply via email to