Title: [250587] trunk/Tools
Revision
250587
Author
jbed...@apple.com
Date
2019-10-01 16:46:02 -0700 (Tue, 01 Oct 2019)

Log Message

results.webkit.org: Standardize styles in the drawer
https://bugs.webkit.org/show_bug.cgi?id=202428

Rubber-stamped by Aakash Jain.

* resultsdbpy/resultsdbpy/view/static/css/search.css: Rename boldInverseColor.
* resultsdbpy/resultsdbpy/view/static/css/tooltip.css: Ditto.
* resultsdbpy/resultsdbpy/view/static/js/drawer.js: Move style specifications into webkit.css.
* resultsdbpy/resultsdbpy/view/static/js/timeline.js: Ditto.
* resultsdbpy/resultsdbpy/view/static/library/css/webkit.css:
(.input>label): Use the boldInverseColor instead of grey.
(.input>input[type="text"][required], .input>input[type="number"][required],): Darken the border,
decrease the font weight.
(.input>input[type="text"][required]~label, .input>input[type="number"][required]~label,): Use the inverseColor instead of grey.

Modified Paths

Diff

Modified: trunk/Tools/ChangeLog (250586 => 250587)


--- trunk/Tools/ChangeLog	2019-10-01 22:55:57 UTC (rev 250586)
+++ trunk/Tools/ChangeLog	2019-10-01 23:46:02 UTC (rev 250587)
@@ -1,3 +1,20 @@
+2019-10-01  Jonathan Bedard  <jbed...@apple.com>
+
+        results.webkit.org: Standardize styles in the drawer
+        https://bugs.webkit.org/show_bug.cgi?id=202428
+
+        Rubber-stamped by Aakash Jain.
+
+        * resultsdbpy/resultsdbpy/view/static/css/search.css: Rename boldInverseColor.
+        * resultsdbpy/resultsdbpy/view/static/css/tooltip.css: Ditto.
+        * resultsdbpy/resultsdbpy/view/static/js/drawer.js: Move style specifications into webkit.css.
+        * resultsdbpy/resultsdbpy/view/static/js/timeline.js: Ditto.
+        * resultsdbpy/resultsdbpy/view/static/library/css/webkit.css:
+        (.input>label): Use the boldInverseColor instead of grey.
+        (.input>input[type="text"][required], .input>input[type="number"][required],): Darken the border,
+        decrease the font weight.
+        (.input>input[type="text"][required]~label, .input>input[type="number"][required]~label,): Use the inverseColor instead of grey.
+
 2019-10-01  Antti Koivisto  <an...@apple.com>
 
         [CSS Shadow Parts] Parse 'part' attribute

Modified: trunk/Tools/resultsdbpy/resultsdbpy/view/static/css/search.css (250586 => 250587)


--- trunk/Tools/resultsdbpy/resultsdbpy/view/static/css/search.css	2019-10-01 22:55:57 UTC (rev 250586)
+++ trunk/Tools/resultsdbpy/resultsdbpy/view/static/css/search.css	2019-10-01 23:46:02 UTC (rev 250587)
@@ -28,7 +28,7 @@
     position: absolute;
     -webkit-backdrop-filter: blur(5px) brightness(88%);
     backdrop-filter: blur(5px) brightness(88%);
-    color: var(--boldInverseColor);
+    color: var(--inverseColor);
     border: 1px solid #ccc;
     border-radius: 5px;
     margin: 5px 0 0 0;

Modified: trunk/Tools/resultsdbpy/resultsdbpy/view/static/css/tooltip.css (250586 => 250587)


--- trunk/Tools/resultsdbpy/resultsdbpy/view/static/css/tooltip.css	2019-10-01 22:55:57 UTC (rev 250586)
+++ trunk/Tools/resultsdbpy/resultsdbpy/view/static/css/tooltip.css	2019-10-01 23:46:02 UTC (rev 250587)
@@ -55,7 +55,7 @@
     position: absolute;
     -webkit-backdrop-filter: blur(10px) brightness(88%);
     backdrop-filter: blur(10px) brightness(88%);
-    color: var(--boldInverseColor);
+    color: var(--inverseColor);
     border-radius: 5px;
     padding: 5px;
     font-size: var(--smallSize);

Modified: trunk/Tools/resultsdbpy/resultsdbpy/view/static/js/drawer.js (250586 => 250587)


--- trunk/Tools/resultsdbpy/resultsdbpy/view/static/js/drawer.js	2019-10-01 22:55:57 UTC (rev 250586)
+++ trunk/Tools/resultsdbpy/resultsdbpy/view/static/js/drawer.js	2019-10-01 23:46:02 UTC (rev 250587)
@@ -222,8 +222,8 @@
         onStateUpdate: (element, state) => {element.value = state;}
     });
     return `<div class="input">
-            <label style="color:var(--boldInverseColor)">Limit:</label>
-            <input type="range" min="0" max="${max}" ref="${sliderRef}" style="background:var(--boldInverseColor)"></input>
+            <label>Limit:</label>
+            <input type="range" min="0" max="${max}" ref="${sliderRef}" style="background:var(--inverseColor)"></input>
             <input type="number" min="1" ref="${numberRef}" pattern="^[0-9]"></input>
         </div>`
 }

Modified: trunk/Tools/resultsdbpy/resultsdbpy/view/static/js/timeline.js (250586 => 250587)


--- trunk/Tools/resultsdbpy/resultsdbpy/view/static/js/timeline.js	2019-10-01 22:55:57 UTC (rev 250586)
+++ trunk/Tools/resultsdbpy/resultsdbpy/view/static/js/timeline.js	2019-10-01 23:46:02 UTC (rev 250587)
@@ -794,7 +794,7 @@
         }
     });
     eventStream.action((willFilterExpected) => ref.setState(willFilterExpected));
-    return `<div class="label" ref="${ref}"></div>`;
+    return `<div class="label" style="font-size: var(--smallSize)" ref="${ref}"></div>`;
 } 
 
 function Legend(callback=null, plural=false) {
@@ -863,7 +863,7 @@
         });
 
         result += `<div class="input">
-            <label style="font-size: var(--tinySize); color: var(--boldInverseColor)">Filter expected results</label>
+            <label>Filter expected results</label>
             <label class="switch">
                 <input type="checkbox"${willFilterExpected ? ' checked': ''} ref="${swtch}">
                 <span class="slider"></span>

Modified: trunk/Tools/resultsdbpy/resultsdbpy/view/static/library/css/webkit.css (250586 => 250587)


--- trunk/Tools/resultsdbpy/resultsdbpy/view/static/library/css/webkit.css	2019-10-01 22:55:57 UTC (rev 250586)
+++ trunk/Tools/resultsdbpy/resultsdbpy/view/static/library/css/webkit.css	2019-10-01 23:46:02 UTC (rev 250587)
@@ -92,7 +92,7 @@
   --formLabelPadding: 14px;
   --middleZIndex: 50;
   --topZIndex: 100;
-  --boldInverseColor: var(--black);
+  --inverseColor: var(--black);
 }
 
 @media screen and (min-width: 600px) {
@@ -124,7 +124,7 @@
     --borderColorInlineElement: var(--greyDarker);
     --borderColorSection: var(--blackDark);
     --borderColorHard: var(--blackDarker);
-    --boldInverseColor: var(--white);
+    --inverseColor: var(--white);
   }
 }
 
@@ -2268,6 +2268,10 @@
   align-items: center;
 }
 
+select, input {
+  font-weight: calc(2.5 * var(--fontWeight));
+}
+
 .row .input {
   margin: 0;
   margin-right: var(--colPaddingSize);
@@ -2276,13 +2280,8 @@
 .input>label {
   margin: 0;
   margin-left: var(--formLabelPadding);
-  color: var(--greyDarker);
+  font-color: var(--inverseColor);
 }
-@media (prefers-color-scheme: dark) {
-  .input>label {
-    color: var(--grey);
-  }
-}
 
 .input>label.switch {
   flex: none;
@@ -2333,7 +2332,7 @@
   padding-right: var(--formLabelPadding);
   text-align: left;
   border-radius: 4px;
-  border: 1px solid var(--grey);
+  border: 1px solid var(--greyDarker);
   background: none;
   vertical-align: top;
 }
@@ -2354,7 +2353,7 @@
   display: block;
   position: absolute;
   top: calc((var(--tinySize) + 4px) / 2);
-  color: var(--greyDarker);
+  color: var(--inverseColor);
   transition-timing-function: ease-in;
   transition-duration: .125s;
   font-size: var(--smallSize);

Modified: trunk/Tools/resultsdbpy/resultsdbpy/view/templates/commits.html (250586 => 250587)


--- trunk/Tools/resultsdbpy/resultsdbpy/view/templates/commits.html	2019-10-01 22:55:57 UTC (rev 250586)
+++ trunk/Tools/resultsdbpy/resultsdbpy/view/templates/commits.html	2019-10-01 23:46:02 UTC (rev 250587)
@@ -90,7 +90,7 @@
         },
     });
     return `<div class="input">
-            <label style="color:var(--boldInverseColor)">One-line:</label>
+            <label style="color:var(--inverseColor)">One-line:</label>
             <label class="switch">
                 <input type="checkbox" ref="${switchRef}" checked=${oneLine}>
                 <span class="slider"></span>
_______________________________________________
webkit-changes mailing list
webkit-changes@lists.webkit.org
https://lists.webkit.org/mailman/listinfo/webkit-changes

Reply via email to