webgen-sass_twitter_bootstrap-bundle 1.0.0

Sign up to get free protection for your applications and to get access to all the features.
Files changed (64) hide show
  1. checksums.yaml +15 -0
  2. data/ChangeLog +3 -0
  3. data/LICENSE +20 -0
  4. data/README.md +61 -0
  5. data/VERSION +1 -0
  6. data/lib/webgen/bundle/sass_twitter_bootstrap/data/css/bootstrap/_accordion.scss +34 -0
  7. data/lib/webgen/bundle/sass_twitter_bootstrap/data/css/bootstrap/_alerts.scss +65 -0
  8. data/lib/webgen/bundle/sass_twitter_bootstrap/data/css/bootstrap/_breadcrumbs.scss +24 -0
  9. data/lib/webgen/bundle/sass_twitter_bootstrap/data/css/bootstrap/_button-groups.scss +242 -0
  10. data/lib/webgen/bundle/sass_twitter_bootstrap/data/css/bootstrap/_buttons.scss +232 -0
  11. data/lib/webgen/bundle/sass_twitter_bootstrap/data/css/bootstrap/_carousel.scss +131 -0
  12. data/lib/webgen/bundle/sass_twitter_bootstrap/data/css/bootstrap/_close.scss +31 -0
  13. data/lib/webgen/bundle/sass_twitter_bootstrap/data/css/bootstrap/_code.scss +58 -0
  14. data/lib/webgen/bundle/sass_twitter_bootstrap/data/css/bootstrap/_component-animations.scss +22 -0
  15. data/lib/webgen/bundle/sass_twitter_bootstrap/data/css/bootstrap/_dropdowns.scss +237 -0
  16. data/lib/webgen/bundle/sass_twitter_bootstrap/data/css/bootstrap/_forms.scss +682 -0
  17. data/lib/webgen/bundle/sass_twitter_bootstrap/data/css/bootstrap/_grid.scss +21 -0
  18. data/lib/webgen/bundle/sass_twitter_bootstrap/data/css/bootstrap/_hero-unit.scss +25 -0
  19. data/lib/webgen/bundle/sass_twitter_bootstrap/data/css/bootstrap/_labels-badges.scss +71 -0
  20. data/lib/webgen/bundle/sass_twitter_bootstrap/data/css/bootstrap/_layouts.scss +16 -0
  21. data/lib/webgen/bundle/sass_twitter_bootstrap/data/css/bootstrap/_media.scss +55 -0
  22. data/lib/webgen/bundle/sass_twitter_bootstrap/data/css/bootstrap/_mixins.scss +684 -0
  23. data/lib/webgen/bundle/sass_twitter_bootstrap/data/css/bootstrap/_modals.scss +95 -0
  24. data/lib/webgen/bundle/sass_twitter_bootstrap/data/css/bootstrap/_navbar.scss +472 -0
  25. data/lib/webgen/bundle/sass_twitter_bootstrap/data/css/bootstrap/_navs.scss +385 -0
  26. data/lib/webgen/bundle/sass_twitter_bootstrap/data/css/bootstrap/_pager.scss +41 -0
  27. data/lib/webgen/bundle/sass_twitter_bootstrap/data/css/bootstrap/_pagination.scss +121 -0
  28. data/lib/webgen/bundle/sass_twitter_bootstrap/data/css/bootstrap/_popovers.scss +117 -0
  29. data/lib/webgen/bundle/sass_twitter_bootstrap/data/css/bootstrap/_progress-bars.scss +122 -0
  30. data/lib/webgen/bundle/sass_twitter_bootstrap/data/css/bootstrap/_reset.scss +138 -0
  31. data/lib/webgen/bundle/sass_twitter_bootstrap/data/css/bootstrap/_responsive-1200px-min.scss +28 -0
  32. data/lib/webgen/bundle/sass_twitter_bootstrap/data/css/bootstrap/_responsive-767px-max.scss +193 -0
  33. data/lib/webgen/bundle/sass_twitter_bootstrap/data/css/bootstrap/_responsive-768px-979px.scss +19 -0
  34. data/lib/webgen/bundle/sass_twitter_bootstrap/data/css/bootstrap/_responsive-navbar.scss +185 -0
  35. data/lib/webgen/bundle/sass_twitter_bootstrap/data/css/bootstrap/_responsive-utilities.scss +58 -0
  36. data/lib/webgen/bundle/sass_twitter_bootstrap/data/css/bootstrap/_scaffolding.scss +52 -0
  37. data/lib/webgen/bundle/sass_twitter_bootstrap/data/css/bootstrap/_sprites.scss +195 -0
  38. data/lib/webgen/bundle/sass_twitter_bootstrap/data/css/bootstrap/_tables.scss +227 -0
  39. data/lib/webgen/bundle/sass_twitter_bootstrap/data/css/bootstrap/_thumbnails.scss +52 -0
  40. data/lib/webgen/bundle/sass_twitter_bootstrap/data/css/bootstrap/_tooltip.scss +70 -0
  41. data/lib/webgen/bundle/sass_twitter_bootstrap/data/css/bootstrap/_type.scss +227 -0
  42. data/lib/webgen/bundle/sass_twitter_bootstrap/data/css/bootstrap/_utilities.scss +45 -0
  43. data/lib/webgen/bundle/sass_twitter_bootstrap/data/css/bootstrap/_variables.scss +301 -0
  44. data/lib/webgen/bundle/sass_twitter_bootstrap/data/css/bootstrap/_wells.scss +29 -0
  45. data/lib/webgen/bundle/sass_twitter_bootstrap/data/css/bootstrap/bootstrap.scss +63 -0
  46. data/lib/webgen/bundle/sass_twitter_bootstrap/data/css/bootstrap/responsive.scss +48 -0
  47. data/lib/webgen/bundle/sass_twitter_bootstrap/data/img/glyphicons-halflings-white.png +0 -0
  48. data/lib/webgen/bundle/sass_twitter_bootstrap/data/img/glyphicons-halflings.png +0 -0
  49. data/lib/webgen/bundle/sass_twitter_bootstrap/data/js/bootstrap-affix.js +106 -0
  50. data/lib/webgen/bundle/sass_twitter_bootstrap/data/js/bootstrap-alert.js +88 -0
  51. data/lib/webgen/bundle/sass_twitter_bootstrap/data/js/bootstrap-button.js +94 -0
  52. data/lib/webgen/bundle/sass_twitter_bootstrap/data/js/bootstrap-carousel.js +176 -0
  53. data/lib/webgen/bundle/sass_twitter_bootstrap/data/js/bootstrap-collapse.js +156 -0
  54. data/lib/webgen/bundle/sass_twitter_bootstrap/data/js/bootstrap-dropdown.js +148 -0
  55. data/lib/webgen/bundle/sass_twitter_bootstrap/data/js/bootstrap-modal.js +234 -0
  56. data/lib/webgen/bundle/sass_twitter_bootstrap/data/js/bootstrap-popover.js +103 -0
  57. data/lib/webgen/bundle/sass_twitter_bootstrap/data/js/bootstrap-scrollspy.js +151 -0
  58. data/lib/webgen/bundle/sass_twitter_bootstrap/data/js/bootstrap-tab.js +133 -0
  59. data/lib/webgen/bundle/sass_twitter_bootstrap/data/js/bootstrap-tooltip.js +276 -0
  60. data/lib/webgen/bundle/sass_twitter_bootstrap/data/js/bootstrap-transition.js +60 -0
  61. data/lib/webgen/bundle/sass_twitter_bootstrap/data/js/bootstrap-typeahead.js +310 -0
  62. data/lib/webgen/bundle/sass_twitter_bootstrap/info.yaml +9 -0
  63. data/lib/webgen/bundle/sass_twitter_bootstrap/init.rb +3 -0
  64. metadata +126 -0
@@ -0,0 +1,22 @@
1
+ //
2
+ // Component animations
3
+ // --------------------------------------------------
4
+
5
+
6
+ .fade {
7
+ opacity: 0;
8
+ @include transition(opacity .15s linear);
9
+ &.in {
10
+ opacity: 1;
11
+ }
12
+ }
13
+
14
+ .collapse {
15
+ position: relative;
16
+ height: 0;
17
+ overflow: hidden;
18
+ @include transition(height .35s ease);
19
+ &.in {
20
+ height: auto;
21
+ }
22
+ }
@@ -0,0 +1,237 @@
1
+ //
2
+ // Dropdown menus
3
+ // --------------------------------------------------
4
+
5
+
6
+ // Use the .menu class on any <li> element within the topbar or ul.tabs and you'll get some superfancy dropdowns
7
+ .dropup,
8
+ .dropdown {
9
+ position: relative;
10
+ }
11
+ .dropdown-toggle {
12
+ // The caret makes the toggle a bit too tall in IE7
13
+ *margin-bottom: -3px;
14
+ }
15
+ .dropdown-toggle:active,
16
+ .open .dropdown-toggle {
17
+ outline: 0;
18
+ }
19
+
20
+ // Dropdown arrow/caret
21
+ // --------------------
22
+ .caret {
23
+ display: inline-block;
24
+ width: 0;
25
+ height: 0;
26
+ vertical-align: top;
27
+ border-top: 4px solid $black;
28
+ border-right: 4px solid transparent;
29
+ border-left: 4px solid transparent;
30
+ content: "";
31
+ }
32
+
33
+ // Place the caret
34
+ .dropdown .caret {
35
+ margin-top: 8px;
36
+ margin-left: 2px;
37
+ }
38
+
39
+ // The dropdown menu (ul)
40
+ // ----------------------
41
+ .dropdown-menu {
42
+ position: absolute;
43
+ top: 100%;
44
+ left: 0;
45
+ z-index: $zindexDropdown;
46
+ display: none; // none by default, but block on "open" of the menu
47
+ float: left;
48
+ min-width: 160px;
49
+ padding: 5px 0;
50
+ margin: 2px 0 0; // override default ul
51
+ list-style: none;
52
+ background-color: $dropdownBackground;
53
+ border: 1px solid #ccc; // Fallback for IE7-8
54
+ border: 1px solid $dropdownBorder;
55
+ *border-right-width: 2px;
56
+ *border-bottom-width: 2px;
57
+ @include border-radius(6px);
58
+ @include box-shadow(0 5px 10px rgba(0,0,0,.2));
59
+ -webkit-background-clip: padding-box;
60
+ -moz-background-clip: padding;
61
+ background-clip: padding-box;
62
+
63
+ // Aligns the dropdown menu to right
64
+ &.pull-right {
65
+ right: 0;
66
+ left: auto;
67
+ }
68
+
69
+ // Dividers (basically an hr) within the dropdown
70
+ .divider {
71
+ @include nav-divider($dropdownDividerTop, $dropdownDividerBottom);
72
+ }
73
+
74
+ // Links within the dropdown menu
75
+ li > a {
76
+ display: block;
77
+ padding: 3px 20px;
78
+ clear: both;
79
+ font-weight: normal;
80
+ line-height: $baseLineHeight;
81
+ color: $dropdownLinkColor;
82
+ white-space: nowrap;
83
+ }
84
+ }
85
+
86
+ // Hover state
87
+ // -----------
88
+ .dropdown-menu li > a:hover,
89
+ .dropdown-menu li > a:focus,
90
+ .dropdown-submenu:hover > a {
91
+ text-decoration: none;
92
+ color: $dropdownLinkColorHover;
93
+ @include gradient-vertical($dropdownLinkBackgroundHover, darken($dropdownLinkBackgroundHover, 5%));
94
+ }
95
+
96
+ // Active state
97
+ // ------------
98
+ .dropdown-menu .active > a,
99
+ .dropdown-menu .active > a:hover {
100
+ color: $dropdownLinkColorActive;
101
+ text-decoration: none;
102
+ outline: 0;
103
+ @include gradient-vertical($dropdownLinkBackgroundActive, darken($dropdownLinkBackgroundActive, 5%));
104
+ }
105
+
106
+ // Disabled state
107
+ // --------------
108
+ // Gray out text and ensure the hover state remains gray
109
+ .dropdown-menu .disabled > a,
110
+ .dropdown-menu .disabled > a:hover {
111
+ color: $grayLight;
112
+ }
113
+ // Nuke hover effects
114
+ .dropdown-menu .disabled > a:hover {
115
+ text-decoration: none;
116
+ background-color: transparent;
117
+ background-image: none; // Remove CSS gradient
118
+ cursor: default;
119
+ }
120
+
121
+ // Open state for the dropdown
122
+ // ---------------------------
123
+ .open {
124
+ // IE7's z-index only goes to the nearest positioned ancestor, which would
125
+ // make the menu appear below buttons that appeared later on the page
126
+ *z-index: $zindexDropdown;
127
+
128
+ & > .dropdown-menu {
129
+ display: block;
130
+ }
131
+ }
132
+
133
+ // Right aligned dropdowns
134
+ // ---------------------------
135
+ .pull-right > .dropdown-menu {
136
+ right: 0;
137
+ left: auto;
138
+ }
139
+
140
+ // Allow for dropdowns to go bottom up (aka, dropup-menu)
141
+ // ------------------------------------------------------
142
+ // Just add .dropup after the standard .dropdown class and you're set, bro.
143
+ // TODO: abstract this so that the navbar fixed styles are not placed here?
144
+ .dropup,
145
+ .navbar-fixed-bottom .dropdown {
146
+ // Reverse the caret
147
+ .caret {
148
+ border-top: 0;
149
+ border-bottom: 4px solid $black;
150
+ content: "";
151
+ }
152
+ // Different positioning for bottom up menu
153
+ .dropdown-menu {
154
+ top: auto;
155
+ bottom: 100%;
156
+ margin-bottom: 1px;
157
+ }
158
+ }
159
+
160
+ // Sub menus
161
+ // ---------------------------
162
+ .dropdown-submenu {
163
+ position: relative;
164
+ }
165
+ // Default dropdowns
166
+ .dropdown-submenu > .dropdown-menu {
167
+ top: 0;
168
+ left: 100%;
169
+ margin-top: -6px;
170
+ margin-left: -1px;
171
+ -webkit-border-radius: 0 6px 6px 6px;
172
+ -moz-border-radius: 0 6px 6px 6px;
173
+ border-radius: 0 6px 6px 6px;
174
+ }
175
+ .dropdown-submenu:hover > .dropdown-menu {
176
+ display: block;
177
+ }
178
+
179
+ // Dropups
180
+ .dropup .dropdown-submenu > .dropdown-menu {
181
+ top: auto;
182
+ bottom: 0;
183
+ margin-top: 0;
184
+ margin-bottom: -2px;
185
+ -webkit-border-radius: 5px 5px 5px 0;
186
+ -moz-border-radius: 5px 5px 5px 0;
187
+ border-radius: 5px 5px 5px 0;
188
+ }
189
+
190
+ // Caret to indicate there is a submenu
191
+ .dropdown-submenu > a:after {
192
+ display: block;
193
+ content: " ";
194
+ float: right;
195
+ width: 0;
196
+ height: 0;
197
+ border-color: transparent;
198
+ border-style: solid;
199
+ border-width: 5px 0 5px 5px;
200
+ border-left-color: darken($dropdownBackground, 20%);
201
+ margin-top: 5px;
202
+ margin-right: -10px;
203
+ }
204
+ .dropdown-submenu:hover > a:after {
205
+ border-left-color: $dropdownLinkColorHover;
206
+ }
207
+
208
+ // Left aligned submenus
209
+ .dropdown-submenu.pull-left {
210
+ // Undo the float
211
+ // Yes, this is awkward since .pull-left adds a float, but it sticks to our conventions elsewhere.
212
+ float: none;
213
+
214
+ // Positioning the submenu
215
+ > .dropdown-menu {
216
+ left: -100%;
217
+ margin-left: 10px;
218
+ -webkit-border-radius: 6px 0 6px 6px;
219
+ -moz-border-radius: 6px 0 6px 6px;
220
+ border-radius: 6px 0 6px 6px;
221
+ }
222
+ }
223
+
224
+ // Tweak nav headers
225
+ // -----------------
226
+ // Increase padding from 15px to 20px on sides
227
+ .dropdown .dropdown-menu .nav-header {
228
+ padding-left: 20px;
229
+ padding-right: 20px;
230
+ }
231
+
232
+ // Typeahead
233
+ // ---------
234
+ .typeahead {
235
+ margin-top: 2px; // give it some space to breathe
236
+ @include border-radius($baseBorderRadius);
237
+ }
@@ -0,0 +1,682 @@
1
+ //
2
+ // Forms
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;
26
+ font-size: $baseFontSize * 1.5;
27
+ line-height: $baseLineHeight * 2;
28
+ color: $grayDark;
29
+ border: 0;
30
+ border-bottom: 1px solid #e5e5e5;
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
+ font-family: $baseFontFamily; // 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
+ }
59
+
60
+ // Form controls
61
+ // -------------------------
62
+
63
+ // Shared size and type resets
64
+ select,
65
+ textarea,
66
+ input[type="text"],
67
+ input[type="password"],
68
+ input[type="datetime"],
69
+ input[type="datetime-local"],
70
+ input[type="date"],
71
+ input[type="month"],
72
+ input[type="time"],
73
+ input[type="week"],
74
+ input[type="number"],
75
+ input[type="email"],
76
+ input[type="url"],
77
+ input[type="search"],
78
+ input[type="tel"],
79
+ input[type="color"],
80
+ .uneditable-input {
81
+ display: inline-block;
82
+ height: $baseLineHeight;
83
+ padding: 4px 6px;
84
+ margin-bottom: $baseLineHeight / 2;;
85
+ font-size: $baseFontSize;
86
+ line-height: $baseLineHeight;
87
+ color: $gray;
88
+ @include border-radius($inputBorderRadius);
89
+ vertical-align: middle;
90
+ }
91
+
92
+ // Reset appearance properties for textual inputs and textarea
93
+ // Declare width for legacy (can't be on input[type=*] selectors or it's too specific)
94
+ input,
95
+ textarea,
96
+ .uneditable-input {
97
+ width: 206px; // plus 12px padding and 2px border
98
+ }
99
+ // Reset height since textareas have rows
100
+ textarea {
101
+ height: auto;
102
+ }
103
+ // Everything else
104
+ textarea,
105
+ input[type="text"],
106
+ input[type="password"],
107
+ input[type="datetime"],
108
+ input[type="datetime-local"],
109
+ input[type="date"],
110
+ input[type="month"],
111
+ input[type="time"],
112
+ input[type="week"],
113
+ input[type="number"],
114
+ input[type="email"],
115
+ input[type="url"],
116
+ input[type="search"],
117
+ input[type="tel"],
118
+ input[type="color"],
119
+ .uneditable-input {
120
+ background-color: $inputBackground;
121
+ border: 1px solid $inputBorder;
122
+ @include box-shadow(inset 0 1px 1px rgba(0,0,0,.075));
123
+ @include transition(border linear .2s, box-shadow linear .2s);
124
+
125
+ // Focus state
126
+ &:focus {
127
+ border-color: rgba(82,168,236,.8);
128
+ outline: 0;
129
+ outline: thin dotted \9; /* IE6-9 */
130
+ @include box-shadow(inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(82,168,236,.6));
131
+ }
132
+ }
133
+
134
+ // Position radios and checkboxes better
135
+ input[type="radio"],
136
+ input[type="checkbox"] {
137
+ margin: 4px 0 0;
138
+ *margin-top: 0; /* IE7 */
139
+ margin-top: 1px \9; /* IE8-9 */
140
+ line-height: normal;
141
+ cursor: pointer;
142
+ }
143
+
144
+ // Reset width of input images, buttons, radios, checkboxes
145
+ input[type="file"],
146
+ input[type="image"],
147
+ input[type="submit"],
148
+ input[type="reset"],
149
+ input[type="button"],
150
+ input[type="radio"],
151
+ input[type="checkbox"] {
152
+ width: auto; // Override of generic input selector
153
+ }
154
+
155
+ // Set the height of select and file controls to match text inputs
156
+ select,
157
+ input[type="file"] {
158
+ height: $inputHeight; /* In IE7, the height of the select element cannot be changed by height, only font-size */
159
+ *margin-top: 4px; /* For IE7, add top margin to align select with labels */
160
+ line-height: $inputHeight;
161
+ }
162
+
163
+ // Make select elements obey height by applying a border
164
+ select {
165
+ width: 220px; // default input width + 10px of padding that doesn't get applied
166
+ border: 1px solid $inputBorder;
167
+ background-color: $inputBackground; // Chrome on Linux and Mobile Safari need background-color
168
+ }
169
+
170
+ // Make multiple select elements height not fixed
171
+ select[multiple],
172
+ select[size] {
173
+ height: auto;
174
+ }
175
+
176
+ // Focus for select, file, radio, and checkbox
177
+ select:focus,
178
+ input[type="file"]:focus,
179
+ input[type="radio"]:focus,
180
+ input[type="checkbox"]:focus {
181
+ @include tab-focus();
182
+ }
183
+
184
+
185
+ // Uneditable inputs
186
+ // -------------------------
187
+
188
+ // Make uneditable inputs look inactive
189
+ .uneditable-input,
190
+ .uneditable-textarea {
191
+ color: $grayLight;
192
+ background-color: darken($inputBackground, 1%);
193
+ border-color: $inputBorder;
194
+ @include box-shadow(inset 0 1px 2px rgba(0,0,0,.025));
195
+ cursor: not-allowed;
196
+ }
197
+
198
+ // For text that needs to appear as an input but should not be an input
199
+ .uneditable-input {
200
+ overflow: hidden; // prevent text from wrapping, but still cut it off like an input does
201
+ white-space: nowrap;
202
+ }
203
+
204
+ // Make uneditable textareas behave like a textarea
205
+ .uneditable-textarea {
206
+ width: auto;
207
+ height: auto;
208
+ }
209
+
210
+
211
+ // Placeholder
212
+ // -------------------------
213
+
214
+ // Placeholder text gets special styles because when browsers invalidate entire lines if it doesn't understand a selector
215
+ input,
216
+ textarea {
217
+ @include placeholder();
218
+ }
219
+
220
+
221
+ // CHECKBOXES & RADIOS
222
+ // -------------------
223
+
224
+ // Indent the labels to position radios/checkboxes as hanging
225
+ .radio,
226
+ .checkbox {
227
+ min-height: $baseLineHeight; // clear the floating input if there is no label text
228
+ padding-left: 20px;
229
+ }
230
+ .radio input[type="radio"],
231
+ .checkbox input[type="checkbox"] {
232
+ float: left;
233
+ margin-left: -20px;
234
+ }
235
+
236
+ // Move the options list down to align with labels
237
+ .controls > .radio:first-child,
238
+ .controls > .checkbox:first-child {
239
+ padding-top: 5px; // has to be padding because margin collaspes
240
+ }
241
+
242
+ // Radios and checkboxes on same line
243
+ // TODO v3: Convert .inline to .control-inline
244
+ .radio.inline,
245
+ .checkbox.inline {
246
+ display: inline-block;
247
+ padding-top: 5px;
248
+ margin-bottom: 0;
249
+ vertical-align: middle;
250
+ }
251
+ .radio.inline + .radio.inline,
252
+ .checkbox.inline + .checkbox.inline {
253
+ margin-left: 10px; // space out consecutive inline controls
254
+ }
255
+
256
+
257
+
258
+ // INPUT SIZES
259
+ // -----------
260
+
261
+ // General classes for quick sizes
262
+ .input-mini { width: 60px; }
263
+ .input-small { width: 90px; }
264
+ .input-medium { width: 150px; }
265
+ .input-large { width: 210px; }
266
+ .input-xlarge { width: 270px; }
267
+ .input-xxlarge { width: 530px; }
268
+
269
+ // Grid style input sizes
270
+ input[class*="span"],
271
+ select[class*="span"],
272
+ textarea[class*="span"],
273
+ .uneditable-input[class*="span"],
274
+ // Redeclare since the fluid row class is more specific
275
+ .row-fluid input[class*="span"],
276
+ .row-fluid select[class*="span"],
277
+ .row-fluid textarea[class*="span"],
278
+ .row-fluid .uneditable-input[class*="span"] {
279
+ float: none;
280
+ margin-left: 0;
281
+ }
282
+ // Ensure input-prepend/append never wraps
283
+ .input-append input[class*="span"],
284
+ .input-append .uneditable-input[class*="span"],
285
+ .input-prepend input[class*="span"],
286
+ .input-prepend .uneditable-input[class*="span"],
287
+ .row-fluid input[class*="span"],
288
+ .row-fluid select[class*="span"],
289
+ .row-fluid textarea[class*="span"],
290
+ .row-fluid .uneditable-input[class*="span"],
291
+ .row-fluid .input-prepend [class*="span"],
292
+ .row-fluid .input-append [class*="span"] {
293
+ display: inline-block;
294
+ }
295
+
296
+
297
+
298
+ // GRID SIZING FOR INPUTS
299
+ // ----------------------
300
+
301
+ // Grid sizes
302
+ @include grid-input($gridColumnWidth, $gridGutterWidth);
303
+
304
+ // Control row for multiple inputs per line
305
+ .controls-row {
306
+ @include clearfix(); // Clear the float from controls
307
+ }
308
+
309
+ // Float to collapse white-space for proper grid alignment
310
+ .controls-row [class*="span"],
311
+ // Redeclare the fluid grid collapse since we undo the float for inputs
312
+ .row-fluid .controls-row [class*="span"] {
313
+ float: left;
314
+ }
315
+ // Explicity set top padding on all checkboxes/radios, not just first-child
316
+ .controls-row .checkbox[class*="span"],
317
+ .controls-row .radio[class*="span"] {
318
+ padding-top: 5px;
319
+ }
320
+
321
+
322
+
323
+
324
+ // DISABLED STATE
325
+ // --------------
326
+
327
+ // Disabled and read-only inputs
328
+ input[disabled],
329
+ select[disabled],
330
+ textarea[disabled],
331
+ input[readonly],
332
+ select[readonly],
333
+ textarea[readonly] {
334
+ cursor: not-allowed;
335
+ background-color: $inputDisabledBackground;
336
+ }
337
+ // Explicitly reset the colors here
338
+ input[type="radio"][disabled],
339
+ input[type="checkbox"][disabled],
340
+ input[type="radio"][readonly],
341
+ input[type="checkbox"][readonly] {
342
+ background-color: transparent;
343
+ }
344
+
345
+
346
+
347
+
348
+ // FORM FIELD FEEDBACK STATES
349
+ // --------------------------
350
+
351
+ // Warning
352
+ .control-group.warning {
353
+ @include formFieldState($warningText, $warningText, $warningBackground);
354
+ }
355
+ // Error
356
+ .control-group.error {
357
+ @include formFieldState($errorText, $errorText, $errorBackground);
358
+ }
359
+ // Success
360
+ .control-group.success {
361
+ @include formFieldState($successText, $successText, $successBackground);
362
+ }
363
+ // Info
364
+ .control-group.info {
365
+ @include formFieldState($infoText, $infoText, $infoBackground);
366
+ }
367
+
368
+ // HTML5 invalid states
369
+ // Shares styles with the .control-group.error above
370
+ input:focus:required:invalid,
371
+ textarea:focus:required:invalid,
372
+ select:focus:required:invalid {
373
+ color: #b94a48;
374
+ border-color: #ee5f5b;
375
+ &:focus {
376
+ border-color: darken(#ee5f5b, 10%);
377
+ @include box-shadow(0 0 6px lighten(#ee5f5b, 20%));
378
+ }
379
+ }
380
+
381
+
382
+
383
+ // FORM ACTIONS
384
+ // ------------
385
+
386
+ .form-actions {
387
+ padding: ($baseLineHeight - 1) 20px $baseLineHeight;
388
+ margin-top: $baseLineHeight;
389
+ margin-bottom: $baseLineHeight;
390
+ background-color: $formActionsBackground;
391
+ border-top: 1px solid #e5e5e5;
392
+ @include clearfix(); // Adding clearfix to allow for .pull-right button containers
393
+ }
394
+
395
+
396
+
397
+ // HELP TEXT
398
+ // ---------
399
+
400
+ .help-block,
401
+ .help-inline {
402
+ color: lighten($textColor, 15%); // lighten the text some for contrast
403
+ }
404
+
405
+ .help-block {
406
+ display: block; // account for any element using help-block
407
+ margin-bottom: $baseLineHeight / 2;
408
+ }
409
+
410
+ .help-inline {
411
+ display: inline-block;
412
+ @include ie7-inline-block();
413
+ vertical-align: middle;
414
+ padding-left: 5px;
415
+ }
416
+
417
+
418
+
419
+ // INPUT GROUPS
420
+ // ------------
421
+
422
+ // Allow us to put symbols and text within the input field for a cleaner look
423
+ .input-append,
424
+ .input-prepend {
425
+ margin-bottom: 5px;
426
+ font-size: 0; // white space collapse hack
427
+ white-space: nowrap; // Prevent span and input from separating
428
+
429
+ // Reset the white space collapse hack
430
+ input,
431
+ select,
432
+ .uneditable-input,
433
+ .dropdown-menu {
434
+ font-size: $baseFontSize;
435
+ }
436
+
437
+ input,
438
+ select,
439
+ .uneditable-input {
440
+ position: relative; // placed here by default so that on :focus we can place the input above the .add-on for full border and box-shadow goodness
441
+ margin-bottom: 0; // prevent bottom margin from screwing up alignment in stacked forms
442
+ *margin-left: 0;
443
+ vertical-align: top;
444
+ @include border-radius(0 $inputBorderRadius $inputBorderRadius 0);
445
+ // Make input on top when focused so blue border and shadow always show
446
+ &:focus {
447
+ z-index: 2;
448
+ }
449
+ }
450
+ .add-on {
451
+ display: inline-block;
452
+ width: auto;
453
+ height: $baseLineHeight;
454
+ min-width: 16px;
455
+ padding: 4px 5px;
456
+ font-size: $baseFontSize;
457
+ font-weight: normal;
458
+ line-height: $baseLineHeight;
459
+ text-align: center;
460
+ text-shadow: 0 1px 0 $white;
461
+ background-color: $grayLighter;
462
+ border: 1px solid #ccc;
463
+ }
464
+ .add-on,
465
+ .btn {
466
+ vertical-align: top;
467
+ @include border-radius(0);
468
+ }
469
+ .active {
470
+ background-color: lighten($green, 30);
471
+ border-color: $green;
472
+ }
473
+ }
474
+
475
+ .input-prepend {
476
+ .add-on,
477
+ .btn {
478
+ margin-right: -1px;
479
+ }
480
+ .add-on:first-child,
481
+ .btn:first-child {
482
+ // FYI, `.btn:first-child` accounts for a button group that's prepended
483
+ @include border-radius($inputBorderRadius 0 0 $inputBorderRadius);
484
+ }
485
+ }
486
+
487
+ .input-append {
488
+ input,
489
+ select,
490
+ .uneditable-input {
491
+ @include border-radius($inputBorderRadius 0 0 $inputBorderRadius);
492
+ + .btn-group .btn {
493
+ @include border-radius(0 $inputBorderRadius $inputBorderRadius 0);
494
+ }
495
+ }
496
+ .add-on,
497
+ .btn,
498
+ .btn-group {
499
+ margin-left: -1px;
500
+ }
501
+ .add-on:last-child,
502
+ .btn:last-child {
503
+ @include border-radius(0 $inputBorderRadius $inputBorderRadius 0);
504
+ }
505
+ }
506
+
507
+ // Remove all border-radius for inputs with both prepend and append
508
+ .input-prepend.input-append {
509
+ input,
510
+ select,
511
+ .uneditable-input {
512
+ @include border-radius(0);
513
+ + .btn-group .btn {
514
+ @include border-radius(0 $inputBorderRadius $inputBorderRadius 0);
515
+ }
516
+ }
517
+ .add-on:first-child,
518
+ .btn:first-child {
519
+ margin-right: -1px;
520
+ @include border-radius($inputBorderRadius 0 0 $inputBorderRadius);
521
+ }
522
+ .add-on:last-child,
523
+ .btn:last-child {
524
+ margin-left: -1px;
525
+ @include border-radius(0 $inputBorderRadius $inputBorderRadius 0);
526
+ }
527
+ .btn-group:first-child {
528
+ margin-left: 0;
529
+ }
530
+ }
531
+
532
+
533
+
534
+
535
+ // SEARCH FORM
536
+ // -----------
537
+
538
+ input.search-query {
539
+ padding-right: 14px;
540
+ padding-right: 4px \9;
541
+ padding-left: 14px;
542
+ padding-left: 4px \9; /* IE7-8 doesn't have border-radius, so don't indent the padding */
543
+ margin-bottom: 0; // Remove the default margin on all inputs
544
+ @include border-radius(15px);
545
+ }
546
+
547
+ /* Allow for input prepend/append in search forms */
548
+ .form-search .input-append .search-query,
549
+ .form-search .input-prepend .search-query {
550
+ @include border-radius(0); // Override due to specificity
551
+ }
552
+ .form-search .input-append .search-query {
553
+ @include border-radius(14px 0 0 14px);
554
+ }
555
+ .form-search .input-append .btn {
556
+ @include border-radius(0 14px 14px 0);
557
+ }
558
+ .form-search .input-prepend .search-query {
559
+ @include border-radius(0 14px 14px 0);
560
+ }
561
+ .form-search .input-prepend .btn {
562
+ @include border-radius(14px 0 0 14px);
563
+ }
564
+
565
+
566
+
567
+
568
+ // HORIZONTAL & VERTICAL FORMS
569
+ // ---------------------------
570
+
571
+ // Common properties
572
+ // -----------------
573
+
574
+ .form-search,
575
+ .form-inline,
576
+ .form-horizontal {
577
+ input,
578
+ textarea,
579
+ select,
580
+ .help-inline,
581
+ .uneditable-input,
582
+ .input-prepend,
583
+ .input-append {
584
+ display: inline-block;
585
+ @include ie7-inline-block();
586
+ margin-bottom: 0;
587
+ vertical-align: middle;
588
+ }
589
+ // Re-hide hidden elements due to specifity
590
+ .hide {
591
+ display: none;
592
+ }
593
+ }
594
+ .form-search label,
595
+ .form-inline label,
596
+ .form-search .btn-group,
597
+ .form-inline .btn-group {
598
+ display: inline-block;
599
+ }
600
+ // Remove margin for input-prepend/-append
601
+ .form-search .input-append,
602
+ .form-inline .input-append,
603
+ .form-search .input-prepend,
604
+ .form-inline .input-prepend {
605
+ margin-bottom: 0;
606
+ }
607
+ // Inline checkbox/radio labels (remove padding on left)
608
+ .form-search .radio,
609
+ .form-search .checkbox,
610
+ .form-inline .radio,
611
+ .form-inline .checkbox {
612
+ padding-left: 0;
613
+ margin-bottom: 0;
614
+ vertical-align: middle;
615
+ }
616
+ // Remove float and margin, set to inline-block
617
+ .form-search .radio input[type="radio"],
618
+ .form-search .checkbox input[type="checkbox"],
619
+ .form-inline .radio input[type="radio"],
620
+ .form-inline .checkbox input[type="checkbox"] {
621
+ float: left;
622
+ margin-right: 3px;
623
+ margin-left: 0;
624
+ }
625
+
626
+
627
+ // Margin to space out fieldsets
628
+ .control-group {
629
+ margin-bottom: $baseLineHeight / 2;
630
+ }
631
+
632
+ // Legend collapses margin, so next element is responsible for spacing
633
+ legend + .control-group {
634
+ margin-top: $baseLineHeight;
635
+ -webkit-margin-top-collapse: separate;
636
+ }
637
+
638
+ // Horizontal-specific styles
639
+ // --------------------------
640
+
641
+ .form-horizontal {
642
+ // Increase spacing between groups
643
+ .control-group {
644
+ margin-bottom: $baseLineHeight;
645
+ @include clearfix();
646
+ }
647
+ // Float the labels left
648
+ .control-label {
649
+ float: left;
650
+ width: $horizontalComponentOffset - 20;
651
+ padding-top: 5px;
652
+ text-align: right;
653
+ }
654
+ // Move over all input controls and content
655
+ .controls {
656
+ // Super jank IE7 fix to ensure the inputs in .input-append and input-prepend
657
+ // don't inherit the margin of the parent, in this case .controls
658
+ *display: inline-block;
659
+ *padding-left: 20px;
660
+ margin-left: $horizontalComponentOffset;
661
+ *margin-left: 0;
662
+ &:first-child {
663
+ *padding-left: $horizontalComponentOffset;
664
+ }
665
+ }
666
+ // Remove bottom margin on block level help text since that's accounted for on .control-group
667
+ .help-block {
668
+ margin-bottom: 0;
669
+ }
670
+ // And apply it only to .help-block instances that follow a form control
671
+ input,
672
+ select,
673
+ textarea {
674
+ + .help-block {
675
+ margin-top: $baseLineHeight / 2;
676
+ }
677
+ }
678
+ // Move over buttons in .form-actions to align with .controls
679
+ .form-actions {
680
+ padding-left: $horizontalComponentOffset;
681
+ }
682
+ }