Title: [117273] trunk/Source/WebCore
- Revision
- 117273
- Author
- [email protected]
- Date
- 2012-05-16 06:25:53 -0700 (Wed, 16 May 2012)
Log Message
Web Inspector: gradient properties are painful to inspect / author.
https://bugs.webkit.org/show_bug.cgi?id=86379
Reviewed by Pavel Feldman.
The CSS styles layout has been changed to allow property values to wrap onto subsequent lines
to let the users see the entire value text.
* inspector/front-end/StylesSidebarPane.js:
(WebInspector.StylePropertyTreeElement.prototype.updateTitle.): Avoid line breaks between the color swatch and value.
* inspector/front-end/elementsPanel.css:
(.styles-section .properties li.not-parsed-ok img.exclamation-mark):
(.styles-section .properties li):
(.styles-section .properties li .webkit-css-property):
(.styles-section.expanded .properties > li):
(.styles-section .properties > li .webkit-css-property):
(.styles-section .properties > li.child-editing):
(.styles-section .properties > li.child-editing .webkit-css-property):
(.styles-section .properties .enabled-button):
Modified Paths
Diff
Modified: trunk/Source/WebCore/ChangeLog (117272 => 117273)
--- trunk/Source/WebCore/ChangeLog 2012-05-16 13:16:57 UTC (rev 117272)
+++ trunk/Source/WebCore/ChangeLog 2012-05-16 13:25:53 UTC (rev 117273)
@@ -1,3 +1,25 @@
+2012-05-16 Alexander Pavlov <[email protected]>
+
+ Web Inspector: gradient properties are painful to inspect / author.
+ https://bugs.webkit.org/show_bug.cgi?id=86379
+
+ Reviewed by Pavel Feldman.
+
+ The CSS styles layout has been changed to allow property values to wrap onto subsequent lines
+ to let the users see the entire value text.
+
+ * inspector/front-end/StylesSidebarPane.js:
+ (WebInspector.StylePropertyTreeElement.prototype.updateTitle.): Avoid line breaks between the color swatch and value.
+ * inspector/front-end/elementsPanel.css:
+ (.styles-section .properties li.not-parsed-ok img.exclamation-mark):
+ (.styles-section .properties li):
+ (.styles-section .properties li .webkit-css-property):
+ (.styles-section.expanded .properties > li):
+ (.styles-section .properties > li .webkit-css-property):
+ (.styles-section .properties > li.child-editing):
+ (.styles-section .properties > li.child-editing .webkit-css-property):
+ (.styles-section .properties .enabled-button):
+
2012-05-16 Yury Semikhatsky <[email protected]>
Web Inspector: rename ProfileView.js to CPUProfileView.js
Modified: trunk/Source/WebCore/inspector/front-end/StylesSidebarPane.js (117272 => 117273)
--- trunk/Source/WebCore/inspector/front-end/StylesSidebarPane.js 2012-05-16 13:16:57 UTC (rev 117272)
+++ trunk/Source/WebCore/inspector/front-end/StylesSidebarPane.js 2012-05-16 13:25:53 UTC (rev 117273)
@@ -1892,7 +1892,7 @@
colorValueElement.textContent = currentValue;
}
- var container = document.createDocumentFragment();
+ var container = document.createElement("nobr");
container.appendChild(swatchElement);
container.appendChild(colorValueElement);
return container;
Modified: trunk/Source/WebCore/inspector/front-end/elementsPanel.css (117272 => 117273)
--- trunk/Source/WebCore/inspector/front-end/elementsPanel.css 2012-05-16 13:16:57 UTC (rev 117272)
+++ trunk/Source/WebCore/inspector/front-end/elementsPanel.css 2012-05-16 13:25:53 UTC (rev 117273)
@@ -246,13 +246,17 @@
.styles-section .properties li.not-parsed-ok img.exclamation-mark {
content: url(Images/warningIcon.png);
opacity: 0.75;
+ position: relative;
+ float: left;
width: 12px;
height: 10px;
margin: 0 6px 0 0;
- padding: 0 1px;
+ left: -38px; /* outdent to compensate for the top-level property indent */
+ padding-left: 2px;
vertical-align: baseline;
-webkit-user-select: none;
cursor: default;
+ z-index: 1;
}
.styles-section .header {
@@ -320,11 +324,33 @@
.styles-section .properties li {
margin-left: 12px;
- white-space: nowrap;
+ padding-left: 22px;
+ white-space: normal;
text-overflow: ellipsis;
overflow: hidden;
cursor: auto;
}
+
+.styles-section .properties li .webkit-css-property {
+ margin-left: -22px; /* outdent the first line of longhand properties (in an expanded shorthand) to compensate for the "padding-left" shift in .styles-section .properties li */
+}
+
+.styles-section.expanded .properties > li {
+ padding-left: 38px;
+}
+
+.styles-section .properties > li .webkit-css-property {
+ margin-left: -38px; /* outdent the first line of the top-level properties to compensate for the "padding-left" shift in .styles-section .properties > li */
+}
+
+.styles-section .properties > li.child-editing {
+ padding-left: 8px;
+}
+
+.styles-section .properties > li.child-editing .webkit-css-property {
+ margin-left: -8px;
+}
+
.styles-section.matched-styles .properties li {
margin-left: 0 !important;
}
@@ -403,7 +429,7 @@
position: relative;
z-index: 1;
width: 18px;
- left: -2px;
+ left: -40px; /* original -2px + (-38px) to compensate for the first line outdent */
}
.styles-section.matched-styles .properties ol.expanded {
_______________________________________________
webkit-changes mailing list
[email protected]
http://lists.webkit.org/mailman/listinfo.cgi/webkit-changes
