Title: [215192] trunk/Source/WebInspectorUI
Revision
215192
Author
nvasil...@apple.com
Date
2017-04-10 11:11:59 -0700 (Mon, 10 Apr 2017)

Log Message

Web Inspector: Placeholder text is clipped in the 'Enter Class Name' field at the bottom of Rules style sidebar in some localizations
https://bugs.webkit.org/show_bug.cgi?id=167641
<rdar://problem/26541953>

Reviewed by Joseph Pecoraro.

Make the "Enter Class Name" text field span the entire width of the Styles sidebar.

* UserInterface/Views/CSSStyleDetailsSidebarPanel.css:
(.sidebar > .panel.details.css-style > .content ~ .class-list-container > .new-class):
(.sidebar > .panel.details.css-style > .content ~ .class-list-container > .new-class > .class-name-input):
(.sidebar > .panel.details.css-style > .content ~ .class-list-container > .new-class > input[type="checkbox"]): Deleted.
(.sidebar > .panel.details.css-style > .content ~ .class-list-container > .new-class > .add-class-icon): Deleted.
(.sidebar > .panel.details.css-style > .content ~ .class-list-container > .new-class.active > .add-class-icon,): Deleted.
* UserInterface/Views/CSSStyleDetailsSidebarPanel.js:
(WebInspector.CSSStyleDetailsSidebarPanel.prototype.initialLayout):
Remove the checkbox, which didn't do anything, and the plus icon. Make the "Enter Class Name" text field visible by default.

Modified Paths

Diff

Modified: trunk/Source/WebInspectorUI/ChangeLog (215191 => 215192)


--- trunk/Source/WebInspectorUI/ChangeLog	2017-04-10 18:11:55 UTC (rev 215191)
+++ trunk/Source/WebInspectorUI/ChangeLog	2017-04-10 18:11:59 UTC (rev 215192)
@@ -1,3 +1,23 @@
+2017-04-10  Nikita Vasilyev  <nvasil...@apple.com>
+
+        Web Inspector: Placeholder text is clipped in the 'Enter Class Name' field at the bottom of Rules style sidebar in some localizations
+        https://bugs.webkit.org/show_bug.cgi?id=167641
+        <rdar://problem/26541953>
+
+        Reviewed by Joseph Pecoraro.
+
+        Make the "Enter Class Name" text field span the entire width of the Styles sidebar.
+
+        * UserInterface/Views/CSSStyleDetailsSidebarPanel.css:
+        (.sidebar > .panel.details.css-style > .content ~ .class-list-container > .new-class):
+        (.sidebar > .panel.details.css-style > .content ~ .class-list-container > .new-class > .class-name-input):
+        (.sidebar > .panel.details.css-style > .content ~ .class-list-container > .new-class > input[type="checkbox"]): Deleted.
+        (.sidebar > .panel.details.css-style > .content ~ .class-list-container > .new-class > .add-class-icon): Deleted.
+        (.sidebar > .panel.details.css-style > .content ~ .class-list-container > .new-class.active > .add-class-icon,): Deleted.
+        * UserInterface/Views/CSSStyleDetailsSidebarPanel.js:
+        (WebInspector.CSSStyleDetailsSidebarPanel.prototype.initialLayout):
+        Remove the checkbox, which didn't do anything, and the plus icon. Make the "Enter Class Name" text field visible by default.
+
 2017-04-10  Jon Lee  <jon...@apple.com>
 
         Update localizable strings to "full screen" from "fullscreen"

Modified: trunk/Source/WebInspectorUI/UserInterface/Views/CSSStyleDetailsSidebarPanel.css (215191 => 215192)


--- trunk/Source/WebInspectorUI/UserInterface/Views/CSSStyleDetailsSidebarPanel.css	2017-04-10 18:11:55 UTC (rev 215191)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/CSSStyleDetailsSidebarPanel.css	2017-04-10 18:11:59 UTC (rev 215192)
@@ -156,20 +156,11 @@
 
 .sidebar > .panel.details.css-style > .content ~ .class-list-container > .new-class {
     display: flex;
-    align-items: center;
+    width: 100%;
 }
 
-.sidebar > .panel.details.css-style > .content ~ .class-list-container > .new-class > input[type="checkbox"] {
-    pointer-events: none;
-}
-
-.sidebar > .panel.details.css-style > .content ~ .class-list-container > .new-class > .add-class-icon {
-    width: 12px;
-    height: 12px;
-}
-
 .sidebar > .panel.details.css-style > .content ~ .class-list-container > .new-class > .class-name-input {
-    width: 100px;
+    flex-grow: 1;
     height: 18px;
     margin: 0;
 
@@ -184,11 +175,6 @@
     margin-right: var(--panel-details-css-style-content-class-list-container-new-class-class-name-input-margin-start);
 }
 
-.sidebar > .panel.details.css-style > .content ~ .class-list-container > .new-class.active > .add-class-icon,
-.sidebar > .panel.details.css-style > .content ~ .class-list-container > .new-class:not(.active) > .class-name-input {
-    display: none;
-}
-
 .sidebar > .panel.details.css-style > .content ~ .class-list-container > *:matches(.new-class, .class-toggle) {
     margin: 1px 3px;
 }

Modified: trunk/Source/WebInspectorUI/UserInterface/Views/CSSStyleDetailsSidebarPanel.js (215191 => 215192)


--- trunk/Source/WebInspectorUI/UserInterface/Views/CSSStyleDetailsSidebarPanel.js	2017-04-10 18:11:55 UTC (rev 215191)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/CSSStyleDetailsSidebarPanel.js	2017-04-10 18:11:59 UTC (rev 215192)
@@ -188,13 +188,6 @@
         this._addClassContainer.title = WebInspector.UIString("Add a Class");
         this._addClassContainer.addEventListener("click", this._addClassContainerClicked.bind(this));
 
-        let addClassCheckbox = this._addClassContainer.createChild("input");
-        addClassCheckbox.type = "checkbox";
-        addClassCheckbox.checked = true;
-
-        let addClassIcon = useSVGSymbol("Images/Plus13.svg", "add-class-icon");
-        this._addClassContainer.appendChild(addClassIcon);
-
         this._addClassInput = this._addClassContainer.createChild("input", "class-name-input");
         this._addClassInput.setAttribute("placeholder", WebInspector.UIString("Enter Class Name"));
         this._addClassInput.addEventListener("keypress", this._addClassInputKeyPressed.bind(this));
_______________________________________________
webkit-changes mailing list
webkit-changes@lists.webkit.org
https://lists.webkit.org/mailman/listinfo/webkit-changes

Reply via email to