- 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>