compass_twitter_bootstrap 0.1.3 → 0.1.4

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.
@@ -1,3 +1,3 @@
1
1
  module CompassTwitterBootstrap
2
- VERSION = "0.1.3"
2
+ VERSION = "0.1.4"
3
3
  end
@@ -61,29 +61,58 @@ input[type=radio] {
61
61
  }
62
62
 
63
63
  // Inputs, Textareas, Selects
64
- input[type=text],
65
- input[type=password],
64
+ input,
66
65
  textarea,
67
66
  select,
68
67
  .uneditable-input {
69
68
  display: inline-block;
70
69
  width: 210px;
70
+ height: $baseline;
71
71
  padding: 4px;
72
72
  font-size: 13px;
73
73
  line-height: $baseline;
74
- height: $baseline;
75
74
  color: $gray;
76
75
  border: 1px solid #ccc;
77
76
  @include border-radius(3px);
78
77
  }
78
+
79
+ /* mini reset for non-html5 file types */
80
+ input[type=checkbox],
81
+ input[type=radio] {
82
+ width: auto;
83
+ height: auto;
84
+ padding: 0;
85
+ margin: 3px 0;
86
+ *margin-top: 0; /* IE6-7 */
87
+ line-height: normal;
88
+ border: none;
89
+ }
90
+
91
+ input[type=file] {
92
+ background-color: #fff;
93
+ padding: initial;
94
+ border: initial;
95
+ line-height: initial;
96
+ @include box-shadow(none);
97
+ }
98
+
99
+ input[type=button],
100
+ input[type=reset],
101
+ input[type=submit] {
102
+ width: auto;
103
+ height: auto;
104
+ }
105
+
79
106
  select,
80
107
  input[type=file] {
81
108
  height: $baseline * 1.5;
82
109
  line-height: $baseline * 1.5;
83
110
  }
111
+
84
112
  textarea {
85
113
  height: auto;
86
114
  }
115
+
87
116
  .uneditable-input {
88
117
  background-color: #eee;
89
118
  display: block;
@@ -100,15 +129,13 @@ textarea {
100
129
  }
101
130
 
102
131
  // Focus states
103
- input[type=text],
104
- input[type=password],
132
+ input,
105
133
  select, textarea {
106
134
  $transition: border linear .2s, box-shadow linear .2s;
107
135
  @include transition($transition);
108
136
  @include box-shadow(inset 0 1px 3px rgba(0,0,0,.1));
109
137
  }
110
- input[type=text]:focus,
111
- input[type=password]:focus,
138
+ input:focus,
112
139
  textarea:focus {
113
140
  outline: none;
114
141
  border-color: rgba(82,168,236,.8);
@@ -128,8 +155,7 @@ form div.error {
128
155
  span.help-block {
129
156
  color: $red;
130
157
  }
131
- input[type=text],
132
- input[type=password],
158
+ input,
133
159
  textarea {
134
160
  border-color: $error-text;
135
161
  @include box-shadow(0 0 3px rgba(171,41,32,.25));
@@ -221,7 +247,7 @@ input.disabled {
221
247
  // Inline Fields (input fields that appear as inline objects
222
248
  .inline-inputs {
223
249
  color: $gray;
224
- span, input[type=text] {
250
+ span, input {
225
251
  display: inline-block;
226
252
  }
227
253
  input.mini {
@@ -238,8 +264,7 @@ input.disabled {
238
264
  // Allow us to put symbols and text within the input field for a cleaner look
239
265
  .input-prepend,
240
266
  .input-append {
241
- input[type=text],
242
- input[type=password] {
267
+ input {
243
268
  @include border-radius(0 3px 3px 0);
244
269
  }
245
270
  .add-on {
@@ -270,8 +295,7 @@ input.disabled {
270
295
  }
271
296
  }
272
297
  .input-append {
273
- input[type=text],
274
- input[type=password] {
298
+ input {
275
299
  float: left;
276
300
  @include border-radius(3px 0 0 3px);
277
301
  }
@@ -366,4 +390,4 @@ input.disabled {
366
390
  margin-left: -20px;
367
391
  padding-left: 20px;
368
392
  }
369
- }
393
+ }
@@ -16,14 +16,6 @@
16
16
  z-index: 10000;
17
17
  overflow: visible;
18
18
 
19
- // gradient is applied to it's own element because overflow visible is not honored by ie when filter is present
20
- .fill {
21
- background:#222;
22
- @include vertical(#333, #222);
23
- $shadow: 0 1px 3px rgba(0,0,0,.25), inset 0 -1px 0 rgba(0,0,0,.1);
24
- @include box-shadow($shadow);
25
- }
26
-
27
19
  // Links get text shadow
28
20
  a {
29
21
  color: $grayLight;
@@ -32,7 +24,7 @@
32
24
 
33
25
  // Hover and active states
34
26
  a:hover,
35
- ul li.active a {
27
+ ul .active a {
36
28
  background-color: #333;
37
29
  background-color: rgba(255,255,255,.05);
38
30
  color: $white;
@@ -41,7 +33,7 @@
41
33
 
42
34
  // Website name
43
35
  h3 {
44
- position:relative;
36
+ position: relative;
45
37
  a {
46
38
  float: left;
47
39
  display: block;
@@ -60,192 +52,331 @@
60
52
  margin: 5px 0 0 0;
61
53
  position: relative;
62
54
  @include opacity(100);
63
- input {
64
- background-color: #444;
65
- background-color: rgba(255,255,255,.3);
66
- @include sans-serif(13px, normal, 1);
67
- width: 220px;
68
- padding: 4px 9px;
55
+ }
56
+ input {
57
+ background-color: #444;
58
+ background-color: rgba(255,255,255,.3);
59
+ @include sans-serif(13px, normal, 1);
60
+ padding: 4px 9px;
61
+ color: #fff;
62
+ color: rgba(255,255,255,.75);
63
+ border: 1px solid #111;
64
+ @include border-radius(4px);
65
+ $shadow: inset 0 1px 2px rgba(0,0,0,.1), 0 1px 0px rgba(255,255,255,.25);
66
+ @include box-shadow($shadow);
67
+ @include transition(none);
68
+
69
+ // Placeholder text gets special styles; can't be bundled together though for some reason
70
+ &:-moz-placeholder {
71
+ color: $grayLighter;
72
+ }
73
+ &::-webkit-input-placeholder {
74
+ color: $grayLighter;
75
+ }
76
+ // Hover states
77
+ &:hover {
78
+ background-color: $grayLight;
79
+ background-color: rgba(255,255,255,.5);
69
80
  color: #fff;
70
- color: rgba(255,255,255,.75);
71
- border: 1px solid #111;
72
- @include border-radius(4px);
73
- $shadow: inset 0 1px 2px rgba(0,0,0,.1), 0 1px 0px rgba(255,255,255,.25);
74
- @include box-shadow($shadow);
75
- @include transition(none);
81
+ }
82
+ // Focus states (we use .focused since IE8 and down doesn't support :focus)
83
+ &:focus,
84
+ &.focused {
85
+ outline: none;
86
+ background-color: #fff;
87
+ color: $grayDark;
88
+ text-shadow: 0 1px 0 #fff;
89
+ border: 0;
90
+ padding: 5px 10px;
91
+ @include box-shadow(0 0 3px rgba(0,0,0,.15));
92
+ }
93
+ }
94
+ }
76
95
 
77
- // Placeholder text gets special styles; can't be bundled together though for some reason
78
- &:-moz-placeholder {
79
- color: $grayLighter;
80
- }
81
- &::-webkit-input-placeholder {
82
- color: $grayLighter;
96
+ // gradient is applied to it's own element because overflow visible is not honored by ie when filter is present
97
+ // For backwards compatability, include .topbar .fill
98
+ .topbar-inner,
99
+ .topbar .fill {
100
+ background-color: #222;
101
+ @include vertical(#333, #222);
102
+ $shadow: 0 1px 3px rgba(0,0,0,.25), inset 0 -1px 0 rgba(0,0,0,.1);
103
+ @include box-shadow($shadow);
104
+ }
105
+
106
+
107
+ // NAVIGATION
108
+ // ----------
109
+
110
+ // Topbar Nav
111
+ // ul.nav for all topbar based navigation to avoid inheritance issues and over-specificity
112
+ // For backwards compatibility, leave in .topbar div > ul
113
+ .topbar div > ul,
114
+ .nav {
115
+ display: block;
116
+ float: left;
117
+ margin: 0 10px 0 0;
118
+ position: relative;
119
+ left: 0;
120
+ > li {
121
+ display: block;
122
+ float: left;
123
+ }
124
+ a {
125
+ display: block;
126
+ float: none;
127
+ padding: 10px 10px 11px;
128
+ line-height: 19px;
129
+ text-decoration: none;
130
+ &:hover {
131
+ color: #fff;
132
+ text-decoration: none;
133
+ }
134
+ }
135
+ .active a {
136
+ background-color: #222;
137
+ background-color: rgba(0,0,0,.5);
138
+ }
139
+
140
+ // Secondary (floated right) nav in topbar
141
+ &.secondary-nav {
142
+ float: right;
143
+ margin-left: 10px;
144
+ margin-right: 0;
145
+ // backwards compatibility
146
+ .menu-dropdown,
147
+ .dropdown-menu {
148
+ right: 0;
149
+ }
150
+ }
151
+ // Dropdowns within the .nav
152
+ // a.menu:hover and li.open .menu for backwards compatibility
153
+ a.menu:hover,
154
+ li.open .menu,
155
+ .dropdown-toggle:hover,
156
+ .dropdown.open .dropdown-toggle {
157
+ background: #444;
158
+ background: rgba(255,255,255,.05);
159
+ }
160
+ // .menu-dropdown for backwards compatibility
161
+ .menu-dropdown,
162
+ .dropdown-menu {
163
+ background-color: #333;
164
+ // a.menu for backwards compatibility
165
+ a.menu,
166
+ .dropdown-toggle {
167
+ color: #fff;
168
+ &.open {
169
+ background: #444;
170
+ background: rgba(255,255,255,.05);
83
171
  }
84
- // Hover states
172
+ }
173
+ li a {
174
+ color: #999;
175
+ text-shadow: 0 1px 0 rgba(0,0,0,.5);
85
176
  &:hover {
86
- background-color: $grayLight;
87
- background-color: rgba(255,255,255,.5);
177
+ @include vertical(#292929,#191919);
88
178
  color: #fff;
89
179
  }
90
- // Focus states (we use .focused since IE8 and down doesn't support :focus)
91
- &:focus,
92
- &.focused {
93
- outline: none;
94
- background-color: #fff;
95
- color: $grayDark;
96
- text-shadow: 0 1px 0 #fff;
97
- border: 0;
98
- padding: 5px 10px;
99
- @include box-shadow(0 0 3px rgba(0,0,0,.15));
100
- }
180
+ }
181
+ .divider {
182
+ background-color: #222;
183
+ border-color: #444;
101
184
  }
102
185
  }
186
+ }
103
187
 
104
- // Navigation
105
- ul {
188
+ // For backwards compatability with new dropdowns, redeclare dropdown link padding
189
+ .topbar ul .menu-dropdown li a,
190
+ .topbar ul .dropdown-menu li a {
191
+ padding: 4px 15px;
192
+ }
193
+
194
+ // Dropdown Menus
195
+ // Use the .menu class on any <li> element within the topbar or ul.tabs and you'll get some superfancy dropdowns
196
+ // li.menu for backwards compatibility
197
+ li.menu,
198
+ .dropdown {
199
+ position: relative;
200
+ }
201
+ // The link that is clicked to toggle the dropdown
202
+ // a.menu for backwards compatibility
203
+ a.menu:after,
204
+ .dropdown-toggle:after {
205
+ width: 0;
206
+ height: 0;
207
+ display: inline-block;
208
+ content: "&darr;";
209
+ text-indent: -99999px;
210
+ vertical-align: top;
211
+ margin-top: 8px;
212
+ margin-left: 4px;
213
+ border-left: 4px solid transparent;
214
+ border-right: 4px solid transparent;
215
+ border-top: 4px solid #fff;
216
+ @include opacity(50);
217
+ }
218
+ // The dropdown menu (ul)
219
+ // .menu-dropdown for backwards compatibility
220
+ .menu-dropdown,
221
+ .dropdown-menu {
222
+ background-color: #fff;
223
+ float: left;
224
+ display: none; // None by default, but block on "open" of the menu
225
+ position: absolute;
226
+ top: 40px;
227
+ min-width: 160px;
228
+ max-width: 220px;
229
+ _width: 160px;
230
+ margin-left: 0; // override default ul styles
231
+ margin-right: 0;
232
+ padding: 6px 0;
233
+ zoom: 1; // do we need this?
234
+ border-color: #999;
235
+ border-color: rgba(0,0,0,.2);
236
+ border-style: solid;
237
+ border-width: 0 1px 1px;
238
+ @include border-radius(0 0 6px 6px);
239
+ @include box-shadow(0 2px 4px rgba(0,0,0,.2));
240
+ @include background-clip(padding-box);
241
+
242
+ // Unfloat any li's to make them stack
243
+ li {
244
+ float: none;
106
245
  display: block;
107
- float: left;
108
- margin: 0 10px 0 0;
109
- position: relative;
110
- &.secondary-nav {
111
- float: right;
112
- margin-left: 10px;
113
- margin-right: 0;
246
+ background-color: none;
247
+ }
248
+ // Dividers (basically an hr) within the dropdown
249
+ .divider {
250
+ height: 1px;
251
+ margin: 5px 0;
252
+ overflow: hidden;
253
+ background-color: #eee;
254
+ border-bottom: 1px solid #fff;
255
+ }
256
+ }
257
+
258
+ .topbar .dropdown-menu, .dropdown-menu {
259
+ // Links within the dropdown menu
260
+ a {
261
+ display: block;
262
+ padding: 4px 15px;
263
+ clear: both;
264
+ font-weight: normal;
265
+ line-height: 18px;
266
+ color: $gray;
267
+ text-shadow: 0 1px 0 #fff;
268
+ // Hover state
269
+ &:hover {
270
+ @include vertical(#eeeeee, #dddddd);
271
+ color: $grayDark;
272
+ text-decoration: none;
273
+ $shadow: inset 0 1px 0 rgba(0,0,0,.025), inset 0 -1px rgba(0,0,0,.025);
274
+ @include box-shadow($shadow);
114
275
  }
115
- li {
276
+ }
277
+ }
278
+
279
+ // Open state for the dropdown
280
+ // .open for backwards compatibility
281
+ .open,
282
+ .dropdown.open {
283
+ // .menu for backwards compatibility
284
+ .menu,
285
+ .dropdown-toggle {
286
+ color: #fff;
287
+ background: #ccc;
288
+ background: rgba(0,0,0,.3);
289
+ }
290
+ // .menu-dropdown for backwards compatibility
291
+ .menu-dropdown,
292
+ .dropdown-menu {
293
+ display: block;
294
+ }
295
+ }
296
+
297
+
298
+ // Tabs and Pills
299
+ .tabs,
300
+ .pills {
301
+ margin: 0 0 20px;
302
+ padding: 0;
303
+ list-style: none;
304
+ @include cft();
305
+ > li {
306
+ float: left;
307
+ > a {
116
308
  display: block;
117
- float: left;
118
- font-size: 13px;
119
- a {
120
- display: block;
121
- float: none;
122
- padding: 10px 10px 11px;
123
- line-height: 19px;
124
- text-decoration: none;
125
- &:hover {
126
- color: #fff;
127
- text-decoration: none;
128
- }
129
- }
130
- &.active a {
131
- background-color: #222;
132
- background-color: rgba(0,0,0,.5);
133
- }
134
309
  }
310
+ }
311
+ }
135
312
 
136
- // Dropdowns
137
- &.primary-nav li ul {
138
- left: 0;
139
- }
140
- &.secondary-nav li ul {
141
- right: 0;
142
- }
143
- li.menu {
144
- position: relative;
145
- a.menu {
146
- &:after {
147
- width: 0px;
148
- height: 0px;
149
- display: inline-block;
150
- content: "&darr;";
151
- text-indent: -99999px;
152
- vertical-align: top;
153
- margin-top: 8px;
154
- margin-left: 4px;
155
- border-left: 4px solid transparent;
156
- border-right: 4px solid transparent;
157
- border-top: 4px solid #fff;
158
- @include opacity(50);
159
- }
160
- }
161
- &.open {
162
- a.menu,
163
- a:hover {
164
- background-color: #444;
165
- background-color: rgba(255,255,255,.1);
166
- *background-color: #444; /* IE6-7 */
167
- color: #fff;
168
- }
169
- ul {
170
- display: block;
171
- li {
172
- a {
173
- background-color: transparent;
174
- font-weight: normal;
175
- &:hover {
176
- background-color: rgba(255,255,255,.1);
177
- *background-color: #444; /* IE6-7 */
178
- color: #fff;
179
- }
180
- }
181
- &.active a {
182
- background-color: rgba(255,255,255,.1);
183
- font-weight: bold;
184
- }
185
- }
186
- }
313
+ // Basic Tabs
314
+ .tabs {
315
+ width: 100%;
316
+ border-bottom: 1px solid #ddd;
317
+ > li {
318
+ position: relative; // For the dropdowns mostly
319
+ top: 1px;
320
+ > a {
321
+ margin-right: 2px;
322
+ padding: 0 15px;
323
+ line-height: ($baseline * 2) - 1;
324
+ @include border-radius(4px 4px 0 0);
325
+ &:hover {
326
+ background-color: #eee;
327
+ border-bottom: 1px solid #ddd;
328
+ text-decoration: none;
187
329
  }
188
330
  }
189
- li ul {
190
- background-color: #333;
191
- float: left;
192
- display: none;
193
- position: absolute;
194
- top: 40px;
195
- min-width: 160px;
196
- max-width: 220px;
197
- _width: 160px;
198
- margin-left: 0;
199
- margin-right: 0;
200
- padding: 0;
201
- text-align: left;
202
- border: 0;
203
- zoom: 1;
204
- @include border-radius(0 0 5px 5px);
205
- @include box-shadow(0 1px 2px rgba(0,0,0,0.6));
206
- li {
207
- float: none;
208
- clear: both;
209
- display: block;
210
- background: none;
211
- font-size: 12px;
212
- a {
213
- display: block;
214
- padding: 6px 15px;
215
- clear: both;
216
- font-weight: normal;
217
- line-height: 19px;
218
- color: #bbb;
219
- &:hover {
220
- background-color: #333;
221
- background-color: rgba(255,255,255,.25);
222
- color: #fff;
223
- }
224
- }
225
-
226
- // Dividers (basically an hr)
227
- &.divider {
228
- height: 1px;
229
- overflow: hidden;
230
- background: #222;
231
- background: rgba(0,0,0,.2);
232
- border-bottom: 1px solid rgba(255,255,255,.1);
233
- margin: 5px 0;
234
- }
235
-
236
- // Section separaters
237
- span {
238
- clear: both;
239
- display: block;
240
- background: rgba(0,0,0,.2);
241
- padding: 6px 15px;
242
- cursor: default;
243
- color: $gray;
244
- border-top: 1px solid rgba(0,0,0,.2);
245
- }
246
- }
331
+ &.active > a {
332
+ background-color: #fff;
333
+ padding: 0 14px;
334
+ border: 1px solid #ddd;
335
+ border-bottom: 0;
336
+ color: $gray;
247
337
  }
248
338
  }
339
+ // first one for backwards compatibility
340
+ .menu-dropdown,
341
+ .dropdown-menu {
342
+ top: 35px;
343
+ border-width: 1px;
344
+ @include border-radius(0 6px 6px 6px);
345
+ }
346
+ // first one for backwards compatibility
347
+ a.menu:after,
348
+ .dropdown-toggle:after {
349
+ border-top-color: #999;
350
+ margin-top: 15px;
351
+ margin-left: 5px;
352
+ }
353
+ // first one for backwards compatibility
354
+ li.open a.menu:after,
355
+ .dropdown.open .dropdown-toggle:after {
356
+ border-top-color: #555;
357
+ }
358
+ }
359
+
360
+ // Basic pill nav
361
+ .pills {
362
+ a {
363
+ margin: 5px 3px 5px 0;
364
+ padding: 0 15px;
365
+ text-shadow: 0 1px 1px #fff;
366
+ line-height: 30px;
367
+ @include border-radius(15px);
368
+ &:hover {
369
+ background: $linkColorHover;
370
+ color: #fff;
371
+ text-decoration: none;
372
+ text-shadow: 0 1px 1px rgba(0,0,0,.25);
373
+ }
374
+ }
375
+ .active a {
376
+ background: $linkColor;
377
+ color: #fff;
378
+ text-shadow: 0 1px 1px rgba(0,0,0,.25);
379
+ }
249
380
  }
250
381
 
251
382
 
@@ -276,6 +407,7 @@ footer {
276
407
  border-top: 1px solid #eee;
277
408
  }
278
409
 
410
+
279
411
  // PAGE HEADERS
280
412
  // ------------
281
413
 
@@ -288,16 +420,16 @@ footer {
288
420
  }
289
421
  }
290
422
 
423
+
291
424
  // BUTTON STYLES
292
425
  // -------------
293
426
 
294
-
295
427
  // Base .btn styles
296
428
  .btn {
297
429
  // Button Base
298
430
  cursor: pointer;
299
431
  display: inline-block;
300
- @include vertical-three-colors(#fff, #fff, 0.25, darken(#fff, 10%));
432
+ @include vertical-three-colors(#ffffff, #ffffff, 25%, darken(#ffffff, 10%)); // Don't use .gradientbar() here since it does a three-color gradient
301
433
  padding: 5px 14px 6px;
302
434
  text-shadow: 0 1px 1px rgba(255,255,255,.75);
303
435
  color: #333;
@@ -322,27 +454,28 @@ footer {
322
454
  }
323
455
 
324
456
  // Transitions
325
- //@include transition(.1s linear all);
326
- @include single-transition(all, .1s, linear);
457
+ @include transition(.1s linear all);
327
458
 
328
459
  // Active and Disabled states
460
+ &:active {
461
+ $shadow: inset 0 2px 4px rgba(0,0,0,.25), 0 1px 2px rgba(0,0,0,.05);
462
+ @include box-shadow($shadow);
463
+ }
329
464
  &.disabled {
330
465
  cursor: default;
331
466
  background-image: none;
467
+ @include reset-filter;
332
468
  @include opacity(65);
469
+ @include box-shadow(none);
333
470
  }
334
-
335
- &:disabled {
471
+ &[disabled] {
336
472
  // disabled pseudo can't be included with .disabled
337
473
  // def because IE8 and below will drop it ;_;
338
474
  cursor: default;
339
475
  background-image: none;
476
+ @include reset-filter;
340
477
  @include opacity(65);
341
- }
342
-
343
- &:active {
344
- $shadow: inset 0 3px 7px rgba(0,0,0,.1), 0 1px 2px rgba(0,0,0,.05);
345
- @include box-shadow($shadow);
478
+ @include box-shadow(none);
346
479
  }
347
480
 
348
481
  // Button Sizes
@@ -352,12 +485,15 @@ footer {
352
485
  padding: 9px 14px 9px;
353
486
  @include border-radius(6px);
354
487
  }
355
-
356
488
  &.small {
357
489
  padding: 7px 9px 7px;
358
490
  font-size: 11px;
359
491
  }
360
-
492
+ }
493
+ // Super jank hack for removing border-radius from IE9 so we can keep filter gradients on alerts and buttons
494
+ :root .alert-message,
495
+ :root .btn {
496
+ border-radius: 0 \0;
361
497
  }
362
498
 
363
499
  // Help Firefox not be a jerk about adding extra padding to buttons
@@ -370,7 +506,6 @@ input[type=submit].btn {
370
506
  }
371
507
 
372
508
 
373
-
374
509
  // ERROR STYLES
375
510
  // ------------
376
511
 
@@ -420,6 +555,7 @@ input[type=submit].btn {
420
555
  &.block-message {
421
556
  background-image: none;
422
557
  background-color: lighten(#fceec1, 5%);
558
+ @include reset-filter;
423
559
  padding: 14px;
424
560
  border-color: #fceec1;
425
561
  @include box-shadow(none);
@@ -451,74 +587,6 @@ input[type=submit].btn {
451
587
  }
452
588
  }
453
589
 
454
- // NAVIGATION
455
- // ----------
456
-
457
- // Common tab and pill styles
458
- .tabs,
459
- .pills {
460
- margin: 0 0 20px;
461
- padding: 0;
462
- @include clearfix();
463
- li {
464
- display: inline;
465
- a {
466
- float: left;
467
- width: auto;
468
- }
469
- }
470
- }
471
-
472
- // Basic Tabs
473
- .tabs {
474
- width: 100%;
475
- border-bottom: 1px solid $grayLight;
476
- li {
477
- a {
478
- margin-bottom: -1px;
479
- margin-right: 2px;
480
- padding: 0 15px;
481
- line-height: ($baseline * 2) - 1;
482
- @include border-radius(3px 3px 0 0);
483
- &:hover {
484
- background-color: $grayLighter;
485
- border-bottom: 1px solid $grayLight;
486
- }
487
- }
488
- &.active a {
489
- background-color: #fff;
490
- padding: 0 14px;
491
- border: 1px solid #ccc;
492
- border-bottom: 0;
493
- color: $gray;
494
- }
495
- }
496
- }
497
-
498
- // Basic pill nav
499
- .pills {
500
- li {
501
- a {
502
- margin: 5px 3px 5px 0;
503
- padding: 0 15px;
504
- text-shadow: 0 1px 1px #fff;
505
- line-height: 30px;
506
- @include border-radius(15px);
507
- &:hover {
508
- background: $linkColorHover;
509
- color: #fff;
510
- text-decoration: none;
511
- text-shadow: 0 1px 1px rgba(0,0,0,.25);
512
- }
513
- }
514
- &.active a {
515
- background: $linkColor;
516
- color: #fff;
517
- text-shadow: 0 1px 1px rgba(0,0,0,.25);
518
- }
519
- }
520
- }
521
-
522
590
 
523
591
  // PAGINATION
524
592
  // ----------
@@ -533,31 +601,31 @@ input[type=submit].btn {
533
601
  border: 1px solid rgba(0,0,0,.15);
534
602
  @include border-radius(3px);
535
603
  @include box-shadow(0 1px 2px rgba(0,0,0,.05));
536
- li {
537
- display: inline;
538
- a {
539
- float: left;
540
- padding: 0 14px;
541
- line-height: ($baseline * 2) - 2;
542
- border-right: 1px solid;
543
- border-right-color: #ddd;
544
- border-right-color: rgba(0,0,0,.15);
545
- *border-right-color: #ddd; /* IE6-7 */
546
- text-decoration: none;
547
- }
548
- a:hover,
549
- &.active a {
550
- background-color: lighten($blue, 45%);
551
- }
552
- &.disabled a,
553
- &.disabled a:hover {
554
- background-color: transparent;
555
- color: $grayLight;
556
- }
557
- &.next a {
558
- border: 0;
559
- }
560
- }
604
+ }
605
+ li {
606
+ display: inline;
607
+ }
608
+ a {
609
+ float: left;
610
+ padding: 0 14px;
611
+ line-height: ($baseline * 2) - 2;
612
+ border-right: 1px solid;
613
+ border-right-color: #ddd;
614
+ border-right-color: rgba(0,0,0,.15);
615
+ *border-right-color: #ddd; /* IE6-7 */
616
+ text-decoration: none;
617
+ }
618
+ a:hover,
619
+ .active a {
620
+ background-color: lighten($blue, 45%);
621
+ }
622
+ .disabled a,
623
+ .disabled a:hover {
624
+ background-color: transparent;
625
+ color: $grayLight;
626
+ }
627
+ .next a {
628
+ border: 0;
561
629
  }
562
630
  }
563
631
 
@@ -603,33 +671,33 @@ input[type=submit].btn {
603
671
  @include border-radius(6px);
604
672
  @include box-shadow(0 3px 7px rgba(0,0,0,0.3));
605
673
  @include background-clip(padding-box);
606
- .modal-header {
607
- border-bottom: 1px solid #eee;
608
- padding: 5px 20px;
609
- .close {
610
- position: absolute;
611
- right: 10px;
612
- top: 10px;
613
- color: #999;
614
- line-height:10px;
615
- font-size: 18px;
616
- }
617
- }
618
- .modal-body {
619
- padding: 20px;
674
+ }
675
+ .modal-header {
676
+ border-bottom: 1px solid #eee;
677
+ padding: 5px 20px;
678
+ .close {
679
+ position: absolute;
680
+ right: 10px;
681
+ top: 10px;
682
+ color: #999;
683
+ line-height:10px;
684
+ font-size: 18px;
620
685
  }
621
- .modal-footer {
622
- background-color: #f5f5f5;
623
- padding: 14px 20px 15px;
624
- border-top: 1px solid #ddd;
625
- @include border-radius(0 0 6px 6px);
626
- @include box-shadow(inset 0 1px 0 #fff);
627
- @include clearfix();
628
- margin-bottom: 0;
629
- .btn {
630
- float: right;
631
- margin-left: 10px;
632
- }
686
+ }
687
+ .modal-body {
688
+ padding: 20px;
689
+ }
690
+ .modal-footer {
691
+ background-color: #f5f5f5;
692
+ padding: 14px 20px 15px;
693
+ border-top: 1px solid #ddd;
694
+ @include border-radius(0 0 6px 6px);
695
+ @include box-shadow(inset 0 1px 0 #fff);
696
+ @include clearfix();
697
+ margin-bottom: 0;
698
+ .btn {
699
+ float: right;
700
+ margin-left: 10px;
633
701
  }
634
702
  }
635
703
 
@@ -687,20 +755,20 @@ input[type=submit].btn {
687
755
  &.left .twipsy-arrow { @include popover-arrow-left(); }
688
756
  &.below .twipsy-arrow { @include popover-arrow-below(); }
689
757
  &.right .twipsy-arrow { @include popover-arrow-right(); }
690
- .twipsy-inner {
691
- padding: 3px 8px;
692
- background-color: #000;
693
- color: white;
694
- text-align: center;
695
- max-width: 200px;
696
- text-decoration: none;
697
- @include border-radius(4px);
698
- }
699
- .twipsy-arrow {
700
- position: absolute;
701
- width: 0;
702
- height: 0;
703
- }
758
+ }
759
+ .twipsy-inner {
760
+ padding: 3px 8px;
761
+ background-color: #000;
762
+ color: white;
763
+ text-align: center;
764
+ max-width: 200px;
765
+ text-decoration: none;
766
+ @include border-radius(4px);
767
+ }
768
+ .twipsy-arrow {
769
+ position: absolute;
770
+ width: 0;
771
+ height: 0;
704
772
  }
705
773
 
706
774
 
@@ -724,9 +792,8 @@ input[type=submit].btn {
724
792
  height: 0;
725
793
  }
726
794
  .inner {
727
- background-color: #333;
728
- background-color: rgba(0,0,0,.8);
729
- *background-color: #333; /* IE 6-7 */
795
+ background: #333;
796
+ background: rgba(0,0,0,.8);
730
797
  padding: 3px;
731
798
  overflow: hidden;
732
799
  width: 280px;
@@ -749,4 +816,4 @@ input[type=submit].btn {
749
816
  margin-bottom: 0;
750
817
  }
751
818
  }
752
- }
819
+ }