aboutsummaryrefslogtreecommitdiff
path: root/less/forms.less
diff options
context:
space:
mode:
Diffstat (limited to 'less/forms.less')
-rw-r--r--less/forms.less59
1 files changed, 23 insertions, 36 deletions
diff --git a/less/forms.less b/less/forms.less
index aefc0dea5..1bcc2b6b9 100644
--- a/less/forms.less
+++ b/less/forms.less
@@ -141,7 +141,7 @@ output {
&[disabled],
&[readonly],
fieldset[disabled] & {
- cursor: not-allowed;
+ cursor: @cursor-disabled;
background-color: @input-bg-disabled;
opacity: 1; // iOS fix for unreadable disabled content
}
@@ -168,41 +168,28 @@ input[type="search"] {
// Special styles for iOS temporal inputs
//
// In Mobile Safari, setting `display: block` on temporal inputs causes the
-// text within the input to become vertically misaligned.
-// As a workaround, we set a pixel line-height that matches the
-// given height of the input. Since this fucks up everything else, we have to
-// appropriately reset it for Internet Explorer and the size variations.
-
-input[type="date"],
-input[type="time"],
-input[type="datetime-local"],
-input[type="month"] {
- line-height: @input-height-base;
- // IE8+ misaligns the text within date inputs, so we reset
- line-height: @line-height-base ~"\0";
-
- &.input-sm {
+// text within the input to become vertically misaligned. As a workaround, we
+// set a pixel line-height that matches the given height of the input, but only
+// for Safari.
+
+@media screen and (-webkit-min-device-pixel-ratio: 0) {
+ input[type="date"],
+ input[type="time"],
+ input[type="datetime-local"],
+ input[type="month"] {
+ line-height: @input-height-base;
+ }
+ input[type="date"].input-sm,
+ input[type="time"].input-sm,
+ input[type="datetime-local"].input-sm,
+ input[type="month"].input-sm {
line-height: @input-height-small;
- line-height: @line-height-small ~"\0";
}
- &.input-lg {
+ input[type="date"].input-lg,
+ input[type="time"].input-lg,
+ input[type="datetime-local"].input-lg,
+ input[type="month"].input-lg {
line-height: @input-height-large;
- line-height: @line-height-large ~"\0";
- }
-}
-
-// IE 11 hack to reverse the iOS temporal input hack.
-_:-ms-fullscreen, :root input[type="date"],
-_:-ms-fullscreen, :root input[type="time"],
-_:-ms-fullscreen, :root input[type="datetime-local"],
-_:-ms-fullscreen, :root input[type="month"] {
- line-height: @line-height-base;
-
- &.input-sm {
- line-height: @line-height-small;
- }
- &.input-lg {
- line-height: @line-height-large;
}
}
@@ -275,7 +262,7 @@ input[type="checkbox"] {
&[disabled],
&.disabled,
fieldset[disabled] & {
- cursor: not-allowed;
+ cursor: @cursor-disabled;
}
}
// These classes are used directly on <label>s
@@ -283,7 +270,7 @@ input[type="checkbox"] {
.checkbox-inline {
&.disabled,
fieldset[disabled] & {
- cursor: not-allowed;
+ cursor: @cursor-disabled;
}
}
// These classes are used on elements with <label> descendants
@@ -292,7 +279,7 @@ input[type="checkbox"] {
&.disabled,
fieldset[disabled] & {
label {
- cursor: not-allowed;
+ cursor: @cursor-disabled;
}
}
}