Title: [183062] trunk/Source/WebInspectorUI
Revision
183062
Author
nvasil...@apple.com
Date
2015-04-21 06:01:18 -0700 (Tue, 21 Apr 2015)

Log Message

Web Inspector: Make formatted nodes more consistent with formatted objects
https://bugs.webkit.org/show_bug.cgi?id=142159

Reviewed by Timothy Hatcher.

* UserInterface/Views/DOMTreeOutline.css:
(.dom-tree-outline ol):
Keep indentation exactly two spaces of Menlo.

(.dom-tree-outline li):
(.dom-tree-outline li.parent):
(.dom-tree-outline li .html-tag.close):
(.dom-tree-outline li.parent::before):
(.dom-tree-outline:focus li.parent.selected::before):
(.dom-tree-outline li.parent.expanded::before):
(.dom-tree-outline:focus li.parent.expanded.selected::before):
* UserInterface/Views/FormattedValue.css:
(.formatted-node > .dom-tree-outline ol):
Keep indentation exactly two spaces of Menlo.

* UserInterface/Views/ObjectTreePropertyTreeElement.css:
(.object-tree-property > .disclosure-button):
Disclosure triangle is 13 by 13 pixels. Having it in the middle of 16 by 16
pixels block makes it look bloory on non-retina screen, because:
(16 - 13) / 2 = 1.5px. Replacing 16 with 15 fixes the problem.

* UserInterface/Views/ObjectTreeView.css:
(.object-tree:not(.lossless-preview) > :matches(.title, .object-preview)):

Modified Paths

Diff

Modified: trunk/Source/WebInspectorUI/ChangeLog (183061 => 183062)


--- trunk/Source/WebInspectorUI/ChangeLog	2015-04-21 10:11:06 UTC (rev 183061)
+++ trunk/Source/WebInspectorUI/ChangeLog	2015-04-21 13:01:18 UTC (rev 183062)
@@ -1,3 +1,34 @@
+2015-04-21  Nikita Vasilyev  <nvasil...@apple.com>
+
+        Web Inspector: Make formatted nodes more consistent with formatted objects
+        https://bugs.webkit.org/show_bug.cgi?id=142159
+
+        Reviewed by Timothy Hatcher.
+
+        * UserInterface/Views/DOMTreeOutline.css:
+        (.dom-tree-outline ol):
+        Keep indentation exactly two spaces of Menlo.
+
+        (.dom-tree-outline li):
+        (.dom-tree-outline li.parent):
+        (.dom-tree-outline li .html-tag.close):
+        (.dom-tree-outline li.parent::before):
+        (.dom-tree-outline:focus li.parent.selected::before):
+        (.dom-tree-outline li.parent.expanded::before):
+        (.dom-tree-outline:focus li.parent.expanded.selected::before):
+        * UserInterface/Views/FormattedValue.css:
+        (.formatted-node > .dom-tree-outline ol):
+        Keep indentation exactly two spaces of Menlo.
+
+        * UserInterface/Views/ObjectTreePropertyTreeElement.css:
+        (.object-tree-property > .disclosure-button):
+        Disclosure triangle is 13 by 13 pixels. Having it in the middle of 16 by 16
+        pixels block makes it look bloory on non-retina screen, because:
+        (16 - 13) / 2 = 1.5px. Replacing 16 with 15 fixes the problem.
+
+        * UserInterface/Views/ObjectTreeView.css:
+        (.object-tree:not(.lossless-preview) > :matches(.title, .object-preview)):
+
 2015-04-20  Joseph Pecoraro  <pecor...@apple.com>
 
         Web Inspector: Unify PrettyPrinting Tool and UserInterface resources

Modified: trunk/Source/WebInspectorUI/UserInterface/Views/DOMTreeOutline.css (183061 => 183062)


--- trunk/Source/WebInspectorUI/UserInterface/Views/DOMTreeOutline.css	2015-04-21 10:11:06 UTC (rev 183061)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/DOMTreeOutline.css	2015-04-21 13:01:18 UTC (rev 183062)
@@ -86,7 +86,7 @@
 
 .dom-tree-outline ol {
     list-style-type: none;
-    padding-left: 14px;
+    padding-left: 1.2em;
     margin: 0;
 }
 
@@ -99,7 +99,7 @@
 }
 
 .dom-tree-outline li {
-    padding: 0 0 0 12px;
+    padding: 0 0 0 17px;
     word-wrap: break-word;
 }
 
@@ -116,11 +116,11 @@
 }
 
 .dom-tree-outline li.parent {
-    margin-left: -10px;
+    margin-left: -15px;
 }
 
 .dom-tree-outline li .html-tag.close {
-    margin-left: -14px;
+    margin-left: -13px;
 }
 
 .dom-tree-outline li.parent::before {
@@ -128,27 +128,27 @@
 
     content: "";
 
-    background-image: -webkit-canvas(disclosure-triangle-tiny-closed-normal);
-    background-size: 8px 8px;
+    background-image: -webkit-canvas(navigation-sidebar-panel-disclosure-triangle-closed-normal);
+    background-size: 13px 13px;
     background-repeat: no-repeat;
 
-    width: 8px;
-    height: 8px;
+    width: 13px;
+    height: 13px;
 
-    margin-top: 2px;
+    margin-left: 0;
     padding-right: 2px;
 }
 
 .dom-tree-outline:focus li.parent.selected::before {
-    background-image: -webkit-canvas(disclosure-triangle-tiny-closed-selected);
+    background-image: -webkit-canvas(navigation-sidebar-panel-disclosure-triangle-closed-selected);
 }
 
 .dom-tree-outline li.parent.expanded::before {
-    background-image: -webkit-canvas(disclosure-triangle-tiny-open-normal);
+    background-image: -webkit-canvas(navigation-sidebar-panel-disclosure-triangle-open-normal);
 }
 
 .dom-tree-outline:focus li.parent.expanded.selected::before {
-    background-image: -webkit-canvas(disclosure-triangle-tiny-open-selected);
+    background-image: -webkit-canvas(navigation-sidebar-panel-disclosure-triangle-open-selected);
 }
 
 .dom-tree-outline .html-text-node.large {

Modified: trunk/Source/WebInspectorUI/UserInterface/Views/FormattedValue.css (183061 => 183062)


--- trunk/Source/WebInspectorUI/UserInterface/Views/FormattedValue.css	2015-04-21 10:11:06 UTC (rev 183061)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/FormattedValue.css	2015-04-21 13:01:18 UTC (rev 183062)
@@ -69,7 +69,7 @@
 }
 
 .formatted-node > .dom-tree-outline ol {
-    -webkit-padding-start: 12px;
+    -webkit-padding-start: 1.2em;
 }
 
 .formatted-node > .dom-tree-outline li {

Modified: trunk/Source/WebInspectorUI/UserInterface/Views/ObjectTreePropertyTreeElement.css (183061 => 183062)


--- trunk/Source/WebInspectorUI/UserInterface/Views/ObjectTreePropertyTreeElement.css	2015-04-21 10:11:06 UTC (rev 183061)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/ObjectTreePropertyTreeElement.css	2015-04-21 13:01:18 UTC (rev 183062)
@@ -43,9 +43,10 @@
     display: inline-block;
     vertical-align: top;
 
-    width: 16px;
+    width: 15px;
     height: 16px;
 
+    margin-left: -1px;
     border: 0;
     background: none;
     -webkit-appearance: none;

Modified: trunk/Source/WebInspectorUI/UserInterface/Views/ObjectTreeView.css (183061 => 183062)


--- trunk/Source/WebInspectorUI/UserInterface/Views/ObjectTreeView.css	2015-04-21 10:11:06 UTC (rev 183061)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/ObjectTreeView.css	2015-04-21 13:01:18 UTC (rev 183062)
@@ -52,7 +52,7 @@
 }
 
 .object-tree:not(.lossless-preview) > :matches(.title, .object-preview) {
-    margin-left: 1px;
+    margin-left: 0;
 }
 
 .object-tree.expanded > :matches(.title, .object-preview)::before {
_______________________________________________
webkit-changes mailing list
webkit-changes@lists.webkit.org
https://lists.webkit.org/mailman/listinfo/webkit-changes

Reply via email to