mirror_css/bootstrap
1
0
Fork 0
mirror of https://github.com/twbs/bootstrap.git synced 2025-08-19 03:41:19 +02:00
Code Issues Releases Wiki Activity

Fix up some form docs styles, sizing, etc

Browse Source
This commit is contained in:
Mark Otto
2015-04-23 01:10:14 -07:00
parent dc3abb5f12
commit 490294e68b
10 changed files with 154 additions and 166 deletions
Download Patch File Download Diff File Expand all files Collapse all files

147
scss/_forms.scss
View File

@@ -111,6 +111,79 @@
// }
// Static form control text
//
// Apply class to an element to make any string of text align with labels in a
// horizontal form layout.
.form-control-static {
min-height: ($line-height-computed + $font-size-base);
// Size it appropriately next to real form controls
padding-top: ($padding-base-vertical + $border-width);
padding-bottom: ($padding-base-vertical + $border-width);
// Remove default margin from `p`
margin-bottom: 0;
&.form-control-sm,
&.form-control-lg {
padding-right: 0;
padding-left: 0;
}
}
// Form control sizing
//
// Build on `.form-control` with modifier classes to decrease or increase the
// height and font-size of form controls.
//
// The `.form-group-* form-control` variations are sadly duplicated to avoid the
// issue documented in https://github.com/twbs/bootstrap/issues/15074.
.form-control-sm {
height: $input-height-sm;
padding: $padding-sm-vertical $padding-sm-horizontal;
font-size: $font-size-sm;
line-height: $line-height-sm;
border-radius: $input-border-radius-sm;
}
.form-control-lg {
height: $input-height-lg;
padding: $padding-lg-vertical $padding-lg-horizontal;
font-size: $font-size-lg;
line-height: $line-height-lg;
border-radius: $input-border-radius-lg;
}
// @include input-size('.input-sm', $input-height-sm, $padding-sm-vertical, $padding-sm-horizontal, $font-size-sm, $line-height-sm, $input-border-radius-sm);
// .form-group-sm {
// @include input-size('.form-control', $input-height-sm, $padding-sm-vertical, $padding-sm-horizontal, $font-size-sm, $line-height-sm, $input-border-radius-sm);
// .form-control-static {
// height: $input-height-sm;
// min-height: ($line-height-computed + $font-size-sm);
// padding: $padding-sm-vertical $padding-sm-horizontal;
// font-size: $font-size-sm;
// line-height: $line-height-sm;
// }
// }
// @include input-size('.input-lg', $input-height-lg, $padding-lg-vertical, $padding-lg-horizontal, $font-size-lg, $line-height-lg, $input-border-radius-lg);
// .form-group-lg {
// @include input-size('.form-control', $input-height-lg, $padding-lg-vertical, $padding-lg-horizontal, $font-size-lg, $line-height-lg, $input-border-radius-lg);
// .form-control-static {
// height: $input-height-lg;
// min-height: ($line-height-computed + $font-size-lg);
// padding: $padding-lg-vertical $padding-lg-horizontal;
// font-size: $font-size-lg;
// line-height: $line-height-lg;
// }
// }
// Form groups
//
// Designed to help with the organization and spacing of vertical forms. For
@@ -206,80 +279,6 @@ input[type="checkbox"] {
}
// Static form control text
//
// Apply class to a `p` element to make any string of text align with labels in
// a horizontal form layout.
.form-control-static {
min-height: ($line-height-computed + $font-size-base);
// Size it appropriately next to real form controls
padding-top: ($padding-base-vertical + 1);
padding-bottom: ($padding-base-vertical + 1);
// Remove default margin from `p`
margin-bottom: 0;
&.input-lg,
&.input-sm {
padding-right: 0;
padding-left: 0;
}
}
// Form control sizing
//
// Build on `.form-control` with modifier classes to decrease or increase the
// height and font-size of form controls.
//
// The `.form-group-* form-control` variations are sadly duplicated to avoid the
// issue documented in https://github.com/twbs/bootstrap/issues/15074.
.form-control-sm {
height: $input-height-sm;
padding: $padding-sm-vertical $padding-sm-horizontal;
font-size: $font-size-sm;
line-height: $line-height-sm;
border-radius: $input-border-radius-sm;
}
.form-control-lg {
height: $input-height-lg;
padding: $padding-lg-vertical $padding-lg-horizontal;
font-size: $font-size-lg;
line-height: $line-height-lg;
border-radius: $input-border-radius-lg;
}
// @include input-size('.input-sm', $input-height-sm, $padding-sm-vertical, $padding-sm-horizontal, $font-size-sm, $line-height-sm, $input-border-radius-sm);
// .form-group-sm {
// @include input-size('.form-control', $input-height-sm, $padding-sm-vertical, $padding-sm-horizontal, $font-size-sm, $line-height-sm, $input-border-radius-sm);
// .form-control-static {
// height: $input-height-sm;
// min-height: ($line-height-computed + $font-size-sm);
// padding: $padding-sm-vertical $padding-sm-horizontal;
// font-size: $font-size-sm;
// line-height: $line-height-sm;
// }
// }
// @include input-size('.input-lg', $input-height-lg, $padding-lg-vertical, $padding-lg-horizontal, $font-size-lg, $line-height-lg, $input-border-radius-lg);
// .form-group-lg {
// @include input-size('.form-control', $input-height-lg, $padding-lg-vertical, $padding-lg-horizontal, $font-size-lg, $line-height-lg, $input-border-radius-lg);
// .form-control-static {
// height: $input-height-lg;
// min-height: ($line-height-computed + $font-size-lg);
// padding: $padding-lg-vertical $padding-lg-horizontal;
// font-size: $font-size-lg;
// line-height: $line-height-lg;
// }
// }
// Form control feedback states
//
// Apply contextual and semantic states to individual form controls.

2
scss/mixins/_forms.scss
View File

@@ -55,7 +55,7 @@
@mixin form-control-focus() {
&:focus {
border-color: $input-border-focus;
outline: 0;
outline: none;
$shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px $input-box-shadow-focus;
@include box-shadow($shadow);
}