sass-twitter-bootstrap-rails 0.1 → 1.0.0

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