From c017e19ed236c1e2f6d3818e080f2a03ef4f947b Mon Sep 17 00:00:00 2001 From: Jon Schlinkert Date: Fri, 2 Aug 2013 15:31:13 -0400 Subject: Resolves https://github.com/twbs/bootstrap/issues/9014. updates mixins to consistently use semicolons as argument separator. Rebuild to confirm, no diff in compiled CSS. --- less/forms.less | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) (limited to 'less/forms.less') diff --git a/less/forms.less b/less/forms.less index f4e8c996d..fc5585928 100644 --- a/less/forms.less +++ b/less/forms.less @@ -255,15 +255,15 @@ textarea { // Warning .has-warning { - .form-control-validation(@state-warning-text, @state-warning-text, @state-warning-bg); + .form-control-validation(@state-warning-text; @state-warning-text; @state-warning-bg); } // Error .has-error { - .form-control-validation(@state-danger-text, @state-danger-text, @state-danger-bg); + .form-control-validation(@state-danger-text; @state-danger-text; @state-danger-bg); } // Success .has-success { - .form-control-validation(@state-success-text, @state-success-text, @state-success-bg); + .form-control-validation(@state-success-text; @state-success-text; @state-success-bg); } -- cgit v1.2.3 From 173dac4e54281312ebb7ff993df20caffbc56840 Mon Sep 17 00:00:00 2001 From: Mark Otto Date: Fri, 2 Aug 2013 15:09:48 -0700 Subject: Tighten up buttons and form controls * Smaller padding on buttons and large buttons * Same with inputs and large inputs * Remove about 10px from height of large inputs/buttons and 4px from regular ones Fixes #8707 and #8700. (Also relevant: #8711) --- less/forms.less | 2 ++ 1 file changed, 2 insertions(+) (limited to 'less/forms.less') diff --git a/less/forms.less b/less/forms.less index fc5585928..494d328c0 100644 --- a/less/forms.less +++ b/less/forms.less @@ -222,12 +222,14 @@ input[type="number"] { height: @input-height-large; padding: @padding-large-vertical @padding-large-horizontal; font-size: @font-size-large; + line-height: @line-height-large; border-radius: @border-radius-large; } .input-small { height: @input-height-small; padding: @padding-small-vertical @padding-small-horizontal; font-size: @font-size-small; + line-height: @line-height-small; border-radius: @border-radius-small; } -- cgit v1.2.3 From 9435991ff0ffa79c027f12c0a08aa13376c3b2fe Mon Sep 17 00:00:00 2001 From: Mark Otto Date: Fri, 2 Aug 2013 18:48:44 -0700 Subject: move form layouts from input groups back to forms (messed this up in b281ad64096d919145159ffbc4e1a5b284708d9b) --- less/forms.less | 44 ++++++++++++++++++++++++++++++++++++++++++++ 1 file changed, 44 insertions(+) (limited to 'less/forms.less') diff --git a/less/forms.less b/less/forms.less index 494d328c0..41d50a5e0 100644 --- a/less/forms.less +++ b/less/forms.less @@ -280,3 +280,47 @@ textarea { margin-bottom: 10px; color: lighten(@text-color, 25%); // lighten the text some for contrast } + + + +// Inline forms +// +// Make forms appear inline(-block). + +.form-inline { + .form-control, + .radio, + .checkbox { + display: inline-block; + } + .radio, + .checkbox { + margin-top: 0; + margin-bottom: 0; + } +} + + +// Horizontal forms +// +// Horizontal forms are built on grid classes and allow you to create forms with +// labels on the left and inputs on the right. + +.form-horizontal .control-label, +.form-horizontal .radio-inline, +.form-horizontal .checkbox-inline { + padding-top: 9px; +} + +.form-horizontal { + .form-group { + .make-row(); + } +} + +// Only right align form labels here when the columns stop stacking +@media (min-width: @screen-tablet) { + .form-horizontal .control-label { + text-align: right; + } +} -- cgit v1.2.3 From 23ef8c0c209844dd8b92d2a5ac82daffa7bd2914 Mon Sep 17 00:00:00 2001 From: Chris Rebert Date: Sat, 3 Aug 2013 21:39:57 -0700 Subject: Greater standardization of sizing terminology In class names: * large => lg * small => sm * mini => xs ("Extra small") In screen size categories: * Tiny => Extra small --- less/forms.less | 12 ++++++------ 1 file changed, 6 insertions(+), 6 deletions(-) (limited to 'less/forms.less') diff --git a/less/forms.less b/less/forms.less index 41d50a5e0..127f6a67a 100644 --- a/less/forms.less +++ b/less/forms.less @@ -218,14 +218,14 @@ input[type="number"] { // horizontal sizing, wrap controls in the predefined grid classes. `` -// element gets special love because it's special, and that's a fact! - -.input-lg { - height: @input-height-large; - padding: @padding-large-vertical @padding-large-horizontal; - font-size: @font-size-large; - line-height: @line-height-large; - border-radius: @border-radius-large; -} .input-sm { - height: @input-height-small; - padding: @padding-small-vertical @padding-small-horizontal; - font-size: @font-size-small; - line-height: @line-height-small; - border-radius: @border-radius-small; + .input-size(@input-height-large; @padding-large-vertical; @padding-large-horizontal; @font-size-large; @line-height-large; @border-radius-large); } -select { - &.input-lg { - height: @input-height-large; - line-height: @input-height-large; - } - &.input-sm { - height: @input-height-small; - line-height: @input-height-small; - } -} -textarea { - &.input-lg, - &.input-sm { - height: auto; - } +.input-lg { + .input-size(@input-height-small; @padding-small-vertical; @padding-small-horizontal; @font-size-small; @line-height-small; @border-radius-small); } -- cgit v1.2.3 From f0ee3aaac03ca74cb19fc6d287b44bd9f0293ba0 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Guillermo=20Gonz=C3=A1lez=20de=20Ag=C3=BCero?= Date: Tue, 13 Aug 2013 23:31:33 +0200 Subject: Swapped input-lg and input-sm Fixing my own error. Thanks to @kyleledbetter for reporting. --- less/forms.less | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) (limited to 'less/forms.less') diff --git a/less/forms.less b/less/forms.less index 18d3efb54..a8847be2b 100644 --- a/less/forms.less +++ b/less/forms.less @@ -210,11 +210,11 @@ input[type="number"] { // Form control sizing .input-sm { - .input-size(@input-height-large; @padding-large-vertical; @padding-large-horizontal; @font-size-large; @line-height-large; @border-radius-large); + .input-size(@input-height-small; @padding-small-vertical; @padding-small-horizontal; @font-size-small; @line-height-small; @border-radius-small); } .input-lg { - .input-size(@input-height-small; @padding-small-vertical; @padding-small-horizontal; @font-size-small; @line-height-small; @border-radius-small); + .input-size(@input-height-large; @padding-large-vertical; @padding-large-horizontal; @font-size-large; @line-height-large; @border-radius-large); } -- cgit v1.2.3 From e684758b55dbfe1e18f3e3aa4d5eddcfaf1bd010 Mon Sep 17 00:00:00 2001 From: Chris Rebert Date: Wed, 14 Aug 2013 18:20:28 -0700 Subject: fixes #9511; set cursor:not-allowed for disabled buttons,checkboxes,radios --- less/forms.less | 16 +++++++++++++++- 1 file changed, 15 insertions(+), 1 deletion(-) (limited to 'less/forms.less') diff --git a/less/forms.less b/less/forms.less index a8847be2b..adcb0dc32 100644 --- a/less/forms.less +++ b/less/forms.less @@ -133,7 +133,7 @@ input[type="number"] { .form-control-focus(); // Disabled and read-only inputs - // Note: HTML5 says that inputs under a fieldset > legend:first-child won't be + // 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. &[disabled], @@ -207,6 +207,20 @@ input[type="number"] { margin-left: 10px; // space out consecutive inline controls } +// Apply same disabled cursor tweak as for 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. +// Note: Neither radios nor checkboxes can be readonly. +.radio, +.radio-inline, +.checkbox, +.checkbox-inline { + &[disabled], + fieldset[disabled] & { + cursor: not-allowed; + } +} // Form control sizing .input-sm { -- cgit v1.2.3 From 2690a3dc3185e9666384cf6982354f0456473da7 Mon Sep 17 00:00:00 2001 From: Mark Otto Date: Thu, 15 Aug 2013 11:52:22 -0700 Subject: Add to #9578 and fix #9614: use cursor not-allowed on radios and checkboxes --- less/forms.less | 12 ++++++------ 1 file changed, 6 insertions(+), 6 deletions(-) (limited to 'less/forms.less') diff --git a/less/forms.less b/less/forms.less index adcb0dc32..c59cdd4d7 100644 --- a/less/forms.less +++ b/less/forms.less @@ -133,9 +133,9 @@ input[type="number"] { .form-control-focus(); // 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. + // 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. &[disabled], &[readonly], fieldset[disabled] & { @@ -208,10 +208,10 @@ input[type="number"] { } // Apply same disabled cursor tweak as for 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. +// // Note: Neither radios nor checkboxes can be readonly. +input[type="radio"], +input[type="checkbox"], .radio, .radio-inline, .checkbox, -- cgit v1.2.3