bootstrap-generators 2.0.1 → 2.0.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.
Files changed (127) hide show
  1. data/README.md +258 -33
  2. data/Rakefile +0 -59
  3. data/lib/bootstrap/generators/engine.rb +6 -1
  4. data/lib/bootstrap/generators/version.rb +1 -1
  5. data/lib/generators/bootstrap/install/install_generator.rb +10 -2
  6. data/lib/generators/bootstrap/install/templates/assets/stylesheets/bootstrap-variables.css.scss +120 -15
  7. data/lib/generators/bootstrap/install/templates/assets/stylesheets/bootstrap-variables.less +206 -0
  8. data/lib/generators/bootstrap/install/templates/assets/stylesheets/fluid.css +2 -0
  9. data/lib/generators/bootstrap/install/templates/assets/stylesheets/fluid.css.less +5 -4
  10. data/lib/generators/bootstrap/install/templates/assets/stylesheets/fluid.css.scss +3 -2
  11. data/lib/generators/bootstrap/install/templates/assets/stylesheets/hero.css +2 -0
  12. data/lib/generators/bootstrap/install/templates/assets/stylesheets/hero.css.less +5 -4
  13. data/lib/generators/bootstrap/install/templates/assets/stylesheets/hero.css.scss +3 -2
  14. data/lib/generators/bootstrap/install/templates/config/initializers/simple_form.rb +3 -0
  15. data/lib/generators/bootstrap/install/templates/form_builders/form_builder/_form.html.erb +3 -3
  16. data/lib/generators/bootstrap/install/templates/form_builders/form_builder/_form.html.haml +2 -2
  17. data/lib/generators/bootstrap/install/templates/form_builders/simple_form/_form.html.erb +1 -1
  18. data/lib/generators/bootstrap/install/templates/form_builders/simple_form/_form.html.haml +1 -1
  19. data/test/fixtures/application.js +3 -0
  20. data/test/lib/generators/bootstrap/install_generator_test.rb +4 -3
  21. data/test/test_helper.rb +8 -1
  22. data/vendor/assets/images/glyphicons-halflings-white.png +0 -0
  23. data/vendor/assets/images/glyphicons-halflings.png +0 -0
  24. data/vendor/assets/javascripts/bootstrap-alert.js +28 -32
  25. data/vendor/assets/javascripts/bootstrap-button.js +29 -33
  26. data/vendor/assets/javascripts/bootstrap-carousel.js +33 -21
  27. data/vendor/assets/javascripts/bootstrap-collapse.js +47 -26
  28. data/vendor/assets/javascripts/bootstrap-dropdown.js +18 -10
  29. data/vendor/assets/javascripts/bootstrap-modal.js +25 -17
  30. data/vendor/assets/javascripts/bootstrap-popover.js +13 -10
  31. data/vendor/assets/javascripts/bootstrap-scrollspy.js +44 -18
  32. data/vendor/assets/javascripts/bootstrap-tab.js +12 -7
  33. data/vendor/assets/javascripts/bootstrap-tooltip.js +40 -35
  34. data/vendor/assets/javascripts/bootstrap-transition.js +30 -20
  35. data/vendor/assets/javascripts/bootstrap-typeahead.js +29 -15
  36. data/vendor/{assets/stylesheets → twitter/bootstrap}/less/accordion.less +5 -0
  37. data/vendor/{assets/stylesheets → twitter/bootstrap}/less/alerts.less +2 -14
  38. data/vendor/{assets/stylesheets → twitter/bootstrap}/less/bootstrap.less +2 -2
  39. data/vendor/{assets/stylesheets → twitter/bootstrap}/less/breadcrumbs.less +2 -0
  40. data/vendor/{assets/stylesheets → twitter/bootstrap}/less/button-groups.less +76 -33
  41. data/vendor/{assets/stylesheets → twitter/bootstrap}/less/buttons.less +32 -24
  42. data/vendor/{assets/stylesheets → twitter/bootstrap}/less/carousel.less +0 -0
  43. data/vendor/{assets/stylesheets → twitter/bootstrap}/less/close.less +12 -1
  44. data/vendor/{assets/stylesheets → twitter/bootstrap}/less/code.less +6 -6
  45. data/vendor/{assets/stylesheets → twitter/bootstrap}/less/component-animations.less +7 -5
  46. data/vendor/{assets/stylesheets → twitter/bootstrap}/less/dropdowns.less +58 -45
  47. data/vendor/{assets/stylesheets → twitter/bootstrap}/less/forms.less +205 -144
  48. data/vendor/twitter/bootstrap/less/grid.less +5 -0
  49. data/vendor/{assets/stylesheets → twitter/bootstrap}/less/hero-unit.less +3 -1
  50. data/vendor/twitter/bootstrap/less/labels-badges.less +55 -0
  51. data/vendor/{assets/stylesheets → twitter/bootstrap}/less/layouts.less +1 -1
  52. data/vendor/{assets/stylesheets → twitter/bootstrap}/less/mixins.less +235 -179
  53. data/vendor/{assets/stylesheets → twitter/bootstrap}/less/modals.less +13 -6
  54. data/vendor/{assets/stylesheets → twitter/bootstrap}/less/navbar.less +131 -72
  55. data/vendor/{assets/stylesheets → twitter/bootstrap}/less/navs.less +53 -43
  56. data/vendor/{assets/stylesheets → twitter/bootstrap}/less/pager.less +6 -0
  57. data/vendor/{assets/stylesheets → twitter/bootstrap}/less/pagination.less +1 -0
  58. data/vendor/{assets/stylesheets → twitter/bootstrap}/less/popovers.less +0 -0
  59. data/vendor/{assets/stylesheets → twitter/bootstrap}/less/progress-bars.less +27 -5
  60. data/vendor/{assets/stylesheets → twitter/bootstrap}/less/reset.less +8 -3
  61. data/vendor/twitter/bootstrap/less/responsive-1200px-min.less +26 -0
  62. data/vendor/twitter/bootstrap/less/responsive-767px-max.less +149 -0
  63. data/vendor/twitter/bootstrap/less/responsive-768px-979px.less +17 -0
  64. data/vendor/twitter/bootstrap/less/responsive-navbar.less +153 -0
  65. data/vendor/twitter/bootstrap/less/responsive-utilities.less +41 -0
  66. data/vendor/twitter/bootstrap/less/responsive.less +48 -0
  67. data/vendor/{assets/stylesheets → twitter/bootstrap}/less/scaffolding.less +4 -4
  68. data/vendor/{assets/stylesheets → twitter/bootstrap}/less/sprites.less +42 -9
  69. data/vendor/{assets/stylesheets → twitter/bootstrap}/less/tables.less +46 -20
  70. data/vendor/{assets/stylesheets → twitter/bootstrap}/less/thumbnails.less +14 -2
  71. data/vendor/{assets/stylesheets → twitter/bootstrap}/less/tooltip.less +0 -0
  72. data/vendor/{assets/stylesheets → twitter/bootstrap}/less/type.less +27 -13
  73. data/vendor/{assets/stylesheets → twitter/bootstrap}/less/utilities.less +0 -0
  74. data/vendor/twitter/bootstrap/less/variables.less +206 -0
  75. data/vendor/{assets/stylesheets → twitter/bootstrap}/less/wells.less +10 -0
  76. data/vendor/{assets/stylesheets/scss/accordion.scss → twitter/bootstrap/sass/_accordion.scss} +5 -0
  77. data/vendor/{assets/stylesheets/scss/alerts.scss → twitter/bootstrap/sass/_alerts.scss} +3 -15
  78. data/vendor/{assets/stylesheets/scss/breadcrumbs.scss → twitter/bootstrap/sass/_breadcrumbs.scss} +2 -0
  79. data/vendor/{assets/stylesheets/scss/button-groups.scss → twitter/bootstrap/sass/_button-groups.scss} +76 -33
  80. data/vendor/{assets/stylesheets/scss/buttons.scss → twitter/bootstrap/sass/_buttons.scss} +33 -25
  81. data/vendor/{assets/stylesheets/scss/carousel.scss → twitter/bootstrap/sass/_carousel.scss} +1 -1
  82. data/vendor/{assets/stylesheets/scss/close.scss → twitter/bootstrap/sass/_close.scss} +12 -1
  83. data/vendor/{assets/stylesheets/scss/code.scss → twitter/bootstrap/sass/_code.scss} +7 -7
  84. data/vendor/{assets/stylesheets/scss/component-animations.scss → twitter/bootstrap/sass/_component-animations.scss} +9 -7
  85. data/vendor/{assets/stylesheets/scss/dropdowns.scss → twitter/bootstrap/sass/_dropdowns.scss} +58 -45
  86. data/vendor/{assets/stylesheets/scss/forms.scss → twitter/bootstrap/sass/_forms.scss} +205 -145
  87. data/vendor/twitter/bootstrap/sass/_grid.scss +5 -0
  88. data/vendor/{assets/stylesheets/scss/hero-unit.scss → twitter/bootstrap/sass/_hero-unit.scss} +3 -1
  89. data/vendor/twitter/bootstrap/sass/_labels-badges.scss +52 -0
  90. data/vendor/{assets/stylesheets/scss/layouts.scss → twitter/bootstrap/sass/_layouts.scss} +2 -2
  91. data/vendor/{assets/stylesheets/scss/mixins.scss → twitter/bootstrap/sass/_mixins.scss} +246 -182
  92. data/vendor/{assets/stylesheets/scss/modals.scss → twitter/bootstrap/sass/_modals.scss} +14 -7
  93. data/vendor/{assets/stylesheets/scss/navbar.scss → twitter/bootstrap/sass/_navbar.scss} +132 -73
  94. data/vendor/{assets/stylesheets/scss/navs.scss → twitter/bootstrap/sass/_navs.scss} +53 -43
  95. data/vendor/{assets/stylesheets/scss/pager.scss → twitter/bootstrap/sass/_pager.scss} +6 -0
  96. data/vendor/{assets/stylesheets/scss/pagination.scss → twitter/bootstrap/sass/_pagination.scss} +1 -0
  97. data/vendor/{assets/stylesheets/scss/popovers.scss → twitter/bootstrap/sass/_popovers.scss} +0 -0
  98. data/vendor/{assets/stylesheets/scss/progress-bars.scss → twitter/bootstrap/sass/_progress-bars.scss} +27 -5
  99. data/vendor/{assets/stylesheets/scss/reset.scss → twitter/bootstrap/sass/_reset.scss} +8 -3
  100. data/vendor/twitter/bootstrap/sass/_responsive-1200px-min.scss +26 -0
  101. data/vendor/twitter/bootstrap/sass/_responsive-767px-max.scss +149 -0
  102. data/vendor/twitter/bootstrap/sass/_responsive-768px-979px.scss +17 -0
  103. data/vendor/twitter/bootstrap/sass/_responsive-navbar.scss +153 -0
  104. data/vendor/twitter/bootstrap/sass/_responsive-utilities.scss +41 -0
  105. data/vendor/{assets/stylesheets/scss/scaffolding.scss → twitter/bootstrap/sass/_scaffolding.scss} +4 -4
  106. data/vendor/{assets/stylesheets/scss/sprites.scss → twitter/bootstrap/sass/_sprites.scss} +40 -7
  107. data/vendor/{assets/stylesheets/scss/tables.scss → twitter/bootstrap/sass/_tables.scss} +37 -32
  108. data/vendor/{assets/stylesheets/scss/thumbnails.scss → twitter/bootstrap/sass/_thumbnails.scss} +14 -2
  109. data/vendor/{assets/stylesheets/scss/tooltip.scss → twitter/bootstrap/sass/_tooltip.scss} +1 -1
  110. data/vendor/{assets/stylesheets/scss/type.scss → twitter/bootstrap/sass/_type.scss} +27 -13
  111. data/vendor/{assets/stylesheets/scss/utilities.scss → twitter/bootstrap/sass/_utilities.scss} +0 -0
  112. data/vendor/twitter/bootstrap/sass/_variables.scss +204 -0
  113. data/vendor/{assets/stylesheets/scss/wells.scss → twitter/bootstrap/sass/_wells.scss} +10 -0
  114. data/vendor/{assets/stylesheets/scss → twitter/bootstrap/sass}/bootstrap.scss +3 -3
  115. data/vendor/twitter/bootstrap/sass/responsive.scss +48 -0
  116. metadata +93 -84
  117. data/lib/generators/bootstrap/install/templates/assets/javascripts/bootstrap-generators.js +0 -1
  118. data/lib/generators/bootstrap/install/templates/assets/stylesheets/bootstrap-variables.css.less +0 -98
  119. data/vendor/assets/stylesheets/bootstrap.css +0 -3363
  120. data/vendor/assets/stylesheets/less/grid.less +0 -8
  121. data/vendor/assets/stylesheets/less/labels.less +0 -32
  122. data/vendor/assets/stylesheets/less/responsive.less +0 -327
  123. data/vendor/assets/stylesheets/less/variables.less +0 -107
  124. data/vendor/assets/stylesheets/scss/grid.scss +0 -8
  125. data/vendor/assets/stylesheets/scss/labels.scss +0 -32
  126. data/vendor/assets/stylesheets/scss/responsive.scss +0 -327
  127. data/vendor/assets/stylesheets/scss/variables.scss +0 -107
@@ -33,7 +33,6 @@
33
33
  top: 50%;
34
34
  left: 50%;
35
35
  z-index: @zindexModal;
36
- max-height: 500px;
37
36
  overflow: auto;
38
37
  width: 560px;
39
38
  margin: -250px 0 0 -280px;
@@ -57,12 +56,14 @@
57
56
  .close { margin-top: 2px; }
58
57
  }
59
58
 
60
- // Body (where all modal content resises)
59
+ // Body (where all modal content resides)
61
60
  .modal-body {
61
+ overflow-y: auto;
62
+ max-height: 400px;
62
63
  padding: 15px;
63
64
  }
64
65
  // Remove bottom margin if need be
65
- .modal-body .modal-form {
66
+ .modal-form {
66
67
  margin-bottom: 0;
67
68
  }
68
69
 
@@ -70,14 +71,20 @@
70
71
  .modal-footer {
71
72
  padding: 14px 15px 15px;
72
73
  margin-bottom: 0;
74
+ text-align: right; // right align buttons
73
75
  background-color: #f5f5f5;
74
76
  border-top: 1px solid #ddd;
75
77
  .border-radius(0 0 6px 6px);
76
78
  .box-shadow(inset 0 1px 0 @white);
77
- .clearfix();
78
- .btn {
79
- float: right;
79
+ .clearfix(); // clear it in case folks use .pull-* classes on buttons
80
+
81
+ // Properly space out buttons
82
+ .btn + .btn {
80
83
  margin-left: 5px;
81
84
  margin-bottom: 0; // account for input[type="submit"] which gets the bottom margin like all other inputs
82
85
  }
86
+ // but override that for button groups
87
+ .btn-group .btn + .btn {
88
+ margin-left: -1px;
89
+ }
83
90
  }
@@ -6,42 +6,30 @@
6
6
  // -------------
7
7
 
8
8
  .navbar {
9
+ // Fix for IE7's bad z-indexing so dropdowns don't appear below content that follows the navbar
10
+ *position: relative;
11
+ *z-index: 2;
12
+
9
13
  overflow: visible;
10
14
  margin-bottom: @baseLineHeight;
11
15
  }
12
16
 
13
17
  // Gradient is applied to it's own element because overflow visible is not honored by IE when filter is present
14
18
  .navbar-inner {
19
+ min-height: @navbarHeight;
15
20
  padding-left: 20px;
16
21
  padding-right: 20px;
17
22
  #gradient > .vertical(@navbarBackgroundHighlight, @navbarBackground);
18
23
  .border-radius(4px);
19
- @shadow: 0 1px 3px rgba(0,0,0,.25), inset 0 -1px 0 rgba(0,0,0,.1);
20
- .box-shadow(@shadow);
24
+ .box-shadow(~"0 1px 3px rgba(0,0,0,.25), inset 0 -1px 0 rgba(0,0,0,.1)");
21
25
  }
22
26
 
23
- // Navbar button for toggling navbar items in responsive layouts
24
- .btn-navbar {
25
- display: none;
26
- float: right;
27
- padding: 7px 10px;
28
- margin-left: 5px;
29
- margin-right: 5px;
30
- .buttonBackground(@navbarBackgroundHighlight, @navbarBackground);
31
- @shadow: inset 0 1px 0 rgba(255,255,255,.1), 0 1px 0 rgba(255,255,255,.075);
32
- .box-shadow(@shadow);
33
- }
34
- .btn-navbar .icon-bar {
35
- display: block;
36
- width: 18px;
37
- height: 2px;
38
- background-color: #f5f5f5;
39
- .border-radius(1px);
40
- .box-shadow(0 1px 0 rgba(0,0,0,.25));
41
- }
42
- .btn-navbar .icon-bar + .icon-bar {
43
- margin-top: 3px;
27
+ // Set width to auto for default container
28
+ // We then reset it for fixed navbars in the #gridSystem mixin
29
+ .navbar .container {
30
+ width: auto;
44
31
  }
32
+
45
33
  // Override the default collapsed state
46
34
  .nav-collapse.collapse {
47
35
  height: auto;
@@ -50,6 +38,7 @@
50
38
 
51
39
  // Brand, links, text, and buttons
52
40
  .navbar {
41
+ color: @navbarText;
53
42
  // Hover and active states
54
43
  .brand:hover {
55
44
  text-decoration: none;
@@ -58,30 +47,34 @@
58
47
  .brand {
59
48
  float: left;
60
49
  display: block;
61
- padding: 8px 20px 12px;
50
+ // Vertically center the text given @navbarHeight
51
+ @elementHeight: 20px;
52
+ padding: ((@navbarHeight - @elementHeight) / 2 - 2) 20px ((@navbarHeight - @elementHeight) / 2 + 2);
62
53
  margin-left: -20px; // negative indent to left-align the text down the page
63
54
  font-size: 20px;
64
55
  font-weight: 200;
65
56
  line-height: 1;
66
- color: @white;
57
+ color: @navbarBrandColor;
67
58
  }
68
59
  // Plain text in topbar
69
60
  .navbar-text {
70
61
  margin-bottom: 0;
71
- line-height: 40px;
72
- color: @navbarText;
73
- a:hover {
74
- color: @white;
75
- background-color: transparent;
62
+ line-height: @navbarHeight;
63
+ }
64
+ // Janky solution for now to account for links outside the .nav
65
+ .navbar-link {
66
+ color: @navbarLinkColor;
67
+ &:hover {
68
+ color: @navbarLinkColorHover;
76
69
  }
77
70
  }
78
71
  // Buttons in navbar
79
72
  .btn,
80
73
  .btn-group {
81
- margin-top: 5px; // make buttons vertically centered in navbar
74
+ .navbarVerticalAlign(30px); // Vertically center in navbar
82
75
  }
83
76
  .btn-group .btn {
84
- margin-top: 0; // then undo the margin here so we don't accidentally double it
77
+ margin: 0; // then undo the margin here so we don't accidentally double it
85
78
  }
86
79
  }
87
80
 
@@ -90,15 +83,16 @@
90
83
  margin-bottom: 0; // remove default bottom margin
91
84
  .clearfix();
92
85
  input,
86
+ select,
87
+ .radio,
88
+ .checkbox {
89
+ .navbarVerticalAlign(30px); // Vertically center in navbar
90
+ }
91
+ input,
93
92
  select {
94
93
  display: inline-block;
95
- margin-top: 5px;
96
94
  margin-bottom: 0;
97
95
  }
98
- .radio,
99
- .checkbox {
100
- margin-top: 5px;
101
- }
102
96
  input[type="image"],
103
97
  input[type="checkbox"],
104
98
  input[type="radio"] {
@@ -118,36 +112,26 @@
118
112
  .navbar-search {
119
113
  position: relative;
120
114
  float: left;
121
- margin-top: 6px;
115
+ .navbarVerticalAlign(28px); // Vertically center in navbar
122
116
  margin-bottom: 0;
123
117
  .search-query {
124
118
  padding: 4px 9px;
125
119
  #font > .sans-serif(13px, normal, 1);
126
120
  color: @white;
127
- color: rgba(255,255,255,.75);
128
- background: #666;
129
- background: rgba(255,255,255,.3);
130
- border: 1px solid #111;
131
- @shadow: inset 0 1px 2px rgba(0,0,0,.1), 0 1px 0px rgba(255,255,255,.15);
132
- .box-shadow(@shadow);
121
+ background-color: @navbarSearchBackground;
122
+ border: 1px solid @navbarSearchBorder;
123
+ .box-shadow(~"inset 0 1px 2px rgba(0,0,0,.1), 0 1px 0 rgba(255,255,255,.15)");
133
124
  .transition(none);
134
125
 
135
- // Placeholder text gets special styles; can't be bundled together though for some reason
136
- .placeholder(@grayLighter);
126
+ .placeholder(@navbarSearchPlaceholderColor);
137
127
 
138
- // Hover states
139
- &:hover {
140
- color: @white;
141
- background-color: @grayLight;
142
- background-color: rgba(255,255,255,.5);
143
- }
144
128
  // Focus states (we use .focused since IE7-8 and down doesn't support :focus)
145
129
  &:focus,
146
130
  &.focused {
147
131
  padding: 5px 10px;
148
132
  color: @grayDark;
149
133
  text-shadow: 0 1px 0 @white;
150
- background-color: @white;
134
+ background-color: @navbarSearchBackgroundFocus;
151
135
  border: 0;
152
136
  .box-shadow(0 0 3px rgba(0,0,0,.15));
153
137
  outline: 0;
@@ -156,22 +140,42 @@
156
140
  }
157
141
 
158
142
 
143
+
159
144
  // FIXED NAVBAR
160
145
  // ------------
161
146
 
162
- .navbar-fixed-top {
147
+ // Shared (top/bottom) styles
148
+ .navbar-fixed-top,
149
+ .navbar-fixed-bottom {
163
150
  position: fixed;
164
- top: 0;
165
151
  right: 0;
166
152
  left: 0;
167
153
  z-index: @zindexFixedNavbar;
154
+ margin-bottom: 0; // remove 18px margin for static navbar
168
155
  }
169
- .navbar-fixed-top .navbar-inner {
156
+ .navbar-fixed-top .navbar-inner,
157
+ .navbar-fixed-bottom .navbar-inner {
170
158
  padding-left: 0;
171
159
  padding-right: 0;
172
160
  .border-radius(0);
173
161
  }
174
162
 
163
+ .navbar-fixed-top .container,
164
+ .navbar-fixed-bottom .container {
165
+ #grid > .core > .span(@gridColumns);
166
+ }
167
+
168
+ // Fixed to top
169
+ .navbar-fixed-top {
170
+ top: 0;
171
+ }
172
+
173
+ // Fixed to bottom
174
+ .navbar-fixed-bottom {
175
+ bottom: 0;
176
+ }
177
+
178
+
175
179
 
176
180
  // NAVIGATION
177
181
  // ----------
@@ -194,12 +198,29 @@
194
198
  // Links
195
199
  .navbar .nav > li > a {
196
200
  float: none;
197
- padding: 10px 10px 11px;
201
+ // Vertically center the text given @navbarHeight
202
+ @elementHeight: 20px;
203
+ padding: ((@navbarHeight - @elementHeight) / 2 - 1) 10px ((@navbarHeight - @elementHeight) / 2 + 1);
198
204
  line-height: 19px;
199
205
  color: @navbarLinkColor;
200
206
  text-decoration: none;
201
207
  text-shadow: 0 -1px 0 rgba(0,0,0,.25);
202
208
  }
209
+ // Buttons
210
+ .navbar .btn {
211
+ display: inline-block;
212
+ padding: 4px 10px 4px;
213
+ // Vertically center the button given @navbarHeight
214
+ @elementHeight: 28px;
215
+ margin: ((@navbarHeight - @elementHeight) / 2 - 1) 5px ((@navbarHeight - @elementHeight) / 2);
216
+ line-height: @baseLineHeight;
217
+ }
218
+ .navbar .btn-group {
219
+ margin: 0;
220
+ // Vertically center the button given @navbarHeight
221
+ @elementHeight: 28px;
222
+ padding: ((@navbarHeight - @elementHeight) / 2 - 1) 5px ((@navbarHeight - @elementHeight) / 2);
223
+ }
203
224
  // Hover
204
225
  .navbar .nav > li > a:hover {
205
226
  background-color: @navbarLinkBackgroundHover; // "transparent" is default to differentiate :hover from .active
@@ -210,9 +231,9 @@
210
231
  // Active nav items
211
232
  .navbar .nav .active > a,
212
233
  .navbar .nav .active > a:hover {
213
- color: @navbarLinkColorHover;
234
+ color: @navbarLinkColorActive;
214
235
  text-decoration: none;
215
- background-color: @navbarBackground;
236
+ background-color: @navbarLinkBackgroundActive;
216
237
  }
217
238
 
218
239
  // Dividers (basically a vertical hr)
@@ -231,6 +252,28 @@
231
252
  margin-right: 0;
232
253
  }
233
254
 
255
+ // Navbar button for toggling navbar items in responsive layouts
256
+ // These definitions need to come after '.navbar .btn'
257
+ .navbar .btn-navbar {
258
+ display: none;
259
+ float: right;
260
+ padding: 7px 10px;
261
+ margin-left: 5px;
262
+ margin-right: 5px;
263
+ .buttonBackground(@navbarBackgroundHighlight, @navbarBackground);
264
+ .box-shadow(~"inset 0 1px 0 rgba(255,255,255,.1), 0 1px 0 rgba(255,255,255,.075)");
265
+ }
266
+ .navbar .btn-navbar .icon-bar {
267
+ display: block;
268
+ width: 18px;
269
+ height: 2px;
270
+ background-color: #f5f5f5;
271
+ .border-radius(1px);
272
+ .box-shadow(0 1px 0 rgba(0,0,0,.25));
273
+ }
274
+ .btn-navbar .icon-bar + .icon-bar {
275
+ margin-top: 3px;
276
+ }
234
277
 
235
278
 
236
279
  // Dropdown menus
@@ -238,15 +281,13 @@
238
281
 
239
282
  // Menu position and menu carets
240
283
  .navbar .dropdown-menu {
241
- margin-top: 1px;
242
- .border-radius(4px);
243
284
  &:before {
244
285
  content: '';
245
286
  display: inline-block;
246
287
  border-left: 7px solid transparent;
247
288
  border-right: 7px solid transparent;
248
289
  border-bottom: 7px solid #ccc;
249
- border-bottom-color: rgba(0,0,0,.2);
290
+ border-bottom-color: @dropdownBorder;
250
291
  position: absolute;
251
292
  top: -7px;
252
293
  left: 9px;
@@ -256,36 +297,54 @@
256
297
  display: inline-block;
257
298
  border-left: 6px solid transparent;
258
299
  border-right: 6px solid transparent;
259
- border-bottom: 6px solid @white;
300
+ border-bottom: 6px solid @dropdownBackground;
260
301
  position: absolute;
261
302
  top: -6px;
262
303
  left: 10px;
263
304
  }
264
305
  }
265
-
306
+ // Menu position and menu caret support for dropups via extra dropup class
307
+ .navbar-fixed-bottom .dropdown-menu {
308
+ &:before {
309
+ border-top: 7px solid #ccc;
310
+ border-top-color: @dropdownBorder;
311
+ border-bottom: 0;
312
+ bottom: -7px;
313
+ top: auto;
314
+ }
315
+ &:after {
316
+ border-top: 6px solid @dropdownBackground;
317
+ border-bottom: 0;
318
+ bottom: -6px;
319
+ top: auto;
320
+ }
321
+ }
266
322
  // Dropdown toggle caret
267
- .navbar .nav .dropdown-toggle .caret,
268
- .navbar .nav .open.dropdown .caret {
323
+ .navbar .nav li.dropdown .dropdown-toggle .caret,
324
+ .navbar .nav li.dropdown.open .caret {
269
325
  border-top-color: @white;
326
+ border-bottom-color: @white;
270
327
  }
271
- .navbar .nav .active .caret {
328
+ .navbar .nav li.dropdown.active .caret {
272
329
  .opacity(100);
273
330
  }
274
331
 
275
332
  // Remove background color from open dropdown
276
- .navbar .nav .open > .dropdown-toggle,
277
- .navbar .nav .active > .dropdown-toggle,
278
- .navbar .nav .open.active > .dropdown-toggle {
333
+ .navbar .nav li.dropdown.open > .dropdown-toggle,
334
+ .navbar .nav li.dropdown.active > .dropdown-toggle,
335
+ .navbar .nav li.dropdown.open.active > .dropdown-toggle {
279
336
  background-color: transparent;
280
337
  }
281
338
 
282
339
  // Dropdown link on hover
283
- .navbar .nav .active > .dropdown-toggle:hover {
340
+ .navbar .nav li.dropdown.active > .dropdown-toggle:hover {
284
341
  color: @white;
285
342
  }
286
343
 
287
344
  // Right aligned menus need alt position
288
- .navbar .nav.pull-right .dropdown-menu {
345
+ // TODO: rejigger this at some point to simplify the selectors
346
+ .navbar .pull-right .dropdown-menu,
347
+ .navbar .dropdown-menu.pull-right {
289
348
  left: auto;
290
349
  right: 0;
291
350
  &:before {
@@ -21,6 +21,11 @@
21
21
  background-color: @grayLighter;
22
22
  }
23
23
 
24
+ // Redeclare pull classes because of specifity
25
+ .nav > .pull-right {
26
+ float: right;
27
+ }
28
+
24
29
  // Nav headers (for dropdowns and lists)
25
30
  .nav .nav-header {
26
31
  display: block;
@@ -42,8 +47,8 @@
42
47
  // --------
43
48
 
44
49
  .nav-list {
45
- padding-left: 14px;
46
- padding-right: 14px;
50
+ padding-left: 15px;
51
+ padding-right: 15px;
47
52
  margin-bottom: 0;
48
53
  }
49
54
  .nav-list > li > a,
@@ -55,8 +60,8 @@
55
60
  .nav-list > li > a {
56
61
  padding: 3px 15px;
57
62
  }
58
- .nav-list .active > a,
59
- .nav-list .active > a:hover {
63
+ .nav-list > .active > a,
64
+ .nav-list > .active > a:hover {
60
65
  color: @white;
61
66
  text-shadow: 0 -1px 0 rgba(0,0,0,.2);
62
67
  background-color: @linkColor;
@@ -64,6 +69,10 @@
64
69
  .nav-list [class^="icon-"] {
65
70
  margin-right: 2px;
66
71
  }
72
+ // Dividers (basically an hr) within the dropdown
73
+ .nav-list .divider {
74
+ .nav-divider();
75
+ }
67
76
 
68
77
 
69
78
 
@@ -94,16 +103,15 @@
94
103
  .nav-tabs {
95
104
  border-bottom: 1px solid #ddd;
96
105
  }
97
-
98
106
  // Make the list-items overlay the bottom border
99
107
  .nav-tabs > li {
100
108
  margin-bottom: -1px;
101
109
  }
102
-
103
110
  // Actual tabs (as links)
104
111
  .nav-tabs > li > a {
105
- padding-top: 9px;
106
- padding-bottom: 9px;
112
+ padding-top: 8px;
113
+ padding-bottom: 8px;
114
+ line-height: @baseLineHeight;
107
115
  border: 1px solid transparent;
108
116
  .border-radius(4px 4px 0 0);
109
117
  &:hover {
@@ -120,6 +128,7 @@
120
128
  cursor: default;
121
129
  }
122
130
 
131
+
123
132
  // PILLS
124
133
  // -----
125
134
 
@@ -133,8 +142,8 @@
133
142
  }
134
143
 
135
144
  // Active state
136
- .nav-pills .active > a,
137
- .nav-pills .active > a:hover {
145
+ .nav-pills > .active > a,
146
+ .nav-pills > .active > a:hover {
138
147
  color: @white;
139
148
  background-color: @linkColor;
140
149
  }
@@ -184,14 +193,11 @@
184
193
  // DROPDOWNS
185
194
  // ---------
186
195
 
187
- // Position the menu
188
- .nav-tabs .dropdown-menu,
189
- .nav-pills .dropdown-menu {
190
- margin-top: 1px;
191
- border-width: 1px;
196
+ .nav-tabs .dropdown-menu {
197
+ .border-radius(0 0 5px 5px); // remove the top rounded corners here since there is a hard edge above the menu
192
198
  }
193
199
  .nav-pills .dropdown-menu {
194
- .border-radius(4px);
200
+ .border-radius(4px); // make rounded corners match the pills
195
201
  }
196
202
 
197
203
  // Default dropdown links
@@ -200,11 +206,13 @@
200
206
  .nav-tabs .dropdown-toggle .caret,
201
207
  .nav-pills .dropdown-toggle .caret {
202
208
  border-top-color: @linkColor;
209
+ border-bottom-color: @linkColor;
203
210
  margin-top: 6px;
204
211
  }
205
212
  .nav-tabs .dropdown-toggle:hover .caret,
206
213
  .nav-pills .dropdown-toggle:hover .caret {
207
214
  border-top-color: @linkColorHover;
215
+ border-bottom-color: @linkColorHover;
208
216
  }
209
217
 
210
218
  // Active dropdown links
@@ -212,6 +220,7 @@
212
220
  .nav-tabs .active .dropdown-toggle .caret,
213
221
  .nav-pills .active .dropdown-toggle .caret {
214
222
  border-top-color: @grayDark;
223
+ border-bottom-color: @grayDark;
215
224
  }
216
225
 
217
226
  // Active:hover dropdown links
@@ -225,15 +234,16 @@
225
234
  // -------------------------
226
235
  .nav-tabs .open .dropdown-toggle,
227
236
  .nav-pills .open .dropdown-toggle,
228
- .nav > .open.active > a:hover {
237
+ .nav > li.dropdown.open.active > a:hover {
229
238
  color: @white;
230
239
  background-color: @grayLight;
231
240
  border-color: @grayLight;
232
241
  }
233
- .nav .open .caret,
234
- .nav .open.active .caret,
235
- .nav .open a:hover .caret {
242
+ .nav li.dropdown.open .caret,
243
+ .nav li.dropdown.open.active .caret,
244
+ .nav li.dropdown.open a:hover .caret {
236
245
  border-top-color: @white;
246
+ border-bottom-color: @white;
237
247
  .opacity(100);
238
248
  }
239
249
 
@@ -256,13 +266,13 @@
256
266
  .clearfix();
257
267
  }
258
268
  .tab-content {
259
- overflow: hidden; // prevent content from running below tabs
269
+ overflow: auto; // prevent content from running below tabs
260
270
  }
261
271
 
262
272
  // Remove border on bottom, left, right
263
- .tabs-below .nav-tabs,
264
- .tabs-right .nav-tabs,
265
- .tabs-left .nav-tabs {
273
+ .tabs-below > .nav-tabs,
274
+ .tabs-right > .nav-tabs,
275
+ .tabs-left > .nav-tabs {
266
276
  border-bottom: 0;
267
277
  }
268
278
 
@@ -280,22 +290,22 @@
280
290
  // BOTTOM
281
291
  // ------
282
292
 
283
- .tabs-below .nav-tabs {
293
+ .tabs-below > .nav-tabs {
284
294
  border-top: 1px solid #ddd;
285
295
  }
286
- .tabs-below .nav-tabs > li {
296
+ .tabs-below > .nav-tabs > li {
287
297
  margin-top: -1px;
288
298
  margin-bottom: 0;
289
299
  }
290
- .tabs-below .nav-tabs > li > a {
300
+ .tabs-below > .nav-tabs > li > a {
291
301
  .border-radius(0 0 4px 4px);
292
302
  &:hover {
293
303
  border-bottom-color: transparent;
294
304
  border-top-color: #ddd;
295
305
  }
296
306
  }
297
- .tabs-below .nav-tabs .active > a,
298
- .tabs-below .nav-tabs .active > a:hover {
307
+ .tabs-below > .nav-tabs > .active > a,
308
+ .tabs-below > .nav-tabs > .active > a:hover {
299
309
  border-color: transparent #ddd #ddd #ddd;
300
310
  }
301
311
 
@@ -303,51 +313,51 @@
303
313
  // ------------
304
314
 
305
315
  // Common styles
306
- .tabs-left .nav-tabs > li,
307
- .tabs-right .nav-tabs > li {
316
+ .tabs-left > .nav-tabs > li,
317
+ .tabs-right > .nav-tabs > li {
308
318
  float: none;
309
319
  }
310
- .tabs-left .nav-tabs > li > a,
311
- .tabs-right .nav-tabs > li > a {
320
+ .tabs-left > .nav-tabs > li > a,
321
+ .tabs-right > .nav-tabs > li > a {
312
322
  min-width: 74px;
313
323
  margin-right: 0;
314
324
  margin-bottom: 3px;
315
325
  }
316
326
 
317
327
  // Tabs on the left
318
- .tabs-left .nav-tabs {
328
+ .tabs-left > .nav-tabs {
319
329
  float: left;
320
330
  margin-right: 19px;
321
331
  border-right: 1px solid #ddd;
322
332
  }
323
- .tabs-left .nav-tabs > li > a {
333
+ .tabs-left > .nav-tabs > li > a {
324
334
  margin-right: -1px;
325
335
  .border-radius(4px 0 0 4px);
326
336
  }
327
- .tabs-left .nav-tabs > li > a:hover {
337
+ .tabs-left > .nav-tabs > li > a:hover {
328
338
  border-color: @grayLighter #ddd @grayLighter @grayLighter;
329
339
  }
330
- .tabs-left .nav-tabs .active > a,
331
- .tabs-left .nav-tabs .active > a:hover {
340
+ .tabs-left > .nav-tabs .active > a,
341
+ .tabs-left > .nav-tabs .active > a:hover {
332
342
  border-color: #ddd transparent #ddd #ddd;
333
343
  *border-right-color: @white;
334
344
  }
335
345
 
336
346
  // Tabs on the right
337
- .tabs-right .nav-tabs {
347
+ .tabs-right > .nav-tabs {
338
348
  float: right;
339
349
  margin-left: 19px;
340
350
  border-left: 1px solid #ddd;
341
351
  }
342
- .tabs-right .nav-tabs > li > a {
352
+ .tabs-right > .nav-tabs > li > a {
343
353
  margin-left: -1px;
344
354
  .border-radius(0 4px 4px 0);
345
355
  }
346
- .tabs-right .nav-tabs > li > a:hover {
356
+ .tabs-right > .nav-tabs > li > a:hover {
347
357
  border-color: @grayLighter @grayLighter @grayLighter #ddd;
348
358
  }
349
- .tabs-right .nav-tabs .active > a,
350
- .tabs-right .nav-tabs .active > a:hover {
359
+ .tabs-right > .nav-tabs .active > a,
360
+ .tabs-right > .nav-tabs .active > a:hover {
351
361
  border-color: #ddd #ddd #ddd transparent;
352
362
  *border-left-color: @white;
353
363
  }