Modified: trunk/Tools/ChangeLog (249020 => 249021)
--- trunk/Tools/ChangeLog 2019-08-22 18:18:04 UTC (rev 249020)
+++ trunk/Tools/ChangeLog 2019-08-22 18:50:01 UTC (rev 249021)
@@ -1,3 +1,19 @@
+2019-08-22 Zhifei Fang <zhifei_f...@apple.com>
+
+ [results.webkit.org Webkit.css] Change input's disable style
+ The disable input style will always show the label like it has a value
+ https://bugs.webkit.org/show_bug.cgi?id=200998
+
+ Reviewed by Jonathan Bedard.
+
+ * resultsdbpy/resultsdbpy/view/static/library/css/docs.yaml: Adding a new example for disabled input that already has a value
+ *resultsdbpy/resultsdbpy/view/static/library/css/generate-webkit-css-docs:
+ * resultsdbpy/resultsdbpy/view/static/library/css/index.html:
+ * resultsdbpy/resultsdbpy/view/static/library/css/webkit.css:
+ (.input>input[type="text"][required][disabled],.input>input[type="number"][required][disabled],):When disabling a text input element even without a value, the style should match the style of a text input element with a value
+ (.input>input[type="text"][required][disabled]~label, .input>input[type="number"][required][disabled]~label,):
+ (@media (prefers-color-scheme: dark)):
+
2019-08-17 Darin Adler <da...@apple.com>
Use makeString and multi-argument StringBuilder::append instead of less efficient multiple appends
Modified: trunk/Tools/resultsdbpy/resultsdbpy/view/static/library/css/docs.yaml (249020 => 249021)
--- trunk/Tools/resultsdbpy/resultsdbpy/view/static/library/css/docs.yaml 2019-08-22 18:18:04 UTC (rev 249020)
+++ trunk/Tools/resultsdbpy/resultsdbpy/view/static/library/css/docs.yaml 2019-08-22 18:50:01 UTC (rev 249021)
@@ -663,6 +663,10 @@
<label>Disabled</label>
</div>
<div class="input">
+ <input type="text" required disabled value="I am disabled"/>
+ <label>Disabled with existing value</label>
+ </div>
+ <div class="input">
<input class="invalid" type="text" required value="use invalid mixin to force invalid style"/>
<label>Invalid</label>
</div>
Modified: trunk/Tools/resultsdbpy/resultsdbpy/view/static/library/css/generate-webkit-css-docs (249020 => 249021)
--- trunk/Tools/resultsdbpy/resultsdbpy/view/static/library/css/generate-webkit-css-docs 2019-08-22 18:18:04 UTC (rev 249020)
+++ trunk/Tools/resultsdbpy/resultsdbpy/view/static/library/css/generate-webkit-css-docs 2019-08-22 18:50:01 UTC (rev 249021)
@@ -1,3 +1,4 @@
+#!/usr/bin/python
# Copyright (C) 2019 Apple Inc. All rights reserved.
#
# Redistribution and use in source and binary forms, with or without
@@ -20,7 +21,6 @@
# OR TORT (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE
# OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
-#!/usr/bin/python
from argparse import ArgumentParser
import jinja2
import yaml
Modified: trunk/Tools/resultsdbpy/resultsdbpy/view/static/library/css/index.html (249020 => 249021)
--- trunk/Tools/resultsdbpy/resultsdbpy/view/static/library/css/index.html 2019-08-22 18:18:04 UTC (rev 249020)
+++ trunk/Tools/resultsdbpy/resultsdbpy/view/static/library/css/index.html 2019-08-22 18:50:01 UTC (rev 249021)
@@ -1566,6 +1566,10 @@
<label>Disabled</label>
</div>
<div class="input">
+ <input type="text" required disabled value="I am disabled"/>
+ <label>Disabled with existing value</label>
+</div>
+<div class="input">
<input class="invalid" type="text" required value="use invalid mixin to force invalid style"/>
<label>Invalid</label>
</div>
@@ -1581,6 +1585,10 @@
<label>Disabled</label>
</div>
<div class="input">
+ <input type="text" required disabled value="I am disabled"/>
+ <label>Disabled with existing value</label>
+</div>
+<div class="input">
<input class="invalid" type="text" required value="use invalid mixin to force invalid style"/>
<label>Invalid</label>
</div>
Modified: trunk/Tools/resultsdbpy/resultsdbpy/view/static/library/css/webkit.css (249020 => 249021)
--- trunk/Tools/resultsdbpy/resultsdbpy/view/static/library/css/webkit.css 2019-08-22 18:18:04 UTC (rev 249020)
+++ trunk/Tools/resultsdbpy/resultsdbpy/view/static/library/css/webkit.css 2019-08-22 18:50:01 UTC (rev 249021)
@@ -2270,8 +2270,8 @@
vertical-align: top;
}
-.input>input[type="text"][required]:disabled, .input>input[type="number"][required]:disabled,
-.input>input[type="password"][required]:disabled, .input>input[type="email"][required]:disabled, .input>select:disabled {
+.input>input[type="text"][required][disabled], .input>input[type="number"][required][disabled],
+.input>input[type="password"][required][disabled], .input>input[type="email"][required][disabled], .input>select[disabled] {
border: 1px solid var(--greyLighter);
}
@@ -2294,9 +2294,16 @@
z-index: 1;
}
-.input>input[type="text"][required]:disabled~label, .input>input[type="number"][required]:disabled~label,
-.input>input[type="password"][required]:disabled~label, .input>input[type="email"][required]:disabled~label, .input>select:disabled~label {
+.input>input[type="text"][required][disabled], .input>input[type="number"][required][disabled],
+.input>input[type="password"][required][disabled], .input>input[type="email"][required][disabled], .input>select[disabled] {
+ color: var(--greyDarker);
+}
+
+.input>input[type="text"][required][disabled]~label, .input>input[type="number"][required][disabled]~label,
+.input>input[type="password"][required][disabled]~label, .input>input[type="email"][required][disabled]~label, .input>select[disabled]~label {
color: var(--grey);
+ font-size: var(--tinySize);
+ top: 4px;
}
@@ -2337,13 +2344,14 @@
color: var(--grey);
}
- .input>input[type="text"][required]:disabled, .input>input[type="number"][required]:disabled,
- .input>input[type="password"][required]:disabled, .input>input[type="email"][required]:disabled, .input>select:disabled {
+ .input>input[type="text"][required][disabled], .input>input[type="number"][required][disabled],
+ .input>input[type="password"][required][disabled], .input>input[type="email"][required][disabled], .input>select[disabled] {
border: 1px solid var(--greyDarker);
+ color: var(--blackDark);
}
- .input>input[type="text"][required]:disabled~label, .input>input[type="number"][required]:disabled~label,
- .input>input[type="password"][required]:disabled~label, .input>input[type="email"][required]:disabled~label, .input>select:disabled~label {
+ .input>input[type="text"][required][disabled]~label, .input>input[type="number"][required][disabled]~label,
+ .input>input[type="password"][required][disabled]~label, .input>input[type="email"][required][disabled]~label, .input>select[disabled]~label {
color: var(--greyDarker);
}
