Title: [221998] trunk/Source/WebInspectorUI
- Revision
- 221998
- Author
- [email protected]
- Date
- 2017-09-13 16:20:30 -0700 (Wed, 13 Sep 2017)
Log Message
Web Inspector: Styles Redesign: display @media section headers
https://bugs.webkit.org/show_bug.cgi?id=176289
<rdar://problem/34228389>
Reviewed by Devin Rousso.
Prepend CSS media query selectors to every matching rule.
* UserInterface/Views/SpreadsheetCSSStyleDeclarationSection.css:
(.spreadsheet-css-declaration .media-label):
* UserInterface/Views/SpreadsheetCSSStyleDeclarationSection.js:
(WI.SpreadsheetCSSStyleDeclarationSection.prototype.initialLayout):
(WI.SpreadsheetCSSStyleDeclarationSection.prototype._createMediaHeader):
Don't localize "@media" since it's CSS code.
Don't display "all" or "screen" media query selectors. One of the goals of the
Styles sidebar redesign is to fit more data.
Modified Paths
Diff
Modified: trunk/Source/WebInspectorUI/ChangeLog (221997 => 221998)
--- trunk/Source/WebInspectorUI/ChangeLog 2017-09-13 22:47:18 UTC (rev 221997)
+++ trunk/Source/WebInspectorUI/ChangeLog 2017-09-13 23:20:30 UTC (rev 221998)
@@ -1,5 +1,24 @@
2017-09-13 Nikita Vasilyev <[email protected]>
+ Web Inspector: Styles Redesign: display @media section headers
+ https://bugs.webkit.org/show_bug.cgi?id=176289
+ <rdar://problem/34228389>
+
+ Reviewed by Devin Rousso.
+
+ Prepend CSS media query selectors to every matching rule.
+
+ * UserInterface/Views/SpreadsheetCSSStyleDeclarationSection.css:
+ (.spreadsheet-css-declaration .media-label):
+ * UserInterface/Views/SpreadsheetCSSStyleDeclarationSection.js:
+ (WI.SpreadsheetCSSStyleDeclarationSection.prototype.initialLayout):
+ (WI.SpreadsheetCSSStyleDeclarationSection.prototype._createMediaHeader):
+ Don't localize "@media" since it's CSS code.
+ Don't display "all" or "screen" media query selectors. One of the goals of the
+ Styles sidebar redesign is to fit more data.
+
+2017-09-13 Nikita Vasilyev <[email protected]>
+
Web Inspector: Frontend should be made to expect and handle disabled properties
https://bugs.webkit.org/show_bug.cgi?id=166787
<rdar://problem/34379593>
Modified: trunk/Source/WebInspectorUI/UserInterface/Views/SpreadsheetCSSStyleDeclarationSection.css (221997 => 221998)
--- trunk/Source/WebInspectorUI/UserInterface/Views/SpreadsheetCSSStyleDeclarationSection.css 2017-09-13 22:47:18 UTC (rev 221997)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/SpreadsheetCSSStyleDeclarationSection.css 2017-09-13 23:20:30 UTC (rev 221998)
@@ -33,6 +33,10 @@
-webkit-user-select: text;
}
+.spreadsheet-css-declaration .media-label {
+ color: black;
+}
+
.spreadsheet-css-declaration .origin {
float: right;
max-width: 100%;
Modified: trunk/Source/WebInspectorUI/UserInterface/Views/SpreadsheetCSSStyleDeclarationSection.js (221997 => 221998)
--- trunk/Source/WebInspectorUI/UserInterface/Views/SpreadsheetCSSStyleDeclarationSection.js 2017-09-13 22:47:18 UTC (rev 221997)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/SpreadsheetCSSStyleDeclarationSection.js 2017-09-13 23:20:30 UTC (rev 221998)
@@ -68,7 +68,7 @@
closeBrace.classList.add("close-brace");
closeBrace.textContent = "}";
- this._element.append(this._headerElement, openBrace);
+ this._element.append(this._createMediaHeader(), this._headerElement, openBrace);
this.addSubview(this._propertiesEditor);
this._propertiesEditor.needsLayout(WI.View.LayoutReason.Dirty);
this._element.append(closeBrace);
@@ -224,6 +224,31 @@
{
return this._style.editable && this._style.ownerRule;
}
+
+ // Private
+
+ _createMediaHeader()
+ {
+ if (!this._style.ownerRule)
+ return "";
+
+ console.assert(Array.isArray(this._style.ownerRule.mediaList));
+
+ let mediaList = this._style.ownerRule.mediaList;
+ let mediaText = mediaList.map((media) => media.text).join(", ");
+ if (!mediaText || mediaText === "all" || mediaText === "screen")
+ return "";
+
+ let mediaElement = document.createElement("div");
+ mediaElement.classList.add("header-media");
+
+ let mediaLabel = mediaElement.appendChild(document.createElement("div"));
+ mediaLabel.className = "media-label";
+ mediaLabel.append("@media ", mediaText);
+ mediaElement.append(mediaLabel);
+
+ return mediaElement;
+ }
};
WI.SpreadsheetCSSStyleDeclarationSection.MatchedSelectorElementStyleClassName = "matched";
_______________________________________________
webkit-changes mailing list
[email protected]
https://lists.webkit.org/mailman/listinfo/webkit-changes
