aboutsummaryrefslogtreecommitdiff
path: root/scss/_forms.scss
AgeCommit message (Collapse)AuthorFilesLines
2017-06-05flesh out invalid styles on .was-validatedMark Otto1-0/+82
2017-06-01trying out new validation stylesMark Otto1-3/+17
2017-04-22Change how input and select height is computedMark Otto1-8/+5
— Previously we weren't including the border-width on the computed height, leading to alignment issues. — New system utilizes three variables (not ideal, but straightforward) for computing these heights. One for the vertical border, one for the line-height/font-size/padding dance, and one to add those together. — Updates CSS across forms and custom forms to use new sizing. Special note here: form validation icon sizing uses the inner variables because background-image doesn't bleed into borders unless explicit background-clip.
2017-04-10Remove `cursor: not-allowed` stylesPatrick H. Lauke1-5/+0
2017-03-28Revamp button and input vars while fixing #21587 (#22287)Mark Otto1-18/+22
2017-03-18Update scss mixins to comply with scss-linting rules (#22151)naicko1-1/+1
* Fixed some linting issues * Run npm tasks after scss cleanup * Revert "Run npm tasks after scss cleanup" This reverts commit 1103a0da68d1846ad592eb4a105046a939557830. * Property sort order for grid * Let's respest the property order in the mixins * Respect property sort order in reboot file * ::-ms-expand is a vendor-prefix, add it to the scss-lint disable * Revert hover mixin comment * Fixed missing mixin hover-focus
2017-01-23Remove `cursor: pointer;` (#21812)Mark Otto1-1/+0
* Remove most of custom cursor: pointer; implementations * turns out that's not so much of a thing
2016-12-28use align-items on .form-inline to keep items from growing too much (#21461)Mark Otto1-0/+1
2016-12-27use varMark Otto1-1/+1
2016-12-27fix inline checksMark Otto1-1/+3
2016-12-27add some varsMark Otto1-12/+7
2016-12-25Use calc() on .col-form-label padding calculationsMark Otto1-6/+6
Fixes #21135. There's a height mismatch here because we're setting padding on the labels, while inputs get padding *and* a top+bottom border. This now uses calc to determine the exact height needed to match labels to inputs.
2016-12-25Replaces #21270 with proper fixMark Otto1-1/+1
Rather than overriding this just on inline form examples, this should be for all static form controls to match inputs.
2016-12-25vertically center .form-group contents in inline formsMark Otto1-0/+1
fixes broken inline form example mentioned in #21407
2016-12-21Flexbox all the time (Drop IE9 support and remove $enable-flex option) (#21389)Mark Otto1-60/+21
* remove the $enable-flex variable option * remove bootstrap-flex.css dist file and it's grunt task * remove the separate flex css file for docs; it's all the same now * remove flexbox docs (porting some to the main grid docs in next commit) * clean up few grid docs bits to simplify copy, start to mention flexbox * port relevant flexbox-grid.md content to grid.md - clean up mixins - update how it works section - bring over sizing and alignment sections * remove the $enable-flex from the options.md page * update lead paragraph to mention flexbox * update migration to mention loss of ie9 support * remove mention of flexbox dist file * clarify IE support * making a note * remove flexbox variant mentions from component docs - updates docs for media object, navs, list group, and cards to consolidate docs - no more need to callout flexbox variants since it's now the default * remove $enable-flex if/else from sass files * remove flex dist files * update scss lint property order to account for flex properties * linting * change to numberless classes for autosizing, wrap in highlighting div * bump gruntfile and postcss to ie10 * redo intro sections * rearrange * phew, redo hella grid docs - rearrange all the things - consolidate some bits * remove reference to flexbox mode * more border action for demo * Make some changes to the .card's in .card-deck's to ensure footers align to the bottom
2016-12-20Overwrite margin-bottom on form-control-static (#21270)Gijs Boddeus1-0/+1
* Overwrite margin-bottom on form-control-static In the documentation the form-control-static class has been used on a p element. On the regular vertical form the margin bottom of the p element gets overwritten by a mb-0 class. In the inline form example this class hasn't been applied, therefore the p element gets a margin-bottom. To prevent this behavior we can add a margin-bottom of 0. * Update _forms.scss
2016-12-19Add variables for transitions (#21345)Tom Lutzenberger1-1/+1
* Add variables for transitions * Add variables for transitions
2016-11-28Fix #20936 make inline checkbox/radio markup same as stacked (#20995)Brad Kent1-10/+4
* #20936 make inline checkbox/radio markup same as stacked * tweak language and remove extra blank line in snippet
2016-11-28Fix incorrect select height calculation (#21171)Florian Schlittenbauer1-1/+1
2016-11-26Update inline forms (updated docs and new flexbox styles) (#21212)Mark Otto1-11/+70
* fix form-inline with flex enabled * grunt * fix alignment of labels * shorter if syntax * add new form example to docs for now * update inline form docs usage guidelines * responsive margins * better margin utils * fix sizing of .form-check * flexbox alignment of .form-check * no need to change direction * support custom controls in inline form, for default and flex modes * add example of custom select and checks to docs * remove hidden and visible label variants since we cover that in the usage guidelines at the start and include hidden labels everywhere * use property value instead of layout name * apply to all labels * add a visible label, space it out * add id
2016-10-09Match the height of select.form-control with input.form-controlMark Otto1-1/+2
Uses a local variable and some calc love to counteract the border-width (times 2) from the height of the select. Fixes #17194 and nullifies #19967.
2016-10-09remove un-needed commentMark Otto1-1/+0
2016-10-09add transparent border to match .form-control heightMark Otto1-0/+2
2016-10-09Update static form controlMark Otto1-3/+1
- Remove margin-bottom override in favor of .mb-0 utility class - Apply the input line-height styles to match - Remove the min-height to match the input
2016-10-09Ensure input groups behavior appropriately in inline formsMark Otto1-0/+1
Overrides the default width: 100% with an auto. Fixes #20752.
2016-10-02Only override input border-radius as part of .form-control to avoid bug with ↵Mark Otto1-1/+9
iOS Safari (alt fix for #20247) (#20695)
2016-10-02Fixes #20799: Apply same color change to disabled inline radios/checkboxes ↵Mark Otto1-0/+1
(#20826)
2016-05-10Bring back some 'help text' love for forms with .form-textMark Otto1-1/+6
- Includes new class - New docs to support it - Rearranged older docs
2016-05-09Merge branch 'v4-forms-cleanup' of https://github.com/twbs/bootstrap into ↵Mark Otto1-0/+1
v4-forms-cleanup
2016-05-09Update checkboxes and radios docsMark Otto1-0/+1
- Add lighter gray text to disabled state for .form-check - Separate radios and checkboxes example - Clarify docs
2016-05-08update classes for inline form to new checkbox optionsMark Otto1-8/+5
2016-05-08Fixes #19771: Enable .form-control-sm/lg on select.form-controlMark Otto1-0/+12
2016-05-08lintingMark Otto1-1/+1
2016-05-08Redo checkboxes and radiosMark Otto1-51/+24
- Move disabled radio and checkbox styles to Reboot - Collapse .radio and .checkbox into single class, .form-check - Collapse .radio-inline and .checkbox-inline into single class, .form-check-inline - Require classes for sub-elements in both new classes
2016-04-23nuke commented out cssMark Otto1-78/+0
2016-04-23Avoid hacking around the temporal input bug in iOSMark Otto1-32/+0
- Rather than use CSS hacks, let's avoid needing to hack anything - Creates a new Reboot entry to simply reset the appear of the temporal inputs, thereby avoiding the problem entirely - Less than ideal for conveying affordance on iOS, but given bugginess of the input itself, seems a decent tradeoff
2016-04-23Merge branch 'v4-dev' into v4-forms-cleanupMark Otto1-0/+10
2016-04-12Suppress IE/Edge additional white/blue colors for focused <select>Patrick H. Lauke1-0/+10
2016-04-08Fixes #18573: Change name of .form-control-label to .col-form-label (and ↵Mark Otto1-4/+4
.form-control-legend to .col-form-legend) to reiterate use for only grid layouts
2016-04-08fix up broke forms styles and docs example for the gridMark Otto1-1/+2
2016-04-08Merge branch 'v4-dev' into v4-forms-cleanupMark Otto1-0/+13
2016-02-19Add form-control-legendPatrick H. Lauke1-0/+12
2016-02-09.text-help is dead, long live .form-control-feedbackMark Otto1-0/+4
Uses a new more specific class, adds some basic spacing, and clarifies that this class is only for validation feedback. Clears up the help text class question in https://github.com/twbs/bootstrap/pull/18704#issuecomment-168241731 and addresses the vertical spacing in #18703.
2016-02-09fix #18515: add .form-control-label-* classes to match large/small inputsMark Otto1-0/+12
2016-02-09don't set horizontal padding on .form-control-label /cc #18130 #17498Mark Otto1-1/+2
2016-02-08Move to a translucent input border with background-clip: padding-box for ↵Mark Otto1-0/+1
improved blending across different background-colors
2016-02-08_forms.scss: Use division instead of fractional multiplicationChris Rebert1-2/+2
[skip sauce] [skip validator]
2016-02-08_forms.scss: Remove extra trailing 0 in fractional numberChris Rebert1-1/+1
[skip sauce] [skip validator]
2016-02-07Merge branch 'v4-dev' into v4-form-sizingMark Otto1-4/+4
2016-02-07updated button/form-control padding and line-heightMark Otto1-0/+1
- Moves from no set line-height (inherited of 1.5) to declared 1.25 for all inputs and buttons (regardless of size modifier). - Updates padding to be `.5rem` instead of `.375rem` so that padding is more likely to be whole numbers based on the root font-size. - Whole numbers will be beneficial in avoiding odd fractional pixels that can lead to misalignment as shown in #18607. - Large buttons and inputs are now a tad wider, and smaller buttons/inputs a tad shorter and narrower, too.