less-rails-bootstrap 2.0.6 → 2.0.7

Sign up to get free protection for your applications and to get access to all the features.
Files changed (46) hide show
  1. data/CHANGELOG.md +5 -0
  2. data/README.md +3 -35
  3. data/lib/less/rails/bootstrap/version.rb +1 -1
  4. data/vendor/assets/javascripts/twitter/bootstrap/alert.js +1 -1
  5. data/vendor/assets/javascripts/twitter/bootstrap/button.js +4 -2
  6. data/vendor/assets/javascripts/twitter/bootstrap/carousel.js +7 -3
  7. data/vendor/assets/javascripts/twitter/bootstrap/collapse.js +4 -2
  8. data/vendor/assets/javascripts/twitter/bootstrap/dropdown.js +1 -1
  9. data/vendor/assets/javascripts/twitter/bootstrap/modal.js +1 -1
  10. data/vendor/assets/javascripts/twitter/bootstrap/popover.js +1 -1
  11. data/vendor/assets/javascripts/twitter/bootstrap/scrollspy.js +1 -1
  12. data/vendor/assets/javascripts/twitter/bootstrap/tab.js +1 -1
  13. data/vendor/assets/javascripts/twitter/bootstrap/tooltip.js +2 -2
  14. data/vendor/assets/javascripts/twitter/bootstrap/transition.js +1 -1
  15. data/vendor/assets/javascripts/twitter/bootstrap/typeahead.js +7 -7
  16. data/vendor/frameworks/twitter/bootstrap/alerts.less +2 -14
  17. data/vendor/frameworks/twitter/bootstrap/badges.less +36 -0
  18. data/vendor/frameworks/twitter/bootstrap/bootstrap.less +2 -1
  19. data/vendor/frameworks/twitter/bootstrap/breadcrumbs.less +2 -0
  20. data/vendor/frameworks/twitter/bootstrap/button-groups.less +31 -7
  21. data/vendor/frameworks/twitter/bootstrap/buttons.less +17 -13
  22. data/vendor/frameworks/twitter/bootstrap/code.less +2 -2
  23. data/vendor/frameworks/twitter/bootstrap/component-animations.less +4 -2
  24. data/vendor/frameworks/twitter/bootstrap/dropdowns.less +45 -27
  25. data/vendor/frameworks/twitter/bootstrap/forms.less +78 -45
  26. data/vendor/frameworks/twitter/bootstrap/grid.less +2 -5
  27. data/vendor/frameworks/twitter/bootstrap/hero-unit.less +3 -1
  28. data/vendor/frameworks/twitter/bootstrap/labels.less +8 -2
  29. data/vendor/frameworks/twitter/bootstrap/mixins.less +189 -165
  30. data/vendor/frameworks/twitter/bootstrap/modals.less +12 -5
  31. data/vendor/frameworks/twitter/bootstrap/navbar.less +77 -35
  32. data/vendor/frameworks/twitter/bootstrap/navs.less +19 -9
  33. data/vendor/frameworks/twitter/bootstrap/pager.less +6 -0
  34. data/vendor/frameworks/twitter/bootstrap/pagination.less +1 -0
  35. data/vendor/frameworks/twitter/bootstrap/progress-bars.less +15 -1
  36. data/vendor/frameworks/twitter/bootstrap/reset.less +1 -1
  37. data/vendor/frameworks/twitter/bootstrap/responsive.less +72 -28
  38. data/vendor/frameworks/twitter/bootstrap/scaffolding.less +4 -4
  39. data/vendor/frameworks/twitter/bootstrap/sprites.less +3 -3
  40. data/vendor/frameworks/twitter/bootstrap/tables.less +26 -17
  41. data/vendor/frameworks/twitter/bootstrap/type.less +22 -6
  42. data/vendor/frameworks/twitter/bootstrap/variables.less +100 -6
  43. data/vendor/frameworks/twitter/bootstrap/wells.less +10 -0
  44. metadata +6 -7
  45. data/vendor/frameworks/twitter/bootstrap/patterns.less +0 -13
  46. data/vendor/frameworks/twitter/bootstrap/print.less +0 -18
@@ -8,6 +8,7 @@
8
8
  // Core
9
9
  .btn {
10
10
  display: inline-block;
11
+ .ie7-inline-block();
11
12
  padding: 4px 10px 4px;
12
13
  margin-bottom: 0; // For input.btn
13
14
  font-size: @baseFontSize;
@@ -16,16 +17,15 @@
16
17
  text-align: center;
17
18
  text-shadow: 0 1px 1px rgba(255,255,255,.75);
18
19
  vertical-align: middle;
19
- .buttonBackground(@white, darken(@white, 10%));
20
- border: 1px solid #ccc;
21
- border-bottom-color: #bbb;
20
+ .buttonBackground(@btnBackground, @btnBackgroundHighlight);
21
+ border: 1px solid @btnBorder;
22
+ border-bottom-color: darken(@btnBorder, 10%);
22
23
  .border-radius(4px);
23
24
  @shadow: inset 0 1px 0 rgba(255,255,255,.2), 0 1px 2px rgba(0,0,0,.05);
24
25
  .box-shadow(@shadow);
25
26
  cursor: pointer;
26
27
 
27
28
  // Give IE7 some love
28
- .reset-filter();
29
29
  .ie7-restore-left-whitespace();
30
30
  }
31
31
 
@@ -126,34 +126,34 @@
126
126
  .btn-danger.active,
127
127
  .btn-success.active,
128
128
  .btn-info.active,
129
- .btn-dark.active {
129
+ .btn-inverse.active {
130
130
  color: rgba(255,255,255,.75);
131
131
  }
132
132
 
133
133
  // Set the backgrounds
134
134
  // -------------------------
135
135
  .btn-primary {
136
- .buttonBackground(@primaryButtonBackground, spin(@primaryButtonBackground, 20));
136
+ .buttonBackground(@btnPrimaryBackground, @btnPrimaryBackgroundHighlight);
137
137
  }
138
138
  // Warning appears are orange
139
139
  .btn-warning {
140
- .buttonBackground(lighten(@orange, 15%), @orange);
140
+ .buttonBackground(@btnWarningBackground, @btnWarningBackgroundHighlight);
141
141
  }
142
142
  // Danger and error appear as red
143
143
  .btn-danger {
144
- .buttonBackground(#ee5f5b, #bd362f);
144
+ .buttonBackground(@btnDangerBackground, @btnDangerBackgroundHighlight);
145
145
  }
146
146
  // Success appears as green
147
147
  .btn-success {
148
- .buttonBackground(#62c462, #51a351);
148
+ .buttonBackground(@btnSuccessBackground, @btnSuccessBackgroundHighlight);
149
149
  }
150
150
  // Info appears as a neutral blue
151
151
  .btn-info {
152
- .buttonBackground(#5bc0de, #2f96b4);
152
+ .buttonBackground(@btnInfoBackground, @btnInfoBackgroundHighlight);
153
153
  }
154
154
  // Inverse appears as dark gray
155
155
  .btn-inverse {
156
- .buttonBackground(#454545, #262626);
156
+ .buttonBackground(@btnInverseBackground, @btnInverseBackgroundHighlight);
157
157
  }
158
158
 
159
159
 
@@ -172,12 +172,16 @@ input[type="submit"].btn {
172
172
  // IE7 has some default padding on button controls
173
173
  *padding-top: 2px;
174
174
  *padding-bottom: 2px;
175
- &.large {
175
+ &.btn-large {
176
176
  *padding-top: 7px;
177
177
  *padding-bottom: 7px;
178
178
  }
179
- &.small {
179
+ &.btn-small {
180
180
  *padding-top: 3px;
181
181
  *padding-bottom: 3px;
182
182
  }
183
+ &.btn-mini {
184
+ *padding-top: 1px;
185
+ *padding-bottom: 1px;
186
+ }
183
187
  }
@@ -14,7 +14,7 @@ pre {
14
14
 
15
15
  // Inline code
16
16
  code {
17
- padding: 3px 4px;
17
+ padding: 2px 4px;
18
18
  color: #d14;
19
19
  background-color: #f7f7f9;
20
20
  border: 1px solid #e1e1e8;
@@ -25,7 +25,7 @@ pre {
25
25
  display: block;
26
26
  padding: (@baseLineHeight - 1) / 2;
27
27
  margin: 0 0 @baseLineHeight / 2;
28
- font-size: 12px;
28
+ font-size: @baseFontSize * .925; // 13px to 12px
29
29
  line-height: @baseLineHeight;
30
30
  background-color: #f5f5f5;
31
31
  border: 1px solid #ccc; // fallback for IE7-8
@@ -14,5 +14,7 @@
14
14
  position:relative;
15
15
  overflow:hidden;
16
16
  height: 0;
17
- &.in { height: auto; }
18
- }
17
+ &.in {
18
+ height: auto;
19
+ }
20
+ }
@@ -13,22 +13,22 @@
13
13
  .open .dropdown-toggle {
14
14
  outline: 0;
15
15
  }
16
+
16
17
  // Dropdown arrow/caret
18
+ // --------------------
17
19
  .caret {
18
20
  display: inline-block;
19
21
  width: 0;
20
22
  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
23
  vertical-align: top;
26
24
  border-left: 4px solid transparent;
27
25
  border-right: 4px solid transparent;
28
26
  border-top: 4px solid @black;
29
27
  .opacity(30);
30
- content: "\2193";
28
+ content: "";
31
29
  }
30
+
31
+ // Place the caret
32
32
  .dropdown .caret {
33
33
  margin-top: 8px;
34
34
  margin-left: 2px;
@@ -37,7 +37,9 @@
37
37
  .open.dropdown .caret {
38
38
  .opacity(100);
39
39
  }
40
+
40
41
  // The dropdown menu (ul)
42
+ // ----------------------
41
43
  .dropdown-menu {
42
44
  position: absolute;
43
45
  top: 100%;
@@ -46,11 +48,10 @@
46
48
  float: left;
47
49
  display: none; // none by default, but block on "open" of the menu
48
50
  min-width: 160px;
49
- _width: 160px;
50
51
  padding: 4px 0;
51
52
  margin: 0; // override default ul
52
53
  list-style: none;
53
- background-color: @white;
54
+ background-color: @dropdownBackground;
54
55
  border-color: #ccc;
55
56
  border-color: rgba(0,0,0,.2);
56
57
  border-style: solid;
@@ -63,27 +64,15 @@
63
64
  *border-right-width: 2px;
64
65
  *border-bottom-width: 2px;
65
66
 
66
- // Allow for dropdowns to go bottom up (aka, dropup-menu)
67
- &.bottom-up {
68
- top: auto;
69
- bottom: 100%;
70
- margin-bottom: 2px;
67
+ // Aligns the dropdown menu to right
68
+ &.pull-right {
69
+ right: 0;
70
+ left: auto;
71
71
  }
72
72
 
73
73
  // Dividers (basically an hr) within the dropdown
74
74
  .divider {
75
- height: 1px;
76
- margin: 5px 1px;
77
- overflow: hidden;
78
- background-color: #e5e5e5;
79
- border-bottom: 1px solid @white;
80
-
81
- // IE7 needs a set width since we gave a height. Restricting just
82
- // to IE7 to keep the 1px left/right space in other browsers.
83
- // It is unclear where IE is getting the extra space that we need
84
- // to negative-margin away, but so it goes.
85
- *width: 100%;
86
- *margin: -5px 0 5px;
75
+ .nav-divider();
87
76
  }
88
77
 
89
78
  // Links within the dropdown menu
@@ -93,21 +82,23 @@
93
82
  clear: both;
94
83
  font-weight: normal;
95
84
  line-height: @baseLineHeight;
96
- color: @gray;
85
+ color: @dropdownLinkColor;
97
86
  white-space: nowrap;
98
87
  }
99
88
  }
100
89
 
101
90
  // Hover state
91
+ // -----------
102
92
  .dropdown-menu li > a:hover,
103
93
  .dropdown-menu .active > a,
104
94
  .dropdown-menu .active > a:hover {
105
- color: @white;
95
+ color: @dropdownLinkColorHover;
106
96
  text-decoration: none;
107
- background-color: @linkColor;
97
+ background-color: @dropdownLinkBackgroundHover;
108
98
  }
109
99
 
110
100
  // Open state for the dropdown
101
+ // ---------------------------
111
102
  .dropdown.open {
112
103
  // IE7's z-index only goes to the nearest positioned ancestor, which would
113
104
  // make the menu appear below buttons that appeared later on the page
@@ -123,7 +114,34 @@
123
114
  }
124
115
  }
125
116
 
117
+ // Right aligned dropdowns
118
+ .pull-right .dropdown-menu {
119
+ left: auto;
120
+ right: 0;
121
+ }
122
+
123
+ // Allow for dropdowns to go bottom up (aka, dropup-menu)
124
+ // ------------------------------------------------------
125
+ // Just add .dropup after the standard .dropdown class and you're set, bro.
126
+ // TODO: abstract this so that the navbar fixed styles are not placed here?
127
+ .dropup,
128
+ .navbar-fixed-bottom .dropdown {
129
+ // Reverse the caret
130
+ .caret {
131
+ border-top: 0;
132
+ border-bottom: 4px solid @black;
133
+ content: "\2191";
134
+ }
135
+ // Different positioning for bottom up menu
136
+ .dropdown-menu {
137
+ top: auto;
138
+ bottom: 100%;
139
+ margin-bottom: 1px;
140
+ }
141
+ }
142
+
126
143
  // Typeahead
144
+ // ---------
127
145
  .typeahead {
128
146
  margin-top: 2px; // give it some space to breathe
129
147
  .border-radius(4px);
@@ -48,7 +48,7 @@ input,
48
48
  button,
49
49
  select,
50
50
  textarea {
51
- #font > #family > .sans-serif(); // And only set font-family here for those that need it (note the missing label element)
51
+ font-family: @baseFontFamily; // And only set font-family here for those that need it (note the missing label element)
52
52
  }
53
53
 
54
54
  // Identify controls by their labels
@@ -71,7 +71,7 @@ select,
71
71
  font-size: @baseFontSize;
72
72
  line-height: @baseLineHeight;
73
73
  color: @gray;
74
- border: 1px solid #ccc;
74
+ border: 1px solid @inputBorder;
75
75
  .border-radius(3px);
76
76
  }
77
77
  .uneditable-textarea {
@@ -110,7 +110,7 @@ input[type="file"] {
110
110
  padding: initial;
111
111
  line-height: initial;
112
112
  border: initial;
113
- background-color: @white;
113
+ background-color: @inputBackground;
114
114
  background-color: initial;
115
115
  .box-shadow(none);
116
116
  }
@@ -139,7 +139,7 @@ input[type="file"] {
139
139
  // Chrome on Linux and Mobile Safari need background-color
140
140
  select {
141
141
  width: 220px; // default input width + 10px of padding that doesn't get applied
142
- background-color: @white;
142
+ background-color: @inputBackground;
143
143
  }
144
144
 
145
145
  // Make multiple select elements height not fixed
@@ -253,7 +253,7 @@ textarea[class*="span"],
253
253
  // GRID SIZING FOR INPUTS
254
254
  // ----------------------
255
255
 
256
- #inputGridSystem > .generate(@gridColumns, @gridColumnWidth, @gridGutterWidth);
256
+ #grid > .input (@gridColumnWidth, @gridGutterWidth);
257
257
 
258
258
 
259
259
 
@@ -268,7 +268,7 @@ textarea[disabled],
268
268
  input[readonly],
269
269
  select[readonly],
270
270
  textarea[readonly] {
271
- background-color: #f5f5f5;
271
+ background-color: @inputDisabledBackground;
272
272
  border-color: #ddd;
273
273
  cursor: not-allowed;
274
274
  }
@@ -301,7 +301,7 @@ select:focus:required:invalid {
301
301
  border-color: #ee5f5b;
302
302
  &:focus {
303
303
  border-color: darken(#ee5f5b, 10%);
304
- .box-shadow(0 0 6px lighten(#ee5f5b, 20%));
304
+ .box-shadow(0 0 6px lighten(#ee5f5b, 20%));
305
305
  }
306
306
  }
307
307
 
@@ -314,14 +314,15 @@ select:focus:required:invalid {
314
314
  padding: (@baseLineHeight - 1) 20px @baseLineHeight;
315
315
  margin-top: @baseLineHeight;
316
316
  margin-bottom: @baseLineHeight;
317
- background-color: #f5f5f5;
317
+ background-color: @grayLighter;
318
318
  border-top: 1px solid #ddd;
319
+ .clearfix(); // Adding clearfix to allow for .pull-right button containers
319
320
  }
320
321
 
321
322
  // For text that needs to appear as an input but should not be an input
322
323
  .uneditable-input {
323
324
  display: block;
324
- background-color: @white;
325
+ background-color: @inputBackground;
325
326
  border-color: #eee;
326
327
  .box-shadow(inset 0 1px 2px rgba(0,0,0,.025));
327
328
  cursor: not-allowed;
@@ -335,17 +336,19 @@ select:focus:required:invalid {
335
336
  // HELP TEXT
336
337
  // ---------
337
338
 
339
+ .help-block,
340
+ .help-inline {
341
+ color: @gray; // lighten the text some for contrast
342
+ }
343
+
338
344
  .help-block {
339
345
  display: block; // account for any element using help-block
340
- margin-top: 5px;
341
- margin-bottom: 0;
342
- color: @grayLight;
346
+ margin-bottom: @baseLineHeight / 2;
343
347
  }
344
348
 
345
349
  .help-inline {
346
350
  display: inline-block;
347
351
  .ie7-inline-block();
348
- margin-bottom: 9px;
349
352
  vertical-align: middle;
350
353
  padding-left: 5px;
351
354
  }
@@ -359,9 +362,10 @@ select:focus:required:invalid {
359
362
  .input-prepend,
360
363
  .input-append {
361
364
  margin-bottom: 5px;
362
- .clearfix(); // Clear the float to prevent wrapping
363
365
  input,
366
+ select,
364
367
  .uneditable-input {
368
+ *margin-left: 0;
365
369
  .border-radius(0 3px 3px 0);
366
370
  &:focus {
367
371
  position: relative;
@@ -372,20 +376,21 @@ select:focus:required:invalid {
372
376
  border-left-color: #ccc;
373
377
  }
374
378
  .add-on {
375
- float: left;
376
- display: block;
379
+ display: inline-block;
377
380
  width: auto;
378
381
  min-width: 16px;
379
382
  height: @baseLineHeight;
380
- margin-right: -1px;
381
383
  padding: 4px 5px;
382
384
  font-weight: normal;
383
385
  line-height: @baseLineHeight;
384
- color: @grayLight;
385
386
  text-align: center;
386
387
  text-shadow: 0 1px 0 @white;
387
- background-color: #f5f5f5;
388
+ vertical-align: middle;
389
+ background-color: @grayLighter;
388
390
  border: 1px solid #ccc;
391
+ }
392
+ .add-on,
393
+ .btn {
389
394
  .border-radius(3px 0 0 3px);
390
395
  }
391
396
  .active {
@@ -394,33 +399,43 @@ select:focus:required:invalid {
394
399
  }
395
400
  }
396
401
  .input-prepend {
397
- .add-on {
398
- *margin-top: 1px; /* IE6-7 */
402
+ .add-on,
403
+ .btn {
404
+ margin-right: -1px;
399
405
  }
400
406
  }
401
407
  .input-append {
402
408
  input,
409
+ select
403
410
  .uneditable-input {
404
- float: left;
405
411
  .border-radius(3px 0 0 3px);
406
412
  }
407
413
  .uneditable-input {
408
414
  border-left-color: #eee;
409
- border-right-color: #ccc;
415
+ border-right-color: #ccc;
410
416
  }
411
- .add-on {
412
- margin-right: 0;
417
+ .add-on,
418
+ .btn {
413
419
  margin-left: -1px;
414
420
  .border-radius(0 3px 3px 0);
415
421
  }
416
- input:first-child {
417
- // In IE7, having a hasLayout container (from clearfix's zoom:1) can make the first input
418
- // inherit the sum of its ancestors' margins.
419
- *margin-left: -160px;
420
-
421
- &+.add-on {
422
- *margin-left: -21px;
423
- }
422
+ }
423
+ // Remove all border-radius for inputs with both prepend and append
424
+ .input-prepend.input-append {
425
+ input,
426
+ select,
427
+ .uneditable-input {
428
+ .border-radius(0);
429
+ }
430
+ .add-on:first-child,
431
+ .btn:first-child {
432
+ margin-right: -1px;
433
+ .border-radius(3px 0 0 3px);
434
+ }
435
+ .add-on:last-child,
436
+ .btn:last-child {
437
+ margin-left: -1px;
438
+ .border-radius(0 3px 3px 0);
424
439
  }
425
440
  }
426
441
 
@@ -451,7 +466,9 @@ select:focus:required:invalid {
451
466
  textarea,
452
467
  select,
453
468
  .help-inline,
454
- .uneditable-input {
469
+ .uneditable-input,
470
+ .input-prepend,
471
+ .input-append {
455
472
  display: inline-block;
456
473
  margin-bottom: 0;
457
474
  }
@@ -461,28 +478,35 @@ select:focus:required:invalid {
461
478
  }
462
479
  }
463
480
  .form-search label,
464
- .form-inline label,
481
+ .form-inline label {
482
+ display: inline-block;
483
+ }
484
+ // Remove margin for input-prepend/-append
465
485
  .form-search .input-append,
466
486
  .form-inline .input-append,
467
487
  .form-search .input-prepend,
468
488
  .form-inline .input-prepend {
469
- display: inline-block;
470
- }
471
- // Make the prepend and append add-on vertical-align: middle;
472
- .form-search .input-append .add-on,
473
- .form-inline .input-prepend .add-on,
474
- .form-search .input-append .add-on,
475
- .form-inline .input-prepend .add-on {
476
- vertical-align: middle;
489
+ margin-bottom: 0;
477
490
  }
478
- // Inline checkbox/radio labels
491
+ // Inline checkbox/radio labels (remove padding on left)
479
492
  .form-search .radio,
480
- .form-inline .radio,
481
493
  .form-search .checkbox,
494
+ .form-inline .radio,
482
495
  .form-inline .checkbox {
496
+ padding-left: 0;
483
497
  margin-bottom: 0;
484
498
  vertical-align: middle;
485
499
  }
500
+ // Remove float and margin, set to inline-block
501
+ .form-search .radio input[type="radio"],
502
+ .form-search .checkbox input[type="checkbox"],
503
+ .form-inline .radio input[type="radio"],
504
+ .form-inline .checkbox input[type="checkbox"] {
505
+ float: left;
506
+ margin-left: 0;
507
+ margin-right: 3px;
508
+ }
509
+
486
510
 
487
511
  // Margin to space out fieldsets
488
512
  .control-group {
@@ -514,6 +538,15 @@ legend + .control-group {
514
538
  // Move over all input controls and content
515
539
  .controls {
516
540
  margin-left: 160px;
541
+ /* Super jank IE7 fix to ensure the inputs in .input-append and input-prepend don't inherit the margin of the parent, in this case .controls */
542
+ *display: inline-block;
543
+ *margin-left: 0;
544
+ *padding-left: 20px;
545
+ }
546
+ // Remove bottom margin on block level help text since that's accounted for on .control-group
547
+ .help-block {
548
+ margin-top: @baseLineHeight / 2;
549
+ margin-bottom: 0;
517
550
  }
518
551
  // Move over buttons in .form-actions to align with .controls
519
552
  .form-actions {