Changeset 239404 in webkit

Timestamp:

Dec 19, 2018, 4:31:27 PM (8 years ago)

Author:

Devin Rousso

Message:

Web Inspector: Audit: provide localization support for % pass display
​https://bugs.webkit.org/show_bug.cgi?id=192870
<rdar://problem/46779245>

Reviewed by Brian Burg.

• UserInterface/Views/AuditTestGroupContentView.js:

(WI.AuditTestGroupContentView.prototype.initialLayout):
(WI.AuditTestGroupContentView.prototype.layout):

• UserInterface/Views/AuditTestGroupContentView.css:

(.content-view.audit-test-group > header > .percentage-pass):
(.content-view.audit-test-group > header > .percentage-pass > span): Added.
(@media (prefers-dark-interface) .content-view.audit-test-group > header > .percentage-pass): Added.
(@media (prefers-dark-interface) .content-view.audit-test-group > header > .percentage-pass > span): Added.
(.content-view.audit-test-group > header > .percentage-pass:not(:empty)::after): Deleted.

• Localizations/en.lproj/localizedStrings.js:

Location:

trunk/Source/WebInspectorUI

Files:

• ChangeLog (modified) (1 diff)
• Localizations/en.lproj/localizedStrings.js (modified) (1 diff)
• UserInterface/Views/AuditTestGroupContentView.css (modified) (2 diffs)
• UserInterface/Views/AuditTestGroupContentView.js (modified) (3 diffs)

trunk/Source/WebInspectorUI/ChangeLog

@@ +1 @@
+2018-12-19  Devin Rousso  <drousso@apple.com>
+
+        Web Inspector: Audit: provide localization support for % pass display
+        https://bugs.webkit.org/show_bug.cgi?id=192870
+        <rdar://problem/46779245>
+
+        Reviewed by Brian Burg.
+
+        * UserInterface/Views/AuditTestGroupContentView.js:
+        (WI.AuditTestGroupContentView.prototype.initialLayout):
+        (WI.AuditTestGroupContentView.prototype.layout):
+        * UserInterface/Views/AuditTestGroupContentView.css:
+        (.content-view.audit-test-group > header > .percentage-pass):
+        (.content-view.audit-test-group > header > .percentage-pass > span): Added.
+        (@media (prefers-dark-interface) .content-view.audit-test-group > header > .percentage-pass): Added.
+        (@media (prefers-dark-interface) .content-view.audit-test-group > header > .percentage-pass > span): Added.
+        (.content-view.audit-test-group > header > .percentage-pass:not(:empty)::after): Deleted.
+
+        * Localizations/en.lproj/localizedStrings.js:
+
 2018-12-19  Nikita Vasilyev  <nvasilyev@apple.com>
 

trunk/Source/WebInspectorUI/Localizations/en.lproj/localizedStrings.js

@@ -57 +57 @@
 localizedStrings["%s eval\n%s async"] = "%s eval\n%s async";
 localizedStrings["%s interval"] = "%s interval";
+localizedStrings["%s%%"] = "%s%%";
 localizedStrings["(Action %s)"] = "(Action %s)";
 localizedStrings["(Disk)"] = "(Disk)";

trunk/Source/WebInspectorUI/UserInterface/Views/AuditTestGroupContentView.css

@@ -123 +123 @@
     width: var(--metadata-width);
     -webkit-margin-start: var(--audit-test-horizontal-space);
-    font-size: 24px;
+    font-size: 16px;
     text-align: center;
     font-weight: bold;
-    opacity: 0.65;
+    /* FIXME: Use CSS4 color blend functions once they're available. */
+    color: hsla(0, 0%, 0%, 0.5);
 }
 
-.content-view.audit-test-group > header > .percentage-pass:not(:empty)::after {
-    content: "%";
-    font-size: 16px;
-    opacity: 0.75;
+.content-view.audit-test-group > header > .percentage-pass > span {
+    font-size: 24px;
+    /* FIXME: Use CSS4 color blend functions once they're available. */
+    color: hsla(0, 0%, 0%, 0.65);
 }
 
@@ -144 +145 @@
     margin-bottom: var(--audit-test-vertical-space);
 }
+
+@media (prefers-dark-interface) {
+    .content-view.audit-test-group > header > .percentage-pass {
+        /* FIXME: Use CSS4 color blend functions once they're available. */
+        color: hsla(0, 0%, 88%, 0.5);
+    }
+
+    .content-view.audit-test-group > header > .percentage-pass > span {
+        /* FIXME: Use CSS4 color blend functions once they're available. */
+        color: hsla(0, 0%, 88%, 0.65);
+    }
+}

trunk/Source/WebInspectorUI/UserInterface/Views/AuditTestGroupContentView.js

@@ -60 +60 @@
         this.headerView.addSubview(this._levelNavigationBar);
 
-        this._percentageTextElement = this.headerView.element.appendChild(document.createElement("div"));
-        this._percentageTextElement.classList.add("percentage-pass");
-        this.headerView.element.appendChild(this._percentageTextElement);
+        this._percentageContainer = this.headerView.element.appendChild(document.createElement("div"));
+        this._percentageContainer.classList.add("percentage-pass");
+        this._percentageContainer.hidden = true;
+
+        this._percentageTextElement = document.createElement("span");
+
+        String.format(WI.UIString("%s%%"), [this._percentageTextElement], String.standardFormatters, this._percentageContainer, (a, b) => {
+            a.append(b);
+            return a;
+        });
     }
 
@@ -79 +86 @@
             }
 
+            this._percentageContainer.hidden = true;
             this._percentageTextElement.textContent = "";
 
@@ -94 +102 @@
         let totalCount = Object.values(levelCounts).reduce((accumulator, current) => accumulator + current);
         this._percentageTextElement.textContent = Math.floor(100 * levelCounts[WI.AuditTestCaseResult.Level.Pass] / totalCount);
+        this._percentageContainer.hidden = false;
 
         if (!this._levelScopeBar) {