anjlab-bootstrap-rails 2.0.1.1 → 2.0.2.0

Sign up to get free protection for your applications and to get access to all the features.
Files changed (42) hide show
  1. data/README.md +2 -1
  2. data/lib/bootstrap-rails/version.rb +1 -1
  3. data/vendor/assets/javascripts/bootstrap-alert.js +1 -1
  4. data/vendor/assets/javascripts/bootstrap-button.js +1 -1
  5. data/vendor/assets/javascripts/bootstrap-carousel.js +7 -3
  6. data/vendor/assets/javascripts/bootstrap-collapse.js +4 -2
  7. data/vendor/assets/javascripts/bootstrap-dropdown.js +1 -1
  8. data/vendor/assets/javascripts/bootstrap-modal.js +1 -1
  9. data/vendor/assets/javascripts/bootstrap-popover.js +1 -1
  10. data/vendor/assets/javascripts/bootstrap-scrollspy.js +1 -1
  11. data/vendor/assets/javascripts/bootstrap-tab.js +1 -1
  12. data/vendor/assets/javascripts/bootstrap-tooltip.js +2 -2
  13. data/vendor/assets/javascripts/bootstrap-transition.js +1 -1
  14. data/vendor/assets/javascripts/bootstrap-typeahead.js +7 -7
  15. data/vendor/assets/stylesheets/alerts.scss +2 -14
  16. data/vendor/assets/stylesheets/badges.scss +36 -0
  17. data/vendor/assets/stylesheets/bootstrap.scss +2 -1
  18. data/vendor/assets/stylesheets/breadcrumbs.scss +2 -0
  19. data/vendor/assets/stylesheets/button-groups.scss +31 -7
  20. data/vendor/assets/stylesheets/buttons.scss +17 -13
  21. data/vendor/assets/stylesheets/code.scss +2 -2
  22. data/vendor/assets/stylesheets/component-animations.scss +3 -1
  23. data/vendor/assets/stylesheets/dropdowns.scss +45 -27
  24. data/vendor/assets/stylesheets/forms.scss +75 -42
  25. data/vendor/assets/stylesheets/grid.scss +2 -5
  26. data/vendor/assets/stylesheets/hero-unit.scss +3 -1
  27. data/vendor/assets/stylesheets/labels.scss +8 -2
  28. data/vendor/assets/stylesheets/mixins.scss +174 -135
  29. data/vendor/assets/stylesheets/modals.scss +12 -5
  30. data/vendor/assets/stylesheets/navbar.scss +77 -35
  31. data/vendor/assets/stylesheets/navs.scss +19 -9
  32. data/vendor/assets/stylesheets/pager.scss +6 -0
  33. data/vendor/assets/stylesheets/pagination.scss +1 -0
  34. data/vendor/assets/stylesheets/progress-bars.scss +15 -1
  35. data/vendor/assets/stylesheets/reset.scss +1 -1
  36. data/vendor/assets/stylesheets/responsive.scss +72 -28
  37. data/vendor/assets/stylesheets/scaffolding.scss +4 -4
  38. data/vendor/assets/stylesheets/tables.scss +15 -13
  39. data/vendor/assets/stylesheets/type.scss +21 -5
  40. data/vendor/assets/stylesheets/variables.scss +92 -6
  41. data/vendor/assets/stylesheets/wells.scss +10 -0
  42. metadata +12 -11
@@ -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; }
17
+ &.in {
18
+ height: auto;
19
+ }
18
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
  @include 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
  @include 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
+ @include 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
  @include border-radius(4px);
@@ -48,7 +48,7 @@ input,
48
48
  button,
49
49
  select,
50
50
  textarea {
51
- @include 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
  @include 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
  @include 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
- @include input-grid-system-generate($gridColumns, $gridColumnWidth, $gridGutterWidth);
256
+ @include grid-input($gridColumnWidth, $gridGutterWidth);
257
257
 
258
258
 
259
259
 
@@ -269,7 +269,7 @@ textarea[disabled],
269
269
  input[readonly],
270
270
  select[readonly],
271
271
  textarea[readonly] {
272
- background-color: #f5f5f5;
272
+ background-color: $inputDisabledBackground;
273
273
  border-color: #ddd;
274
274
  cursor: not-allowed;
275
275
  }
@@ -315,14 +315,15 @@ select:focus:required:invalid {
315
315
  padding: ($baseLineHeight - 1) 20px $baseLineHeight;
316
316
  margin-top: $baseLineHeight;
317
317
  margin-bottom: $baseLineHeight;
318
- background-color: #f5f5f5;
318
+ background-color: $grayLighter;
319
319
  border-top: 1px solid #ddd;
320
+ @include clearfix(); // Adding clearfix to allow for .pull-right button containers
320
321
  }
321
322
 
322
323
  // For text that needs to appear as an input but should not be an input
323
324
  .uneditable-input {
324
325
  display: block;
325
- background-color: $white;
326
+ background-color: $inputBackground;
326
327
  border-color: #eee;
327
328
  @include box-shadow(inset 0 1px 2px rgba(0,0,0,.025));
328
329
  cursor: not-allowed;
@@ -336,17 +337,19 @@ select:focus:required:invalid {
336
337
  // HELP TEXT
337
338
  // ---------
338
339
 
340
+ .help-block,
341
+ .help-inline {
342
+ color: $gray; // lighten the text some for contrast
343
+ }
344
+
339
345
  .help-block {
340
346
  display: block; // account for any element using help-block
341
- margin-top: 5px;
342
- margin-bottom: 0;
343
- color: $grayLight;
347
+ margin-bottom: $baseLineHeight / 2;
344
348
  }
345
349
 
346
350
  .help-inline {
347
351
  display: inline-block;
348
352
  @include ie7-inline-block();
349
- margin-bottom: 9px;
350
353
  vertical-align: middle;
351
354
  padding-left: 5px;
352
355
  }
@@ -360,9 +363,10 @@ select:focus:required:invalid {
360
363
  .input-prepend,
361
364
  .input-append {
362
365
  margin-bottom: 5px;
363
- @include clearfix(); // Clear the float to prevent wrapping
364
366
  input,
367
+ select,
365
368
  .uneditable-input {
369
+ *margin-left: 0;
366
370
  @include border-radius(0 3px 3px 0);
367
371
  &:focus {
368
372
  position: relative;
@@ -373,20 +377,21 @@ select:focus:required:invalid {
373
377
  border-left-color: #ccc;
374
378
  }
375
379
  .add-on {
376
- float: left;
377
- display: block;
380
+ display: inline-block;
378
381
  width: auto;
379
382
  min-width: 16px;
380
383
  height: $baseLineHeight;
381
- margin-right: -1px;
382
384
  padding: 4px 5px;
383
385
  font-weight: normal;
384
386
  line-height: $baseLineHeight;
385
- color: $grayLight;
386
387
  text-align: center;
387
388
  text-shadow: 0 1px 0 $white;
388
- background-color: #f5f5f5;
389
+ vertical-align: middle;
390
+ background-color: $grayLighter;
389
391
  border: 1px solid #ccc;
392
+ }
393
+ .add-on,
394
+ .btn {
390
395
  @include border-radius(3px 0 0 3px);
391
396
  }
392
397
  .active {
@@ -395,33 +400,43 @@ select:focus:required:invalid {
395
400
  }
396
401
  }
397
402
  .input-prepend {
398
- .add-on {
399
- *margin-top: 1px; /* IE6-7 */
403
+ .add-on,
404
+ .btn {
405
+ margin-right: -1px;
400
406
  }
401
407
  }
402
408
  .input-append {
403
409
  input,
410
+ select
404
411
  .uneditable-input {
405
- float: left;
406
412
  @include border-radius(3px 0 0 3px);
407
413
  }
408
414
  .uneditable-input {
409
415
  border-left-color: #eee;
410
416
  border-right-color: #ccc;
411
417
  }
412
- .add-on {
413
- margin-right: 0;
418
+ .add-on,
419
+ .btn {
414
420
  margin-left: -1px;
415
421
  @include border-radius(0 3px 3px 0);
416
422
  }
417
- input:first-child {
418
- // In IE7, having a hasLayout container (from clearfix's zoom:1) can make the first input
419
- // inherit the sum of its ancestors' margins.
420
- *margin-left: -160px;
421
-
422
- &+.add-on {
423
- *margin-left: -21px;
423
+ }
424
+ // Remove all border-radius for inputs with both prepend and append
425
+ .input-prepend.input-append {
426
+ input,
427
+ select,
428
+ .uneditable-input {
429
+ @include border-radius(0);
430
+ }
431
+ .add-on:first-child,
432
+ .btn:first-child {
433
+ margin-right: -1px;
434
+ @include border-radius(3px 0 0 3px);
424
435
  }
436
+ .add-on:last-child,
437
+ .btn:last-child {
438
+ margin-left: -1px;
439
+ @include border-radius(0 3px 3px 0);
425
440
  }
426
441
  }
427
442
 
@@ -452,7 +467,9 @@ select:focus:required:invalid {
452
467
  textarea,
453
468
  select,
454
469
  .help-inline,
455
- .uneditable-input {
470
+ .uneditable-input,
471
+ .input-prepend,
472
+ .input-append {
456
473
  display: inline-block;
457
474
  margin-bottom: 0;
458
475
  }
@@ -462,28 +479,35 @@ select:focus:required:invalid {
462
479
  }
463
480
  }
464
481
  .form-search label,
465
- .form-inline label,
482
+ .form-inline label {
483
+ display: inline-block;
484
+ }
485
+ // Remove margin for input-prepend/-append
466
486
  .form-search .input-append,
467
487
  .form-inline .input-append,
468
488
  .form-search .input-prepend,
469
489
  .form-inline .input-prepend {
470
- display: inline-block;
471
- }
472
- // Make the prepend and append add-on vertical-align: middle;
473
- .form-search .input-append .add-on,
474
- .form-inline .input-prepend .add-on,
475
- .form-search .input-append .add-on,
476
- .form-inline .input-prepend .add-on {
477
- vertical-align: middle;
490
+ margin-bottom: 0;
478
491
  }
479
- // Inline checkbox/radio labels
492
+ // Inline checkbox/radio labels (remove padding on left)
480
493
  .form-search .radio,
481
- .form-inline .radio,
482
494
  .form-search .checkbox,
495
+ .form-inline .radio,
483
496
  .form-inline .checkbox {
497
+ padding-left: 0;
484
498
  margin-bottom: 0;
485
499
  vertical-align: middle;
486
500
  }
501
+ // Remove float and margin, set to inline-block
502
+ .form-search .radio input[type="radio"],
503
+ .form-search .checkbox input[type="checkbox"],
504
+ .form-inline .radio input[type="radio"],
505
+ .form-inline .checkbox input[type="checkbox"] {
506
+ float: left;
507
+ margin-left: 0;
508
+ margin-right: 3px;
509
+ }
510
+
487
511
 
488
512
  // Margin to space out fieldsets
489
513
  .control-group {
@@ -515,6 +539,15 @@ legend + .control-group {
515
539
  // Move over all input controls and content
516
540
  .controls {
517
541
  margin-left: 160px;
542
+ /* 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 */
543
+ *display: inline-block;
544
+ *margin-left: 0;
545
+ *padding-left: 20px;
546
+ }
547
+ // Remove bottom margin on block level help text since that's accounted for on .control-group
548
+ .help-block {
549
+ margin-top: $baseLineHeight / 2;
550
+ margin-bottom: 0;
518
551
  }
519
552
  // Move over buttons in .form-actions to align with .controls
520
553
  .form-actions {
@@ -1,8 +1,5 @@
1
- // GRID SYSTEM
2
- // -----------
3
-
4
1
  // Fixed (940px)
5
- @include grid-system-generate($gridColumns, $gridColumnWidth, $gridGutterWidth);
2
+ @include grid-core($gridColumnWidth, $gridGutterWidth);
6
3
 
7
4
  // Fluid (940px)
8
- @include fluid-grid-system-generate($gridColumns, $fluidGridColumnWidth, $fluidGridGutterWidth);
5
+ @include grid-fluid($fluidGridColumnWidth, $fluidGridGutterWidth);
@@ -4,17 +4,19 @@
4
4
  .hero-unit {
5
5
  padding: 60px;
6
6
  margin-bottom: 30px;
7
- background-color: #f5f5f5;
7
+ background-color: $heroUnitBackground;
8
8
  @include border-radius(6px);
9
9
  h1 {
10
10
  margin-bottom: 0;
11
11
  font-size: 60px;
12
12
  line-height: 1;
13
+ color: $heroUnitHeadingColor;
13
14
  letter-spacing: -1px;
14
15
  }
15
16
  p {
16
17
  font-size: 18px;
17
18
  font-weight: 200;
18
19
  line-height: $baseLineHeight * 1.5;
20
+ color: $heroUnitLeadColor;
19
21
  }
20
22
  }