Title: [124314] trunk/Source/WebCore
Revision
124314
Author
yo...@chromium.org
Date
2012-08-01 02:17:38 -0700 (Wed, 01 Aug 2012)

Log Message

[CSS] Add selectors for multiple fields time input UI.
https://bugs.webkit.org/show_bug.cgi?id=92834

Reviewed by Kent Tamura.

This patch adds new selectors and "height" property to spin button
for multiple fields time input UI.

RenderTextControlSingleLine::layout() sets height of spin button for
input type "number" and other input types using RenderTextControlSingleLine
as renderer object. However, multiple fields time input UI doesn't use
it and needs to set height of spin button.

No new tests. This patch doesn't change behavior.

* css/html.css:
(input::-webkit-datetime-edit): Added.
(input::-webkit-datetime-edit-ampm-field): Added.
(input::-webkit-datetime-edit-hour-field): Added.
(input::-webkit-datetime-edit-millisecond-field): Added.
(input::-webkit-datetime-edit-minute-field): Added.
(input::-webkit-datetime-edit-minute-field[readonly]): Added. This selector
is used for step>=3600 second and time format contains minute field.
(input::-webkit-datetime-edit-second-field): Added.
(input::-webkit-datetime-edit-second-field[readonly]): Added. This selector
is used for step>=60 second and time format contains second field.
(input::-webkit-inner-spin-button): Add "height" property for using
spin button other than RenderTextControlSingleLine.

Modified Paths

Diff

Modified: trunk/Source/WebCore/ChangeLog (124313 => 124314)


--- trunk/Source/WebCore/ChangeLog	2012-08-01 09:07:58 UTC (rev 124313)
+++ trunk/Source/WebCore/ChangeLog	2012-08-01 09:17:38 UTC (rev 124314)
@@ -1,3 +1,34 @@
+2012-08-01  Yoshifumi Inoue  <yo...@chromium.org>
+
+        [CSS] Add selectors for multiple fields time input UI.
+        https://bugs.webkit.org/show_bug.cgi?id=92834
+
+        Reviewed by Kent Tamura.
+
+        This patch adds new selectors and "height" property to spin button
+        for multiple fields time input UI.
+
+        RenderTextControlSingleLine::layout() sets height of spin button for
+        input type "number" and other input types using RenderTextControlSingleLine
+        as renderer object. However, multiple fields time input UI doesn't use
+        it and needs to set height of spin button.
+
+        No new tests. This patch doesn't change behavior.
+
+        * css/html.css:
+        (input::-webkit-datetime-edit): Added.
+        (input::-webkit-datetime-edit-ampm-field): Added.
+        (input::-webkit-datetime-edit-hour-field): Added.
+        (input::-webkit-datetime-edit-millisecond-field): Added.
+        (input::-webkit-datetime-edit-minute-field): Added.
+        (input::-webkit-datetime-edit-minute-field[readonly]): Added. This selector
+        is used for step>=3600 second and time format contains minute field.
+        (input::-webkit-datetime-edit-second-field): Added.
+        (input::-webkit-datetime-edit-second-field[readonly]): Added. This selector
+        is used for step>=60 second and time format contains second field.
+        (input::-webkit-inner-spin-button): Add "height" property for using
+        spin button other than RenderTextControlSingleLine.
+
 2012-08-01  Kwang Yul Seo  <sk...@company100.net>
 
         Make HTMLConstructionSite::createHTMLElement(AtomicHTMLToken*) private.

Modified: trunk/Source/WebCore/css/html.css (124313 => 124314)


--- trunk/Source/WebCore/css/html.css	2012-08-01 09:07:58 UTC (rev 124313)
+++ trunk/Source/WebCore/css/html.css	2012-08-01 09:17:38 UTC (rev 124314)
@@ -471,11 +471,80 @@
 }
 #endif
 
+#if defined(ENABLE_INPUT_TYPE_TIME_MULTIPLE_FIELDS) && ENABLE_INPUT_TYPE_TIME_MULTIPLE_FIELDS
+input[type="time"] {
+    font-family: monospace;
+}
+
+input::-webkit-datetime-edit {
+    -webkit-user-modify: read-only !important;
+    display: -webkit-box;
+    -webkit-box-align: center;
+}
+
+input::-webkit-datetime-edit-ampm-field {
+    -webkit-user-modify: read-only !important;
+    border: none;
+    width: 2em;
+    padding: 2px;
+}
+
+input::-webkit-datetime-edit-hour-field {
+    -webkit-user-modify: read-only !important;
+    display: inline-block;
+    border: none;
+    text-align: center;
+    width: 1.2em;
+    padding: 2px;
+}
+
+input::-webkit-datetime-edit-millisecond-field {
+    -webkit-user-modify: read-only !important;
+    display: inline-block;
+    border: none;
+    text-align: center;
+    width: 1.8em;
+    padding: 2px;
+}
+
+input::-webkit-datetime-edit-minute-field {
+    -webkit-user-modify: read-only !important;
+    display: inline-block;
+    border: none;
+    text-align: center;
+    width: 1.2em;
+    padding: 2px;
+}
+
+/* This selector is used when step >= 3600 second but format contains minute field. */
+input::-webkit-datetime-edit-minute-field[readonly] {
+    color: GrayText;
+}
+
+input::-webkit-datetime-edit-second-field {
+    -webkit-user-modify: read-only !important;
+    display: inline-block;
+    border: none;
+    text-align: center;
+    width: 1.2em;
+    padding: 2px;
+}
+
+/* This selector is used when step >= 60 second but format contains second field. */
+input::-webkit-datetime-edit-second-field[readonly] {
+    color: GrayText;
+}
+#endif
+
 input::-webkit-inner-spin-button {
     -webkit-appearance: inner-spin-button;
     display: block;
     position: relative;
     cursor: default;
+    /* This height property is ignored for input type "number" and others which
+     * use RenderTextControlSingleLine as renderer which sets height of spin
+     * button in layout(). */
+    height: 1.5em;
     vertical-align: top;
     -webkit-box-flex: 0;
     -webkit-user-select: none;
_______________________________________________
webkit-changes mailing list
webkit-changes@lists.webkit.org
http://lists.webkit.org/mailman/listinfo/webkit-changes

Reply via email to