bootstrap-generators 2.0.0 → 2.0.1

Sign up to get free protection for your applications and to get access to all the features.
Files changed (88) hide show
  1. data/.rvmrc +1 -0
  2. data/README.md +128 -22
  3. data/Rakefile +59 -0
  4. data/bootstrap-generators.gemspec +1 -1
  5. data/lib/bootstrap/generators/version.rb +1 -1
  6. data/lib/generators/bootstrap/install/install_generator.rb +1 -0
  7. data/lib/generators/bootstrap/install/templates/assets/stylesheets/bootstrap-variables.css.less +98 -0
  8. data/lib/generators/bootstrap/install/templates/assets/stylesheets/bootstrap-variables.css.scss +99 -0
  9. data/lib/generators/bootstrap/install/templates/assets/stylesheets/fluid.css.less +3 -100
  10. data/lib/generators/bootstrap/install/templates/assets/stylesheets/fluid.css.scss +4 -4
  11. data/lib/generators/bootstrap/install/templates/assets/stylesheets/hero.css +1 -0
  12. data/lib/generators/bootstrap/install/templates/assets/stylesheets/hero.css.less +4 -100
  13. data/lib/generators/bootstrap/install/templates/assets/stylesheets/hero.css.scss +5 -4
  14. data/lib/generators/bootstrap/install/templates/config/initializers/simple_form.rb +23 -22
  15. data/lib/generators/bootstrap/install/templates/form_builders/simple_form/_form.html.erb +4 -7
  16. data/lib/generators/bootstrap/install/templates/form_builders/simple_form/_form.html.haml +4 -6
  17. data/lib/generators/bootstrap/install/templates/layouts/fluid.html.erb +3 -2
  18. data/lib/generators/bootstrap/install/templates/layouts/fluid.html.haml +3 -2
  19. data/lib/generators/bootstrap/install/templates/layouts/hero.html.erb +15 -7
  20. data/lib/generators/bootstrap/install/templates/layouts/hero.html.haml +16 -10
  21. data/test/lib/generators/bootstrap/install_generator_test.rb +2 -0
  22. data/vendor/assets/javascripts/bootstrap-alert.js +8 -5
  23. data/vendor/assets/javascripts/bootstrap-button.js +5 -3
  24. data/vendor/assets/javascripts/bootstrap-carousel.js +5 -2
  25. data/vendor/assets/javascripts/bootstrap-collapse.js +2 -2
  26. data/vendor/assets/javascripts/bootstrap-dropdown.js +2 -2
  27. data/vendor/assets/javascripts/bootstrap-modal.js +6 -5
  28. data/vendor/assets/javascripts/bootstrap-popover.js +2 -2
  29. data/vendor/assets/javascripts/bootstrap-scrollspy.js +2 -2
  30. data/vendor/assets/javascripts/bootstrap-tab.js +2 -2
  31. data/vendor/assets/javascripts/bootstrap-tooltip.js +2 -2
  32. data/vendor/assets/javascripts/bootstrap-transition.js +3 -3
  33. data/vendor/assets/javascripts/bootstrap-typeahead.js +2 -2
  34. data/vendor/assets/stylesheets/less/bootstrap.less +1 -1
  35. data/vendor/assets/stylesheets/less/breadcrumbs.less +1 -1
  36. data/vendor/assets/stylesheets/less/button-groups.less +2 -1
  37. data/vendor/assets/stylesheets/less/buttons.less +25 -7
  38. data/vendor/assets/stylesheets/less/code.less +13 -0
  39. data/vendor/assets/stylesheets/less/dropdowns.less +1 -2
  40. data/vendor/assets/stylesheets/less/forms.less +48 -41
  41. data/vendor/assets/stylesheets/less/labels.less +23 -7
  42. data/vendor/assets/stylesheets/less/mixins.less +78 -25
  43. data/vendor/assets/stylesheets/less/modals.less +11 -0
  44. data/vendor/assets/stylesheets/less/navbar.less +11 -4
  45. data/vendor/assets/stylesheets/less/navs.less +20 -11
  46. data/vendor/assets/stylesheets/less/reset.less +1 -1
  47. data/vendor/assets/stylesheets/less/responsive.less +9 -5
  48. data/vendor/assets/stylesheets/less/sprites.less +7 -5
  49. data/vendor/assets/stylesheets/less/tables.less +14 -3
  50. data/vendor/assets/stylesheets/less/thumbnails.less +2 -2
  51. data/vendor/assets/stylesheets/less/type.less +3 -2
  52. data/vendor/assets/stylesheets/less/variables.less +15 -7
  53. data/vendor/assets/stylesheets/scss/accordion.scss +28 -0
  54. data/vendor/assets/stylesheets/scss/alerts.scss +70 -0
  55. data/vendor/assets/stylesheets/scss/bootstrap.scss +62 -0
  56. data/vendor/assets/stylesheets/scss/breadcrumbs.scss +22 -0
  57. data/vendor/assets/stylesheets/scss/button-groups.scss +148 -0
  58. data/vendor/assets/stylesheets/scss/buttons.scss +183 -0
  59. data/vendor/assets/stylesheets/scss/carousel.scss +121 -0
  60. data/vendor/assets/stylesheets/scss/close.scss +18 -0
  61. data/vendor/assets/stylesheets/scss/code.scss +57 -0
  62. data/vendor/assets/stylesheets/scss/component-animations.scss +18 -0
  63. data/vendor/assets/stylesheets/scss/dropdowns.scss +130 -0
  64. data/vendor/assets/stylesheets/scss/forms.scss +522 -0
  65. data/vendor/assets/stylesheets/scss/grid.scss +8 -0
  66. data/vendor/assets/stylesheets/scss/hero-unit.scss +20 -0
  67. data/vendor/assets/stylesheets/scss/labels.scss +32 -0
  68. data/vendor/assets/stylesheets/scss/layouts.scss +17 -0
  69. data/vendor/assets/stylesheets/scss/mixins.scss +579 -0
  70. data/vendor/assets/stylesheets/scss/modals.scss +83 -0
  71. data/vendor/assets/stylesheets/scss/navbar.scss +299 -0
  72. data/vendor/assets/stylesheets/scss/navs.scss +353 -0
  73. data/vendor/assets/stylesheets/scss/pager.scss +30 -0
  74. data/vendor/assets/stylesheets/scss/pagination.scss +55 -0
  75. data/vendor/assets/stylesheets/scss/popovers.scss +49 -0
  76. data/vendor/assets/stylesheets/scss/progress-bars.scss +95 -0
  77. data/vendor/assets/stylesheets/scss/reset.scss +126 -0
  78. data/vendor/assets/stylesheets/scss/responsive.scss +327 -0
  79. data/vendor/assets/stylesheets/scss/scaffolding.scss +29 -0
  80. data/vendor/assets/stylesheets/scss/sprites.scss +158 -0
  81. data/vendor/assets/stylesheets/scss/tables.scss +150 -0
  82. data/vendor/assets/stylesheets/scss/thumbnails.scss +35 -0
  83. data/vendor/assets/stylesheets/scss/tooltip.scss +35 -0
  84. data/vendor/assets/stylesheets/scss/type.scss +218 -0
  85. data/vendor/assets/stylesheets/scss/utilities.scss +23 -0
  86. data/vendor/assets/stylesheets/scss/variables.scss +107 -0
  87. data/vendor/assets/stylesheets/scss/wells.scss +17 -0
  88. metadata +49 -11
@@ -0,0 +1,18 @@
1
+ // CLOSE ICONS
2
+ // -----------
3
+
4
+ .close {
5
+ float: right;
6
+ font-size: 20px;
7
+ font-weight: bold;
8
+ line-height: $baseLineHeight;
9
+ color: $black;
10
+ text-shadow: 0 1px 0 rgba(255,255,255,1);
11
+ @include opacity(20);
12
+ &:hover {
13
+ color: $black;
14
+ text-decoration: none;
15
+ @include opacity(40);
16
+ cursor: pointer;
17
+ }
18
+ }
@@ -0,0 +1,57 @@
1
+ // Code
2
+ // Code typography styles for the <code> and <pre> elements
3
+ // --------------------------------------------------------
4
+
5
+ // Inline and block code styles
6
+ code,
7
+ pre {
8
+ padding: 0 3px 2px;
9
+ @include font-family-monospace;
10
+ font-size: $baseFontSize - 1;
11
+ color: $grayDark;
12
+ @include border-radius(3px);
13
+ }
14
+
15
+ // Inline code
16
+ code {
17
+ padding: 3px 4px;
18
+ color: #d14;
19
+ background-color: #f7f7f9;
20
+ border: 1px solid #e1e1e8;
21
+ }
22
+
23
+ // Blocks of code
24
+ pre {
25
+ display: block;
26
+ padding: ($baseLineHeight - 1) / 2;
27
+ margin: 0 0 $baseLineHeight / 2;
28
+ font-size: 12px;
29
+ line-height: $baseLineHeight;
30
+ background-color: #f5f5f5;
31
+ border: 1px solid #ccc; // fallback for IE7-8
32
+ border: 1px solid rgba(0,0,0,.15);
33
+ @include border-radius(4px);
34
+ white-space: pre;
35
+ white-space: pre-wrap;
36
+ word-break: break-all;
37
+ word-wrap: break-word;
38
+
39
+ // Make prettyprint styles more spaced out for readability
40
+ &.prettyprint {
41
+ margin-bottom: $baseLineHeight;
42
+ }
43
+
44
+ // Account for some code outputs that place code tags in pre tags
45
+ code {
46
+ padding: 0;
47
+ color: inherit;
48
+ background-color: transparent;
49
+ border: 0;
50
+ }
51
+ }
52
+
53
+ // Enable scrollable blocks of code
54
+ .pre-scrollable {
55
+ max-height: 340px;
56
+ overflow-y: scroll;
57
+ }
@@ -0,0 +1,18 @@
1
+ // COMPONENT ANIMATIONS
2
+ // --------------------
3
+
4
+ .fade {
5
+ @include transition(opacity .15s linear);
6
+ opacity: 0;
7
+ &.in {
8
+ opacity: 1;
9
+ }
10
+ }
11
+
12
+ .collapse {
13
+ @include transition(height .35s ease);
14
+ position:relative;
15
+ overflow:hidden;
16
+ height: 0;
17
+ &.in { height: auto; }
18
+ }
@@ -0,0 +1,130 @@
1
+ // DROPDOWN MENUS
2
+ // --------------
3
+
4
+ // Use the .menu class on any <li> element within the topbar or ul.tabs and you'll get some superfancy dropdowns
5
+ .dropdown {
6
+ position: relative;
7
+ }
8
+ .dropdown-toggle {
9
+ // The caret makes the toggle a bit too tall in IE7
10
+ *margin-bottom: -3px;
11
+ }
12
+ .dropdown-toggle:active,
13
+ .open .dropdown-toggle {
14
+ outline: 0;
15
+ }
16
+ // Dropdown arrow/caret
17
+ .caret {
18
+ display: inline-block;
19
+ width: 0;
20
+ height: 0;
21
+ text-indent: -99999px;
22
+ // IE7 won't do the border trick if there's a text indent, but it doesn't
23
+ // do the content that text-indent is hiding, either, so we're ok.
24
+ *text-indent: 0;
25
+ vertical-align: top;
26
+ border-left: 4px solid transparent;
27
+ border-right: 4px solid transparent;
28
+ border-top: 4px solid $black;
29
+ @include opacity(30);
30
+ content: "\2193";
31
+ }
32
+ .dropdown .caret {
33
+ margin-top: 8px;
34
+ margin-left: 2px;
35
+ }
36
+ .dropdown:hover .caret,
37
+ .open.dropdown .caret {
38
+ @include opacity(100);
39
+ }
40
+ // The dropdown menu (ul)
41
+ .dropdown-menu {
42
+ position: absolute;
43
+ top: 100%;
44
+ left: 0;
45
+ z-index: $zindexDropdown;
46
+ float: left;
47
+ display: none; // none by default, but block on "open" of the menu
48
+ min-width: 160px;
49
+ _width: 160px;
50
+ padding: 4px 0;
51
+ margin: 0; // override default ul
52
+ list-style: none;
53
+ background-color: $white;
54
+ border-color: #ccc;
55
+ border-color: rgba(0,0,0,.2);
56
+ border-style: solid;
57
+ border-width: 1px;
58
+ @include border-radius(0 0 5px 5px);
59
+ @include box-shadow(0 5px 10px rgba(0,0,0,.2));
60
+ -webkit-background-clip: padding-box;
61
+ -moz-background-clip: padding;
62
+ background-clip: padding-box;
63
+ *border-right-width: 2px;
64
+ *border-bottom-width: 2px;
65
+
66
+ // Allow for dropdowns to go bottom up (aka, dropup-menu)
67
+ &.bottom-up {
68
+ top: auto;
69
+ bottom: 100%;
70
+ margin-bottom: 2px;
71
+ }
72
+
73
+ // Dividers (basically an hr) within the dropdown
74
+ .divider {
75
+ height: 1px;
76
+ margin: 5px 1px;
77
+ overflow: hidden;
78
+ background-color: #e5e5e5;
79
+ border-bottom: 1px solid $white;
80
+
81
+ // IE7 needs a set width since we gave a height. Restricting just
82
+ // to IE7 to keep the 1px left/right space in other browsers.
83
+ // It is unclear where IE is getting the extra space that we need
84
+ // to negative-margin away, but so it goes.
85
+ *width: 100%;
86
+ *margin: -5px 0 5px;
87
+ }
88
+
89
+ // Links within the dropdown menu
90
+ a {
91
+ display: block;
92
+ padding: 3px 15px;
93
+ clear: both;
94
+ font-weight: normal;
95
+ line-height: $baseLineHeight;
96
+ color: $gray;
97
+ white-space: nowrap;
98
+ }
99
+ }
100
+
101
+ // Hover state
102
+ .dropdown-menu li > a:hover,
103
+ .dropdown-menu .active > a,
104
+ .dropdown-menu .active > a:hover {
105
+ color: $white;
106
+ text-decoration: none;
107
+ background-color: $linkColor;
108
+ }
109
+
110
+ // Open state for the dropdown
111
+ .dropdown.open {
112
+ // IE7's z-index only goes to the nearest positioned ancestor, which would
113
+ // make the menu appear below buttons that appeared later on the page
114
+ *z-index: $zindexDropdown;
115
+
116
+ .dropdown-toggle {
117
+ color: $white;
118
+ background: #ccc;
119
+ background: rgba(0,0,0,.3);
120
+ }
121
+ .dropdown-menu {
122
+ display: block;
123
+ }
124
+ }
125
+
126
+ // Typeahead
127
+ .typeahead {
128
+ margin-top: 2px; // give it some space to breathe
129
+ @include border-radius(4px);
130
+ }
@@ -0,0 +1,522 @@
1
+ // Forms
2
+ // Base styles for various input types, form layouts, and states
3
+ // -------------------------------------------------------------
4
+
5
+
6
+ // GENERAL STYLES
7
+ // --------------
8
+
9
+ // Make all forms have space below them
10
+ form {
11
+ margin: 0 0 $baseLineHeight;
12
+ }
13
+
14
+ fieldset {
15
+ padding: 0;
16
+ margin: 0;
17
+ border: 0;
18
+ }
19
+
20
+ // Groups of fields with labels on top (legends)
21
+ legend {
22
+ display: block;
23
+ width: 100%;
24
+ padding: 0;
25
+ margin-bottom: $baseLineHeight * 1.5;
26
+ font-size: $baseFontSize * 1.5;
27
+ line-height: $baseLineHeight * 2;
28
+ color: $grayDark;
29
+ border: 0;
30
+ border-bottom: 1px solid #eee;
31
+
32
+ // Small
33
+ small {
34
+ font-size: $baseLineHeight * .75;
35
+ color: $grayLight;
36
+ }
37
+ }
38
+
39
+ // Set font for forms
40
+ label,
41
+ input,
42
+ button,
43
+ select,
44
+ textarea {
45
+ @include font-shorthand($baseFontSize,normal,$baseLineHeight); // Set size, weight, line-height here
46
+ }
47
+ input,
48
+ button,
49
+ select,
50
+ textarea {
51
+ @include font-family-sans-serif(); // And only set font-family here for those that need it (note the missing label element)
52
+ }
53
+
54
+ // Identify controls by their labels
55
+ label {
56
+ display: block;
57
+ margin-bottom: 5px;
58
+ color: $grayDark;
59
+ }
60
+
61
+ // Inputs, Textareas, Selects
62
+ input,
63
+ textarea,
64
+ select,
65
+ .uneditable-input {
66
+ display: inline-block;
67
+ width: 210px;
68
+ height: $baseLineHeight;
69
+ padding: 4px;
70
+ margin-bottom: 9px;
71
+ font-size: $baseFontSize;
72
+ line-height: $baseLineHeight;
73
+ color: $gray;
74
+ border: 1px solid #ccc;
75
+ @include border-radius(3px);
76
+ }
77
+ .uneditable-textarea {
78
+ width: auto;
79
+ height: auto;
80
+ }
81
+
82
+ // Inputs within a label
83
+ label input,
84
+ label textarea,
85
+ label select {
86
+ display: block;
87
+ }
88
+
89
+ // Mini reset for unique input types
90
+ input[type="image"],
91
+ input[type="checkbox"],
92
+ input[type="radio"] {
93
+ width: auto;
94
+ height: auto;
95
+ padding: 0;
96
+ margin: 3px 0;
97
+ *margin-top: 0; /* IE7 */
98
+ line-height: normal;
99
+ cursor: pointer;
100
+ @include border-radius(0);
101
+ border: 0 \9; /* IE9 and down */
102
+ }
103
+ input[type="image"] {
104
+ border: 0;
105
+ }
106
+
107
+ // Reset the file input to browser defaults
108
+ input[type="file"] {
109
+ width: auto;
110
+ padding: initial;
111
+ line-height: initial;
112
+ border: initial;
113
+ background-color: $white;
114
+ background-color: initial;
115
+ @include box-shadow(none);
116
+ }
117
+
118
+ // Help out input buttons
119
+ input[type="button"],
120
+ input[type="reset"],
121
+ input[type="submit"] {
122
+ width: auto;
123
+ height: auto;
124
+ }
125
+
126
+ // Set the height of select and file controls to match text inputs
127
+ select,
128
+ input[type="file"] {
129
+ height: 28px; /* In IE7, the height of the select element cannot be changed by height, only font-size */
130
+ *margin-top: 4px; /* For IE7, add top margin to align select with labels */
131
+ line-height: 28px;
132
+ }
133
+
134
+ // Reset line-height for IE
135
+ input[type="file"] {
136
+ line-height: 18px \9;
137
+ }
138
+
139
+ // Chrome on Linux and Mobile Safari need background-color
140
+ select {
141
+ width: 220px; // default input width + 10px of padding that doesn't get applied
142
+ background-color: $white;
143
+ }
144
+
145
+ // Make multiple select elements height not fixed
146
+ select[multiple],
147
+ select[size] {
148
+ height: auto;
149
+ }
150
+
151
+ // Remove shadow from image inputs
152
+ input[type="image"] {
153
+ @include box-shadow(none);
154
+ }
155
+
156
+ // Make textarea height behave
157
+ textarea {
158
+ height: auto;
159
+ }
160
+
161
+ // Hidden inputs
162
+ input[type="hidden"] {
163
+ display: none;
164
+ }
165
+
166
+
167
+
168
+ // CHECKBOXES & RADIOS
169
+ // -------------------
170
+
171
+ // Indent the labels to position radios/checkboxes as hanging
172
+ .radio,
173
+ .checkbox {
174
+ padding-left: 18px;
175
+ }
176
+ .radio input[type="radio"],
177
+ .checkbox input[type="checkbox"] {
178
+ float: left;
179
+ margin-left: -18px;
180
+ }
181
+
182
+ // Move the options list down to align with labels
183
+ .controls > .radio:first-child,
184
+ .controls > .checkbox:first-child {
185
+ padding-top: 5px; // has to be padding because margin collaspes
186
+ }
187
+
188
+ // Radios and checkboxes on same line
189
+ // TODO v3: Convert .inline to .control-inline
190
+ .radio.inline,
191
+ .checkbox.inline {
192
+ display: inline-block;
193
+ padding-top: 5px;
194
+ margin-bottom: 0;
195
+ vertical-align: middle;
196
+ }
197
+ .radio.inline + .radio.inline,
198
+ .checkbox.inline + .checkbox.inline {
199
+ margin-left: 10px; // space out consecutive inline controls
200
+ }
201
+
202
+
203
+
204
+ // FOCUS STATE
205
+ // -----------
206
+
207
+ input,
208
+ textarea {
209
+ @include box-shadow(inset 0 1px 1px rgba(0,0,0,.075));
210
+ $transition: border linear .2s, box-shadow linear .2s;
211
+ @include transition($transition);
212
+ }
213
+ input:focus,
214
+ textarea:focus {
215
+ border-color: rgba(82,168,236,.8);
216
+ $shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(82,168,236,.6);
217
+ @include box-shadow($shadow);
218
+ outline: 0;
219
+ outline: thin dotted \9; /* IE6-9 */
220
+ }
221
+ input[type="file"]:focus,
222
+ input[type="radio"]:focus,
223
+ input[type="checkbox"]:focus,
224
+ select:focus {
225
+ @include box-shadow(none); // override for file inputs
226
+ @include tab-focus();
227
+ }
228
+
229
+
230
+
231
+ // INPUT SIZES
232
+ // -----------
233
+
234
+ // General classes for quick sizes
235
+ .input-mini { width: 60px; }
236
+ .input-small { width: 90px; }
237
+ .input-medium { width: 150px; }
238
+ .input-large { width: 210px; }
239
+ .input-xlarge { width: 270px; }
240
+ .input-xxlarge { width: 530px; }
241
+
242
+ // Grid style input sizes
243
+ input[class*="span"],
244
+ select[class*="span"],
245
+ textarea[class*="span"],
246
+ .uneditable-input {
247
+ float: none;
248
+ margin-left: 0;
249
+ }
250
+
251
+
252
+
253
+ // GRID SIZING FOR INPUTS
254
+ // ----------------------
255
+
256
+ @include inputGridSystem-generate($gridColumns, $gridColumnWidth, $gridGutterWidth);
257
+
258
+
259
+
260
+
261
+ // DISABLED STATE
262
+ // --------------
263
+
264
+ // Disabled and read-only inputs
265
+ input[disabled],
266
+ select[disabled],
267
+ textarea[disabled],
268
+ input[readonly],
269
+ select[readonly],
270
+ textarea[readonly] {
271
+ background-color: #f5f5f5;
272
+ border-color: #ddd;
273
+ cursor: not-allowed;
274
+ }
275
+
276
+
277
+
278
+
279
+ // FORM FIELD FEEDBACK STATES
280
+ // --------------------------
281
+
282
+ // Warning
283
+ .control-group.warning {
284
+ @include formFieldState($warningText, $warningText, $warningBackground);
285
+ }
286
+ // Error
287
+ .control-group.error {
288
+ @include formFieldState($errorText, $errorText, $errorBackground);
289
+ }
290
+ // Success
291
+ .control-group.success {
292
+ @include formFieldState($successText, $successText, $successBackground);
293
+ }
294
+
295
+ // HTML5 invalid states
296
+ // Shares styles with the .control-group.error above
297
+ input:focus:required:invalid,
298
+ textarea:focus:required:invalid,
299
+ select:focus:required:invalid {
300
+ color: #b94a48;
301
+ border-color: #ee5f5b;
302
+ &:focus {
303
+ border-color: darken(#ee5f5b, 10%);
304
+ @include box-shadow(0 0 6px lighten(#ee5f5b, 20%));
305
+ }
306
+ }
307
+
308
+
309
+
310
+ // FORM ACTIONS
311
+ // ------------
312
+
313
+ .form-actions {
314
+ padding: ($baseLineHeight - 1) 20px $baseLineHeight;
315
+ margin-top: $baseLineHeight;
316
+ margin-bottom: $baseLineHeight;
317
+ background-color: #f5f5f5;
318
+ border-top: 1px solid #ddd;
319
+ }
320
+
321
+ // For text that needs to appear as an input but should not be an input
322
+ .uneditable-input {
323
+ display: block;
324
+ background-color: $white;
325
+ border-color: #eee;
326
+ @include box-shadow(inset 0 1px 2px rgba(0,0,0,.025));
327
+ cursor: not-allowed;
328
+ }
329
+
330
+ // Placeholder text gets special styles; can't be bundled together though for some reason
331
+ @include placeholder($grayLight);
332
+
333
+
334
+
335
+ // HELP TEXT
336
+ // ---------
337
+
338
+ .help-block {
339
+ display: block; // account for any element using help-block
340
+ margin-top: 5px;
341
+ margin-bottom: 0;
342
+ color: $grayLight;
343
+ }
344
+
345
+ .help-inline {
346
+ display: inline-block;
347
+ @include ie7-inline-block();
348
+ margin-bottom: 9px;
349
+ vertical-align: middle;
350
+ padding-left: 5px;
351
+ }
352
+
353
+
354
+
355
+ // INPUT GROUPS
356
+ // ------------
357
+
358
+ // Allow us to put symbols and text within the input field for a cleaner look
359
+ .input-prepend,
360
+ .input-append {
361
+ margin-bottom: 5px;
362
+ @include clearfix(); // Clear the float to prevent wrapping
363
+ input,
364
+ .uneditable-input {
365
+ @include border-radius(0 3px 3px 0);
366
+ &:focus {
367
+ position: relative;
368
+ z-index: 2;
369
+ }
370
+ }
371
+ .uneditable-input {
372
+ border-left-color: #ccc;
373
+ }
374
+ .add-on {
375
+ float: left;
376
+ display: block;
377
+ width: auto;
378
+ min-width: 16px;
379
+ height: $baseLineHeight;
380
+ margin-right: -1px;
381
+ padding: 4px 5px;
382
+ font-weight: normal;
383
+ line-height: $baseLineHeight;
384
+ color: $grayLight;
385
+ text-align: center;
386
+ text-shadow: 0 1px 0 $white;
387
+ background-color: #f5f5f5;
388
+ border: 1px solid #ccc;
389
+ @include border-radius(3px 0 0 3px);
390
+ }
391
+ .active {
392
+ background-color: lighten($green, 30);
393
+ border-color: $green;
394
+ }
395
+ }
396
+ .input-prepend {
397
+ .add-on {
398
+ *margin-top: 1px; /* IE6-7 */
399
+ }
400
+ }
401
+ .input-append {
402
+ input,
403
+ .uneditable-input {
404
+ float: left;
405
+ @include border-radius(3px 0 0 3px);
406
+ }
407
+ .uneditable-input {
408
+ border-left-color: #eee;
409
+ border-right-color: #ccc;
410
+ }
411
+ .add-on {
412
+ margin-right: 0;
413
+ margin-left: -1px;
414
+ @include border-radius(0 3px 3px 0);
415
+ }
416
+ input:first-child {
417
+ // In IE7, having a hasLayout container (from clearfix's zoom:1) can make the first input
418
+ // inherit the sum of its ancestors' margins.
419
+ *margin-left: -160px;
420
+
421
+ &+.add-on {
422
+ *margin-left: -21px;
423
+ }
424
+ }
425
+ }
426
+
427
+
428
+
429
+ // SEARCH FORM
430
+ // -----------
431
+
432
+ .search-query {
433
+ padding-left: 14px;
434
+ padding-right: 14px;
435
+ margin-bottom: 0; // remove the default margin on all inputs
436
+ @include border-radius(14px);
437
+ }
438
+
439
+
440
+
441
+ // HORIZONTAL & VERTICAL FORMS
442
+ // ---------------------------
443
+
444
+ // Common properties
445
+ // -----------------
446
+
447
+ .form-search,
448
+ .form-inline,
449
+ .form-horizontal {
450
+ input,
451
+ textarea,
452
+ select,
453
+ .help-inline,
454
+ .uneditable-input {
455
+ display: inline-block;
456
+ margin-bottom: 0;
457
+ }
458
+ // Re-hide hidden elements due to specifity
459
+ .hide {
460
+ display: none;
461
+ }
462
+ }
463
+ .form-search label,
464
+ .form-inline label,
465
+ .form-search .input-append,
466
+ .form-inline .input-append,
467
+ .form-search .input-prepend,
468
+ .form-inline .input-prepend {
469
+ display: inline-block;
470
+ }
471
+ // Make the prepend and append add-on vertical-align: middle;
472
+ .form-search .input-append .add-on,
473
+ .form-inline .input-prepend .add-on,
474
+ .form-search .input-append .add-on,
475
+ .form-inline .input-prepend .add-on {
476
+ vertical-align: middle;
477
+ }
478
+ // Inline checkbox/radio labels
479
+ .form-search .radio,
480
+ .form-inline .radio,
481
+ .form-search .checkbox,
482
+ .form-inline .checkbox {
483
+ margin-bottom: 0;
484
+ vertical-align: middle;
485
+ }
486
+
487
+ // Margin to space out fieldsets
488
+ .control-group {
489
+ margin-bottom: $baseLineHeight / 2;
490
+ }
491
+
492
+ // Legend collapses margin, so next element is responsible for spacing
493
+ legend + .control-group {
494
+ margin-top: $baseLineHeight;
495
+ -webkit-margin-top-collapse: separate;
496
+ }
497
+
498
+ // Horizontal-specific styles
499
+ // --------------------------
500
+
501
+ .form-horizontal {
502
+ // Increase spacing between groups
503
+ .control-group {
504
+ margin-bottom: $baseLineHeight;
505
+ @include clearfix();
506
+ }
507
+ // Float the labels left
508
+ .control-label {
509
+ float: left;
510
+ width: 140px;
511
+ padding-top: 5px;
512
+ text-align: right;
513
+ }
514
+ // Move over all input controls and content
515
+ .controls {
516
+ margin-left: 160px;
517
+ }
518
+ // Move over buttons in .form-actions to align with .controls
519
+ .form-actions {
520
+ padding-left: 160px;
521
+ }
522
+ }