diff options
Diffstat (limited to 'less/forms.less')
| -rw-r--r-- | less/forms.less | 61 |
1 files changed, 45 insertions, 16 deletions
diff --git a/less/forms.less b/less/forms.less index d0189d0cc..273e36608 100644 --- a/less/forms.less +++ b/less/forms.less @@ -51,7 +51,7 @@ input[type="search"] { input[type="radio"], input[type="checkbox"] { margin: 4px 0 0; - margin-top: 1px \9; /* IE8-9 */ + margin-top: 1px \9; // IE8-9 line-height: normal; } @@ -133,9 +133,10 @@ output { .placeholder(); // Disabled and read-only inputs - // Note: HTML5 says that controls under a fieldset > legend:first-child won't - // be disabled if the fieldset is disabled. Due to implementation difficulty, - // we don't honor that edge case; we style them as disabled anyway. + // + // HTML5 says that controls under a fieldset > legend:first-child won't be + // disabled if the fieldset is disabled. Due to implementation difficulty, we + // don't honor that edge case; we style them as disabled anyway. &[disabled], &[readonly], fieldset[disabled] & { @@ -150,10 +151,24 @@ output { } } + +// Search inputs in iOS +// +// This overrides the extra rounded corners on search inputs in iOS so that our +// `.form-control` class can properly style them. Note that this cannot simply +// be added to `.form-control` as it's not specific enough. For details, see +// https://github.com/twbs/bootstrap/issues/11586. + +input[type="search"] { + -webkit-appearance: none; +} + + // Special styles for iOS date input // // In Mobile Safari, date inputs require a pixel line-height that matches the // given height of the input. + input[type="date"] { line-height: @input-height-base; } @@ -256,18 +271,27 @@ input[type="checkbox"], .form-control { padding-right: (@input-height-base * 1.25); } - - // Feedback icon (requires .glyphicon classes) - .form-control-feedback { - position: absolute; - top: (@line-height-computed + 5); // Height of the `label` and its margin - right: 0; - display: block; - width: @input-height-base; - height: @input-height-base; - line-height: @input-height-base; - text-align: center; - } +} +// Feedback icon (requires .glyphicon classes) +.form-control-feedback { + position: absolute; + top: (@line-height-computed + 5); // Height of the `label` and its margin + right: 0; + display: block; + width: @input-height-base; + height: @input-height-base; + line-height: @input-height-base; + text-align: center; +} +.input-lg + .form-control-feedback { + width: @input-height-large; + height: @input-height-large; + line-height: @input-height-large; +} +.input-sm + .form-control-feedback { + width: @input-height-small; + height: @input-height-small; + line-height: @input-height-small; } // Feedback states @@ -334,6 +358,10 @@ input[type="checkbox"], width: auto; // Prevent labels from stacking above inputs in `.form-group` vertical-align: middle; } + // Input groups need that 100% width though + .input-group > .form-control { + width: 100%; + } .control-label { margin-bottom: 0; @@ -399,6 +427,7 @@ input[type="checkbox"], .form-control-static { padding-top: (@padding-base-vertical + 1); + padding-bottom: (@padding-base-vertical + 1); } // Only right align form labels here when the columns stop stacking |
