bootstrap-generators 3.0.2.2 → 3.1.0

Sign up to get free protection for your applications and to get access to all the features.
Files changed (98) hide show
  1. checksums.yaml +4 -4
  2. data/README.md +2 -2
  3. data/Rakefile +7 -6
  4. data/bootstrap-generators.gemspec +1 -1
  5. data/lib/bootstrap/generators/version.rb +1 -1
  6. data/lib/generators/bootstrap/install/templates/assets/stylesheets/bootstrap-variables.less +354 -164
  7. data/lib/generators/bootstrap/install/templates/assets/stylesheets/bootstrap-variables.scss +359 -165
  8. data/lib/generators/bootstrap/install/templates/form_builders/form_builder/_form.html.erb +3 -3
  9. data/lib/generators/bootstrap/install/templates/form_builders/form_builder/_form.html.haml +3 -3
  10. data/lib/generators/bootstrap/install/templates/form_builders/form_builder/_form.html.slim +3 -3
  11. data/lib/generators/bootstrap/install/templates/layouts/starter.html.erb +1 -0
  12. data/lib/generators/bootstrap/install/templates/layouts/starter.html.haml +1 -0
  13. data/lib/generators/bootstrap/install/templates/layouts/starter.html.slim +2 -0
  14. data/readme-template.md.erb +14 -0
  15. data/vendor/assets/fonts/{glyphicons-halflings-regular.eot → bootstrap/glyphicons-halflings-regular.eot} +0 -0
  16. data/vendor/assets/fonts/{glyphicons-halflings-regular.svg → bootstrap/glyphicons-halflings-regular.svg} +0 -0
  17. data/vendor/assets/fonts/{glyphicons-halflings-regular.ttf → bootstrap/glyphicons-halflings-regular.ttf} +0 -0
  18. data/vendor/assets/fonts/{glyphicons-halflings-regular.woff → bootstrap/glyphicons-halflings-regular.woff} +0 -0
  19. data/vendor/assets/javascripts/bootstrap/affix.js +34 -23
  20. data/vendor/assets/javascripts/bootstrap/alert.js +5 -15
  21. data/vendor/assets/javascripts/bootstrap/button.js +24 -26
  22. data/vendor/assets/javascripts/bootstrap/carousel.js +20 -32
  23. data/vendor/assets/javascripts/bootstrap/collapse.js +7 -16
  24. data/vendor/assets/javascripts/bootstrap/dropdown.js +23 -30
  25. data/vendor/assets/javascripts/bootstrap/modal.js +25 -28
  26. data/vendor/assets/javascripts/bootstrap/popover.js +14 -21
  27. data/vendor/assets/javascripts/bootstrap/scrollspy.js +17 -22
  28. data/vendor/assets/javascripts/bootstrap/tab.js +7 -17
  29. data/vendor/assets/javascripts/bootstrap/tooltip.js +52 -39
  30. data/vendor/assets/javascripts/bootstrap/transition.js +11 -19
  31. data/vendor/assets/stylesheets/bootstrap.css +1209 -2476
  32. data/vendor/twitter/bootstrap/less/badges.less +10 -6
  33. data/vendor/twitter/bootstrap/less/breadcrumbs.less +4 -1
  34. data/vendor/twitter/bootstrap/less/button-groups.less +17 -44
  35. data/vendor/twitter/bootstrap/less/buttons.less +10 -13
  36. data/vendor/twitter/bootstrap/less/carousel.less +1 -0
  37. data/vendor/twitter/bootstrap/less/code.less +10 -0
  38. data/vendor/twitter/bootstrap/less/dropdowns.less +31 -10
  39. data/vendor/twitter/bootstrap/less/forms.less +89 -34
  40. data/vendor/twitter/bootstrap/less/glyphicons.less +5 -9
  41. data/vendor/twitter/bootstrap/less/grid.less +36 -29
  42. data/vendor/twitter/bootstrap/less/input-groups.less +40 -19
  43. data/vendor/twitter/bootstrap/less/jumbotron.less +11 -7
  44. data/vendor/twitter/bootstrap/less/labels.less +6 -0
  45. data/vendor/twitter/bootstrap/less/list-group.less +25 -3
  46. data/vendor/twitter/bootstrap/less/mixins.less +140 -72
  47. data/vendor/twitter/bootstrap/less/modals.less +18 -12
  48. data/vendor/twitter/bootstrap/less/navbar.less +65 -73
  49. data/vendor/twitter/bootstrap/less/navs.less +2 -22
  50. data/vendor/twitter/bootstrap/less/normalize.less +139 -122
  51. data/vendor/twitter/bootstrap/less/pager.less +5 -5
  52. data/vendor/twitter/bootstrap/less/pagination.less +6 -3
  53. data/vendor/twitter/bootstrap/less/panels.less +73 -15
  54. data/vendor/twitter/bootstrap/less/print.less +0 -4
  55. data/vendor/twitter/bootstrap/less/progress-bars.less +0 -12
  56. data/vendor/twitter/bootstrap/less/responsive-utilities.less +13 -129
  57. data/vendor/twitter/bootstrap/less/scaffolding.less +17 -2
  58. data/vendor/twitter/bootstrap/less/tables.less +19 -22
  59. data/vendor/twitter/bootstrap/less/theme.less +1 -1
  60. data/vendor/twitter/bootstrap/less/thumbnails.less +9 -3
  61. data/vendor/twitter/bootstrap/less/tooltip.less +1 -1
  62. data/vendor/twitter/bootstrap/less/type.less +123 -106
  63. data/vendor/twitter/bootstrap/less/variables.less +354 -164
  64. data/vendor/twitter/bootstrap/less/wells.less +1 -1
  65. data/vendor/twitter/bootstrap/sass/_badges.scss +10 -6
  66. data/vendor/twitter/bootstrap/sass/_breadcrumbs.scss +4 -1
  67. data/vendor/twitter/bootstrap/sass/_button-groups.scss +15 -42
  68. data/vendor/twitter/bootstrap/sass/_buttons.scss +10 -13
  69. data/vendor/twitter/bootstrap/sass/_carousel.scss +1 -0
  70. data/vendor/twitter/bootstrap/sass/_code.scss +10 -0
  71. data/vendor/twitter/bootstrap/sass/_dropdowns.scss +31 -11
  72. data/vendor/twitter/bootstrap/sass/_forms.scss +88 -34
  73. data/vendor/twitter/bootstrap/sass/_glyphicons.scss +5 -9
  74. data/vendor/twitter/bootstrap/sass/_grid.scss +36 -29
  75. data/vendor/twitter/bootstrap/sass/_input-groups.scss +40 -19
  76. data/vendor/twitter/bootstrap/sass/_jumbotron.scss +11 -7
  77. data/vendor/twitter/bootstrap/sass/_labels.scss +6 -0
  78. data/vendor/twitter/bootstrap/sass/_list-group.scss +25 -3
  79. data/vendor/twitter/bootstrap/sass/_mixins.scss +135 -65
  80. data/vendor/twitter/bootstrap/sass/_modals.scss +17 -11
  81. data/vendor/twitter/bootstrap/sass/_navbar.scss +62 -70
  82. data/vendor/twitter/bootstrap/sass/_navs.scss +1 -21
  83. data/vendor/twitter/bootstrap/sass/_normalize.scss +139 -122
  84. data/vendor/twitter/bootstrap/sass/_pager.scss +4 -4
  85. data/vendor/twitter/bootstrap/sass/_pagination.scss +6 -3
  86. data/vendor/twitter/bootstrap/sass/_panels.scss +72 -14
  87. data/vendor/twitter/bootstrap/sass/_print.scss +0 -4
  88. data/vendor/twitter/bootstrap/sass/_progress-bars.scss +0 -12
  89. data/vendor/twitter/bootstrap/sass/_responsive-utilities.scss +6 -124
  90. data/vendor/twitter/bootstrap/sass/_scaffolding.scss +17 -2
  91. data/vendor/twitter/bootstrap/sass/_tables.scss +7 -18
  92. data/vendor/twitter/bootstrap/sass/_theme.scss +1 -1
  93. data/vendor/twitter/bootstrap/sass/_thumbnails.scss +13 -7
  94. data/vendor/twitter/bootstrap/sass/_tooltip.scss +1 -1
  95. data/vendor/twitter/bootstrap/sass/_type.scss +122 -105
  96. data/vendor/twitter/bootstrap/sass/_variables.scss +359 -165
  97. data/vendor/twitter/bootstrap/sass/_wells.scss +1 -1
  98. metadata +7 -7
@@ -22,6 +22,16 @@
22
22
  &:empty {
23
23
  display: none;
24
24
  }
25
+
26
+ // Quick fix for badges in buttons
27
+ .btn & {
28
+ position: relative;
29
+ top: -1px;
30
+ }
31
+ .btn-xs & {
32
+ top: 0;
33
+ padding: 1px 5px;
34
+ }
25
35
  }
26
36
 
27
37
  // Hover state, but only for links
@@ -34,12 +44,6 @@ a.badge {
34
44
  }
35
45
  }
36
46
 
37
- // Quick fix for labels/badges in buttons
38
- .btn .badge {
39
- position: relative;
40
- top: -1px;
41
- }
42
-
43
47
  // Account for counters in navs
44
48
  a.list-group-item.active > .badge,
45
49
  .nav-pills > .active > a > .badge {
@@ -4,19 +4,22 @@
4
4
 
5
5
 
6
6
  .breadcrumb {
7
- padding: 8px 15px;
7
+ padding: @breadcrumb-padding-vertical @breadcrumb-padding-horizontal;
8
8
  margin-bottom: @line-height-computed;
9
9
  list-style: none;
10
10
  background-color: @breadcrumb-bg;
11
11
  border-radius: @border-radius-base;
12
+
12
13
  > li {
13
14
  display: inline-block;
15
+
14
16
  + li:before {
15
17
  content: "@{breadcrumb-separator}\00a0"; // Unicode space added since inline-block means non-collapsing white-space
16
18
  padding: 0 5px;
17
19
  color: @breadcrumb-color;
18
20
  }
19
21
  }
22
+
20
23
  > .active {
21
24
  color: @breadcrumb-active-color;
22
25
  }
@@ -2,37 +2,6 @@
2
2
  // Button groups
3
3
  // --------------------------------------------------
4
4
 
5
- // Button carets
6
- //
7
- // Match the button text color to the arrow/caret for indicating dropdown-ness.
8
-
9
- .caret {
10
- .btn-default & {
11
- border-top-color: @btn-default-color;
12
- }
13
- .btn-primary &,
14
- .btn-success &,
15
- .btn-warning &,
16
- .btn-danger &,
17
- .btn-info & {
18
- border-top-color: #fff;
19
- }
20
- }
21
- .dropup {
22
- .btn-default .caret {
23
- border-bottom-color: @btn-default-color;
24
- }
25
- .btn-primary,
26
- .btn-success,
27
- .btn-warning,
28
- .btn-danger,
29
- .btn-info {
30
- .caret {
31
- border-bottom-color: #fff;
32
- }
33
- }
34
- }
35
-
36
5
  // Make the div behave like a button
37
6
  .btn-group,
38
7
  .btn-group-vertical {
@@ -68,18 +37,17 @@
68
37
 
69
38
  // Optional: Group multiple button groups together for a toolbar
70
39
  .btn-toolbar {
71
- .clearfix();
40
+ margin-left: -5px; // Offset the first child's margin
41
+ &:extend(.clearfix all);
72
42
 
73
- .btn-group {
43
+ .btn-group,
44
+ .input-group {
74
45
  float: left;
75
46
  }
76
- // Space out series of button groups
77
47
  > .btn,
78
- > .btn-group {
79
- + .btn,
80
- + .btn-group {
81
- margin-left: 5px;
82
- }
48
+ > .btn-group,
49
+ > .input-group {
50
+ margin-left: 5px;
83
51
  }
84
52
  }
85
53
 
@@ -178,7 +146,8 @@
178
146
 
179
147
  .btn-group-vertical {
180
148
  > .btn,
181
- > .btn-group {
149
+ > .btn-group,
150
+ > .btn-group > .btn {
182
151
  display: block;
183
152
  float: none;
184
153
  width: 100%;
@@ -187,7 +156,7 @@
187
156
 
188
157
  // Clear floats so dropdown menus can be properly placed
189
158
  > .btn-group {
190
- .clearfix();
159
+ &:extend(.clearfix all);
191
160
  > .btn {
192
161
  float: none;
193
162
  }
@@ -218,13 +187,13 @@
218
187
  .btn-group-vertical > .btn-group:not(:first-child):not(:last-child) > .btn {
219
188
  border-radius: 0;
220
189
  }
221
- .btn-group-vertical > .btn-group:first-child {
190
+ .btn-group-vertical > .btn-group:first-child:not(:last-child) {
222
191
  > .btn:last-child,
223
192
  > .dropdown-toggle {
224
193
  .border-bottom-radius(0);
225
194
  }
226
195
  }
227
- .btn-group-vertical > .btn-group:last-child > .btn:first-child {
196
+ .btn-group-vertical > .btn-group:last-child:not(:first-child) > .btn:first-child {
228
197
  .border-top-radius(0);
229
198
  }
230
199
 
@@ -238,11 +207,15 @@
238
207
  width: 100%;
239
208
  table-layout: fixed;
240
209
  border-collapse: separate;
241
- .btn {
210
+ > .btn,
211
+ > .btn-group {
242
212
  float: none;
243
213
  display: table-cell;
244
214
  width: 1%;
245
215
  }
216
+ > .btn-group .btn {
217
+ width: 100%;
218
+ }
246
219
  }
247
220
 
248
221
 
@@ -6,7 +6,6 @@
6
6
  // Base styles
7
7
  // --------------------------------------------------
8
8
 
9
- // Core styles
10
9
  .btn {
11
10
  display: inline-block;
12
11
  margin-bottom: 0; // For input.btn
@@ -45,7 +44,6 @@
45
44
  .opacity(.65);
46
45
  .box-shadow(none);
47
46
  }
48
-
49
47
  }
50
48
 
51
49
 
@@ -58,14 +56,6 @@
58
56
  .btn-primary {
59
57
  .button-variant(@btn-primary-color; @btn-primary-bg; @btn-primary-border);
60
58
  }
61
- // Warning appears as orange
62
- .btn-warning {
63
- .button-variant(@btn-warning-color; @btn-warning-bg; @btn-warning-border);
64
- }
65
- // Danger and error appear as red
66
- .btn-danger {
67
- .button-variant(@btn-danger-color; @btn-danger-bg; @btn-danger-border);
68
- }
69
59
  // Success appears as green
70
60
  .btn-success {
71
61
  .button-variant(@btn-success-color; @btn-success-bg; @btn-success-border);
@@ -74,6 +64,14 @@
74
64
  .btn-info {
75
65
  .button-variant(@btn-info-color; @btn-info-bg; @btn-info-border);
76
66
  }
67
+ // Warning appears as orange
68
+ .btn-warning {
69
+ .button-variant(@btn-warning-color; @btn-warning-bg; @btn-warning-border);
70
+ }
71
+ // Danger and error appear as red
72
+ .btn-danger {
73
+ .button-variant(@btn-danger-color; @btn-danger-bg; @btn-danger-border);
74
+ }
77
75
 
78
76
 
79
77
  // Link buttons
@@ -123,13 +121,12 @@
123
121
  // line-height: ensure even-numbered height of button next to large input
124
122
  .button-size(@padding-large-vertical; @padding-large-horizontal; @font-size-large; @line-height-large; @border-radius-large);
125
123
  }
126
- .btn-sm,
127
- .btn-xs {
124
+ .btn-sm {
128
125
  // line-height: ensure proper height of button next to small input
129
126
  .button-size(@padding-small-vertical; @padding-small-horizontal; @font-size-small; @line-height-small; @border-radius-small);
130
127
  }
131
128
  .btn-xs {
132
- padding: 1px 5px;
129
+ .button-size(@padding-xs-vertical; @padding-xs-horizontal; @font-size-small; @line-height-small; @border-radius-small);
133
130
  }
134
131
 
135
132
 
@@ -91,6 +91,7 @@
91
91
  // Hover/focus state
92
92
  &:hover,
93
93
  &:focus {
94
+ outline: none;
94
95
  color: @carousel-control-color;
95
96
  text-decoration: none;
96
97
  .opacity(.9);
@@ -21,6 +21,16 @@ code {
21
21
  border-radius: @border-radius-base;
22
22
  }
23
23
 
24
+ // User input typically entered via keyboard
25
+ kbd {
26
+ padding: 2px 4px;
27
+ font-size: 90%;
28
+ color: @kbd-color;
29
+ background-color: @kbd-bg;
30
+ border-radius: @border-radius-small;
31
+ box-shadow: inset 0 -1px 0 rgba(0,0,0,.25);
32
+ }
33
+
24
34
  // Blocks of code
25
35
  pre {
26
36
  display: block;
@@ -10,12 +10,9 @@
10
10
  height: 0;
11
11
  margin-left: 2px;
12
12
  vertical-align: middle;
13
- border-top: @caret-width-base solid @dropdown-caret-color;
13
+ border-top: @caret-width-base solid;
14
14
  border-right: @caret-width-base solid transparent;
15
15
  border-left: @caret-width-base solid transparent;
16
- // Firefox fix for https://github.com/twbs/bootstrap/issues/9538. Once fixed,
17
- // we can just straight up remove this.
18
- border-bottom: 0 dotted;
19
16
  }
20
17
 
21
18
  // The dropdown wrapper (div)
@@ -49,6 +46,8 @@
49
46
  background-clip: padding-box;
50
47
 
51
48
  // Aligns the dropdown menu to right
49
+ //
50
+ // Deprecated as of 3.1.0 in favor of `.dropdown-menu-[dir]`
52
51
  &.pull-right {
53
52
  right: 0;
54
53
  left: auto;
@@ -129,6 +128,25 @@
129
128
  }
130
129
  }
131
130
 
131
+ // Menu positioning
132
+ //
133
+ // Add extra class to `.dropdown-menu` to flip the alignment of the dropdown
134
+ // menu with the parent.
135
+ .dropdown-menu-right {
136
+ left: auto; // Reset the default from `.dropdown-menu`
137
+ right: 0;
138
+ }
139
+ // With v3, we enabled auto-flipping if you have a dropdown within a right
140
+ // aligned nav component. To enable the undoing of that, we provide an override
141
+ // to restore the default dropdown menu alignment.
142
+ //
143
+ // This is only for left-aligning a dropdown menu within a `.navbar-right` or
144
+ // `.pull-right` nav component.
145
+ .dropdown-menu-left {
146
+ left: 0;
147
+ right: auto;
148
+ }
149
+
132
150
  // Dropdown section headers
133
151
  .dropdown-header {
134
152
  display: block;
@@ -145,7 +163,7 @@
145
163
  right: 0;
146
164
  bottom: 0;
147
165
  top: 0;
148
- z-index: @zindex-dropdown - 10;
166
+ z-index: (@zindex-dropdown - 10);
149
167
  }
150
168
 
151
169
  // Right aligned dropdowns
@@ -163,10 +181,8 @@
163
181
  .navbar-fixed-bottom .dropdown {
164
182
  // Reverse the caret
165
183
  .caret {
166
- // Firefox fix for https://github.com/twbs/bootstrap/issues/9538. Once this
167
- // gets fixed, restore `border-top: 0;`.
168
- border-top: 0 dotted;
169
- border-bottom: @caret-width-base solid @dropdown-caret-color;
184
+ border-top: 0;
185
+ border-bottom: @caret-width-base solid;
170
186
  content: "";
171
187
  }
172
188
  // Different positioning for bottom up menu
@@ -185,7 +201,12 @@
185
201
  @media (min-width: @grid-float-breakpoint) {
186
202
  .navbar-right {
187
203
  .dropdown-menu {
188
- .pull-right > .dropdown-menu();
204
+ .dropdown-menu-right();
205
+ }
206
+ // Necessary for overrides of the default right aligned menu.
207
+ // Will remove come v4 in all likelihood.
208
+ .dropdown-menu-left {
209
+ .dropdown-menu-left();
189
210
  }
190
211
  }
191
212
  }
@@ -11,6 +11,10 @@ fieldset {
11
11
  padding: 0;
12
12
  margin: 0;
13
13
  border: 0;
14
+ // Chrome and Firefox set a `min-width: -webkit-min-content;` on fieldsets,
15
+ // so we reset that to ensure it behaves more like a standard block element.
16
+ // See https://github.com/twbs/bootstrap/issues/12359.
17
+ min-width: 0;
14
18
  }
15
19
 
16
20
  legend {
@@ -33,6 +37,10 @@ label {
33
37
 
34
38
 
35
39
  // Normalize form controls
40
+ //
41
+ // While most of our form styles require extra classes, some basic normalization
42
+ // is required to ensure optimum display with or without those classes to better
43
+ // address browser inconsistencies.
36
44
 
37
45
  // Override content-box in Normalize (* isn't specific enough)
38
46
  input[type="search"] {
@@ -47,41 +55,30 @@ input[type="checkbox"] {
47
55
  line-height: normal;
48
56
  }
49
57
 
50
- // Set the height of select and file controls to match text inputs
58
+ // Set the height of file controls to match text inputs
51
59
  input[type="file"] {
52
60
  display: block;
53
61
  }
54
62
 
63
+ // Make range inputs behave like textual form controls
64
+ input[type="range"] {
65
+ display: block;
66
+ width: 100%;
67
+ }
68
+
55
69
  // Make multiple select elements height not fixed
56
70
  select[multiple],
57
71
  select[size] {
58
72
  height: auto;
59
73
  }
60
74
 
61
- // Fix optgroup Firefox bug per https://github.com/twbs/bootstrap/issues/7611
62
- select optgroup {
63
- font-size: inherit;
64
- font-style: inherit;
65
- font-family: inherit;
66
- }
67
-
68
- // Focus for select, file, radio, and checkbox
75
+ // Focus for file, radio, and checkbox
69
76
  input[type="file"]:focus,
70
77
  input[type="radio"]:focus,
71
78
  input[type="checkbox"]:focus {
72
79
  .tab-focus();
73
80
  }
74
81
 
75
- // Fix for Chrome number input
76
- // Setting certain font-sizes causes the `I` bar to appear on hover of the bottom increment button.
77
- // See https://github.com/twbs/bootstrap/issues/8350 for more.
78
- input[type="number"] {
79
- &::-webkit-outer-spin-button,
80
- &::-webkit-inner-spin-button {
81
- height: auto;
82
- }
83
- }
84
-
85
82
  // Adjust output element
86
83
  output {
87
84
  display: block;
@@ -89,7 +86,6 @@ output {
89
86
  font-size: @font-size-base;
90
87
  line-height: @line-height-base;
91
88
  color: @input-color;
92
- vertical-align: middle;
93
89
  }
94
90
 
95
91
 
@@ -123,7 +119,6 @@ output {
123
119
  font-size: @font-size-base;
124
120
  line-height: @line-height-base;
125
121
  color: @input-color;
126
- vertical-align: middle;
127
122
  background-color: @input-bg;
128
123
  background-image: none; // Reset unusual Firefox-on-Android default style; see https://github.com/necolas/normalize.css/issues/214
129
124
  border: 1px solid @input-border;
@@ -135,9 +130,6 @@ output {
135
130
  .form-control-focus();
136
131
 
137
132
  // Placeholder
138
- //
139
- // Placeholder text gets special styles because when browsers invalidate entire
140
- // lines if it doesn't understand a selector/
141
133
  .placeholder();
142
134
 
143
135
  // Disabled and read-only inputs
@@ -149,6 +141,7 @@ output {
149
141
  fieldset[disabled] & {
150
142
  cursor: not-allowed;
151
143
  background-color: @input-bg-disabled;
144
+ opacity: 1; // iOS fix for unreadable disabled content
152
145
  }
153
146
 
154
147
  // Reset height for `textarea`s
@@ -157,6 +150,14 @@ output {
157
150
  }
158
151
  }
159
152
 
153
+ // Special styles for iOS date input
154
+ //
155
+ // In Mobile Safari, date inputs require a pixel line-height that matches the
156
+ // given height of the input.
157
+ input[type="date"] {
158
+ line-height: @input-height-base;
159
+ }
160
+
160
161
 
161
162
  // Form groups
162
163
  //
@@ -179,10 +180,8 @@ output {
179
180
  margin-top: 10px;
180
181
  margin-bottom: 10px;
181
182
  padding-left: 20px;
182
- vertical-align: middle;
183
183
  label {
184
184
  display: inline;
185
- margin-bottom: 0;
186
185
  font-weight: normal;
187
186
  cursor: pointer;
188
187
  }
@@ -230,7 +229,12 @@ input[type="checkbox"],
230
229
  }
231
230
  }
232
231
 
232
+
233
233
  // Form control sizing
234
+ //
235
+ // Build on `.form-control` with modifier classes to decrease or increase the
236
+ // height and font-size of form controls.
237
+
234
238
  .input-sm {
235
239
  .input-size(@input-height-small; @padding-small-vertical; @padding-small-horizontal; @font-size-small; @line-height-small; @border-radius-small);
236
240
  }
@@ -244,18 +248,38 @@ input[type="checkbox"],
244
248
  //
245
249
  // Apply contextual and semantic states to individual form controls.
246
250
 
247
- // Warning
251
+ .has-feedback {
252
+ // Enable absolute positioning
253
+ position: relative;
254
+
255
+ // Ensure icons don't overlap text
256
+ .form-control {
257
+ padding-right: (@input-height-base * 1.25);
258
+ }
259
+
260
+ // Feedback icon (requires .glyphicon classes)
261
+ .form-control-feedback {
262
+ position: absolute;
263
+ top: (@line-height-computed + 5); // Height of the `label` and its margin
264
+ right: 0;
265
+ display: block;
266
+ width: @input-height-base;
267
+ height: @input-height-base;
268
+ line-height: @input-height-base;
269
+ text-align: center;
270
+ }
271
+ }
272
+
273
+ // Feedback states
274
+ .has-success {
275
+ .form-control-validation(@state-success-text; @state-success-text; @state-success-bg);
276
+ }
248
277
  .has-warning {
249
278
  .form-control-validation(@state-warning-text; @state-warning-text; @state-warning-bg);
250
279
  }
251
- // Error
252
280
  .has-error {
253
281
  .form-control-validation(@state-danger-text; @state-danger-text; @state-danger-bg);
254
282
  }
255
- // Success
256
- .has-success {
257
- .form-control-validation(@state-success-text; @state-success-text; @state-success-bg);
258
- }
259
283
 
260
284
 
261
285
  // Static form control text
@@ -296,9 +320,9 @@ input[type="checkbox"],
296
320
  .form-inline {
297
321
 
298
322
  // Kick in the inline
299
- @media (min-width: @screen-sm) {
323
+ @media (min-width: @screen-sm-min) {
300
324
  // Inline-block all the things for "inline"
301
- .form-group {
325
+ .form-group {
302
326
  display: inline-block;
303
327
  margin-bottom: 0;
304
328
  vertical-align: middle;
@@ -307,6 +331,13 @@ input[type="checkbox"],
307
331
  // In navbar-form, allow folks to *not* use `.form-group`
308
332
  .form-control {
309
333
  display: inline-block;
334
+ width: auto; // Prevent labels from stacking above inputs in `.form-group`
335
+ vertical-align: middle;
336
+ }
337
+
338
+ .control-label {
339
+ margin-bottom: 0;
340
+ vertical-align: middle;
310
341
  }
311
342
 
312
343
  // Remove default margin on radios/checkboxes that were used for stacking, and
@@ -318,12 +349,21 @@ input[type="checkbox"],
318
349
  margin-top: 0;
319
350
  margin-bottom: 0;
320
351
  padding-left: 0;
352
+ vertical-align: middle;
321
353
  }
322
354
  .radio input[type="radio"],
323
355
  .checkbox input[type="checkbox"] {
324
356
  float: none;
325
357
  margin-left: 0;
326
358
  }
359
+
360
+ // Validation states
361
+ //
362
+ // Reposition the icon because it's now within a grid column and columns have
363
+ // `position: relative;` on them. Also accounts for the grid gutter padding.
364
+ .has-feedback .form-control-feedback {
365
+ top: 0;
366
+ }
327
367
  }
328
368
  }
329
369
 
@@ -345,6 +385,12 @@ input[type="checkbox"],
345
385
  margin-bottom: 0;
346
386
  padding-top: (@padding-base-vertical + 1); // Default padding plus a border
347
387
  }
388
+ // Account for padding we're adding to ensure the alignment and of help text
389
+ // and other content below items
390
+ .radio,
391
+ .checkbox {
392
+ min-height: (@line-height-computed + (@padding-base-vertical + 1));
393
+ }
348
394
 
349
395
  // Make form groups behave like rows
350
396
  .form-group {
@@ -361,4 +407,13 @@ input[type="checkbox"],
361
407
  text-align: right;
362
408
  }
363
409
  }
410
+
411
+ // Validation states
412
+ //
413
+ // Reposition the icon because it's now within a grid column and columns have
414
+ // `position: relative;` on them. Also accounts for the grid gutter padding.
415
+ .has-feedback .form-control-feedback {
416
+ top: 0;
417
+ right: (@grid-gutter-width / 2);
418
+ }
364
419
  }