bootstrap-sass 1.4.4 → 2.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.

Potentially problematic release.


This version of bootstrap-sass might be problematic. Click here for more details.

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