twitter-bootstrap-rails 2.0 → 2.0.1.0

Sign up to get free protection for your applications and to get access to all the features.

Potentially problematic release.


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

Files changed (77) hide show
  1. data/README.md +31 -37
  2. data/Rakefile +11 -0
  3. data/lib/generators/bootstrap/install/install_generator.rb +37 -13
  4. data/lib/generators/bootstrap/install/templates/application.css +0 -1
  5. data/lib/generators/bootstrap/install/templates/bootstrap.coffee +6 -15
  6. data/lib/generators/bootstrap/install/templates/bootstrap_and_overrides.less +13 -0
  7. data/lib/generators/bootstrap/layout/layout_generator.rb +4 -4
  8. data/lib/generators/bootstrap/layout/templates/layout.html.erb +96 -49
  9. data/lib/generators/bootstrap/layout/templates/layout.html.haml +76 -0
  10. data/lib/generators/bootstrap/layout/templates/layout.html.slim +77 -0
  11. data/lib/generators/bootstrap/themed/templates/_form.html.erb +5 -4
  12. data/lib/generators/bootstrap/themed/templates/_form.html.haml +11 -0
  13. data/lib/generators/bootstrap/themed/templates/_form.html.slim +11 -0
  14. data/lib/generators/bootstrap/themed/templates/edit.html.erb +1 -2
  15. data/lib/generators/bootstrap/themed/templates/edit.html.haml +3 -0
  16. data/lib/generators/bootstrap/themed/templates/edit.html.slim +3 -0
  17. data/lib/generators/bootstrap/themed/templates/index.html.erb +27 -28
  18. data/lib/generators/bootstrap/themed/templates/index.html.haml +25 -0
  19. data/lib/generators/bootstrap/themed/templates/index.html.slim +25 -0
  20. data/lib/generators/bootstrap/themed/templates/new.html.haml +2 -0
  21. data/lib/generators/bootstrap/themed/templates/new.html.slim +2 -0
  22. data/lib/generators/bootstrap/themed/templates/show.html.erb +5 -4
  23. data/lib/generators/bootstrap/themed/templates/show.html.haml +9 -0
  24. data/lib/generators/bootstrap/themed/templates/show.html.slim +9 -0
  25. data/lib/generators/bootstrap/themed/themed_generator.rb +13 -13
  26. data/lib/twitter/bootstrap/rails/version.rb +1 -1
  27. data/vendor/assets/images/twitter/bootstrap/glyphicons-halflings-white.png +0 -0
  28. data/vendor/assets/images/twitter/bootstrap/glyphicons-halflings.png +0 -0
  29. data/vendor/assets/javascripts/twitter/bootstrap/bootstrap-alert.js +16 -7
  30. data/vendor/assets/javascripts/twitter/bootstrap/bootstrap-button.js +3 -3
  31. data/vendor/assets/javascripts/twitter/bootstrap/bootstrap-carousel.js +7 -4
  32. data/vendor/assets/javascripts/twitter/bootstrap/bootstrap-collapse.js +7 -5
  33. data/vendor/assets/javascripts/twitter/bootstrap/bootstrap-dropdown.js +16 -7
  34. data/vendor/assets/javascripts/twitter/bootstrap/bootstrap-modal.js +12 -7
  35. data/vendor/assets/javascripts/twitter/bootstrap/bootstrap-popover.js +5 -5
  36. data/vendor/assets/javascripts/twitter/bootstrap/bootstrap-scrollspy.js +4 -3
  37. data/vendor/assets/javascripts/twitter/bootstrap/bootstrap-tab.js +11 -6
  38. data/vendor/assets/javascripts/twitter/bootstrap/bootstrap-tooltip.js +2 -2
  39. data/vendor/assets/javascripts/twitter/bootstrap/bootstrap-transition.js +3 -3
  40. data/vendor/assets/javascripts/twitter/bootstrap/bootstrap-typeahead.js +40 -21
  41. data/vendor/toolkit/twitter/bootstrap/accordion.less +5 -4
  42. data/vendor/toolkit/twitter/bootstrap/alerts.less +1 -0
  43. data/vendor/toolkit/twitter/bootstrap/bootstrap.less +10 -8
  44. data/vendor/toolkit/twitter/bootstrap/breadcrumbs.less +1 -1
  45. data/vendor/toolkit/twitter/bootstrap/button-groups.less +49 -17
  46. data/vendor/toolkit/twitter/bootstrap/buttons.less +156 -89
  47. data/vendor/toolkit/twitter/bootstrap/carousel.less +12 -5
  48. data/vendor/toolkit/twitter/bootstrap/code.less +57 -0
  49. data/vendor/toolkit/twitter/bootstrap/dropdowns.less +24 -4
  50. data/vendor/toolkit/twitter/bootstrap/forms.less +117 -91
  51. data/vendor/toolkit/twitter/bootstrap/grid.less +8 -0
  52. data/vendor/toolkit/twitter/bootstrap/hero-unit.less +20 -0
  53. data/vendor/toolkit/twitter/bootstrap/labels.less +23 -7
  54. data/vendor/toolkit/twitter/bootstrap/layouts.less +17 -0
  55. data/vendor/toolkit/twitter/bootstrap/mixins.less +253 -36
  56. data/vendor/toolkit/twitter/bootstrap/modals.less +20 -2
  57. data/vendor/toolkit/twitter/bootstrap/navbar.less +82 -34
  58. data/vendor/toolkit/twitter/bootstrap/navs.less +87 -72
  59. data/vendor/toolkit/twitter/bootstrap/pager.less +7 -2
  60. data/vendor/toolkit/twitter/bootstrap/pagination.less +1 -0
  61. data/vendor/toolkit/twitter/bootstrap/popovers.less +25 -25
  62. data/vendor/toolkit/twitter/bootstrap/progress-bars.less +14 -18
  63. data/vendor/toolkit/twitter/bootstrap/reset.less +3 -4
  64. data/vendor/toolkit/twitter/bootstrap/responsive.less +224 -165
  65. data/vendor/toolkit/twitter/bootstrap/scaffolding.less +6 -89
  66. data/vendor/toolkit/twitter/bootstrap/sprites.less +139 -99
  67. data/vendor/toolkit/twitter/bootstrap/tables.less +15 -57
  68. data/vendor/toolkit/twitter/bootstrap/thumbnails.less +4 -2
  69. data/vendor/toolkit/twitter/bootstrap/type.less +15 -44
  70. data/vendor/toolkit/twitter/bootstrap/variables.less +38 -21
  71. data/vendor/toolkit/twitter/bootstrap_base.less +2 -0
  72. metadata +36 -21
  73. data/lib/generators/bootstrap/install/templates/bootstrap.less +0 -5
  74. data/vendor/assets/stylesheets/twitter/bootstrap.css.less +0 -1
  75. data/vendor/toolkit/twitter/bootstrap.less +0 -1
  76. data/vendor/toolkit/twitter/bootstrap/patterns.less +0 -30
  77. data/vendor/toolkit/twitter/bootstrap/print.less +0 -18
@@ -1,6 +1,15 @@
1
1
  // MODALS
2
2
  // ------
3
3
 
4
+ // Recalculate z-index where appropriate
5
+ .modal-open {
6
+ .dropdown-menu { z-index: @zindexDropdown + @zindexModal; }
7
+ .dropdown.open { *z-index: @zindexDropdown + @zindexModal; }
8
+ .popover { z-index: @zindexPopover + @zindexModal; }
9
+ .tooltip { z-index: @zindexTooltip + @zindexModal; }
10
+ }
11
+
12
+ // Background
4
13
  .modal-backdrop {
5
14
  position: fixed;
6
15
  top: 0;
@@ -18,6 +27,7 @@
18
27
  .opacity(80);
19
28
  }
20
29
 
30
+ // Base modal
21
31
  .modal {
22
32
  position: fixed;
23
33
  top: 50%;
@@ -41,14 +51,22 @@
41
51
  &.fade.in { top: 50%; }
42
52
  }
43
53
  .modal-header {
44
- padding: 5px 15px;
54
+ padding: 9px 15px;
45
55
  border-bottom: 1px solid #eee;
46
56
  // Close icon
47
57
  .close { margin-top: 2px; }
48
58
  }
59
+
60
+ // Body (where all modal content resises)
49
61
  .modal-body {
50
62
  padding: 15px;
51
63
  }
64
+ // Remove bottom margin if need be
65
+ .modal-body .modal-form {
66
+ margin-bottom: 0;
67
+ }
68
+
69
+ // Footer (for actions)
52
70
  .modal-footer {
53
71
  padding: 14px 15px 15px;
54
72
  margin-bottom: 0;
@@ -60,6 +78,6 @@
60
78
  .btn {
61
79
  float: right;
62
80
  margin-left: 5px;
63
- margin-bottom: 0; // account for input[type=submit] which gets the bottom margin like all other inputs
81
+ margin-bottom: 0; // account for input[type="submit"] which gets the bottom margin like all other inputs
64
82
  }
65
83
  }
@@ -7,20 +7,51 @@
7
7
 
8
8
  .navbar {
9
9
  overflow: visible;
10
+ margin-bottom: @baseLineHeight;
10
11
  }
11
- // gradient is applied to it's own element because overflow visible is not honored by IE when filter is present
12
+
13
+ // Gradient is applied to it's own element because overflow visible is not honored by IE when filter is present
12
14
  .navbar-inner {
13
- background-color: @navbarBackground;
15
+ padding-left: 20px;
16
+ padding-right: 20px;
14
17
  #gradient > .vertical(@navbarBackgroundHighlight, @navbarBackground);
18
+ .border-radius(4px);
15
19
  @shadow: 0 1px 3px rgba(0,0,0,.25), inset 0 -1px 0 rgba(0,0,0,.1);
16
20
  .box-shadow(@shadow);
17
21
  }
18
22
 
19
- // Text and links
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;
44
+ }
45
+ // Override the default collapsed state
46
+ .nav-collapse.collapse {
47
+ height: auto;
48
+ }
49
+
50
+
51
+ // Brand, links, text, and buttons
20
52
  .navbar {
21
53
  // Hover and active states
22
54
  .brand:hover {
23
- color: @white;
24
55
  text-decoration: none;
25
56
  }
26
57
  // Website or project name
@@ -35,9 +66,10 @@
35
66
  color: @white;
36
67
  }
37
68
  // Plain text in topbar
38
- p {
39
- margin: 0;
69
+ .navbar-text {
70
+ margin-bottom: 0;
40
71
  line-height: 40px;
72
+ color: @navbarText;
41
73
  a:hover {
42
74
  color: @white;
43
75
  background-color: transparent;
@@ -49,18 +81,37 @@
49
81
  margin-top: 5px; // make buttons vertically centered in navbar
50
82
  }
51
83
  .btn-group .btn {
52
- margin-top: 0;
84
+ margin-top: 0; // then undo the margin here so we don't accidentally double it
53
85
  }
54
86
  }
55
87
 
56
88
  // Navbar forms
57
89
  .navbar-form {
58
90
  margin-bottom: 0; // remove default bottom margin
91
+ .clearfix();
59
92
  input,
60
93
  select {
61
94
  display: inline-block;
95
+ margin-top: 5px;
62
96
  margin-bottom: 0;
63
97
  }
98
+ .radio,
99
+ .checkbox {
100
+ margin-top: 5px;
101
+ }
102
+ input[type="image"],
103
+ input[type="checkbox"],
104
+ input[type="radio"] {
105
+ margin-top: 3px;
106
+ }
107
+ .input-append,
108
+ .input-prepend {
109
+ margin-top: 6px;
110
+ white-space: nowrap; // preven two items from separating within a .navbar-form that has .pull-left
111
+ input {
112
+ margin-top: 0; // remove the margin on top since it's on the parent
113
+ }
114
+ }
64
115
  }
65
116
 
66
117
  // Navbar search
@@ -74,7 +125,7 @@
74
125
  #font > .sans-serif(13px, normal, 1);
75
126
  color: @white;
76
127
  color: rgba(255,255,255,.75);
77
- background: #444;
128
+ background: #666;
78
129
  background: rgba(255,255,255,.3);
79
130
  border: 1px solid #111;
80
131
  @shadow: inset 0 1px 2px rgba(0,0,0,.1), 0 1px 0px rgba(255,255,255,.15);
@@ -90,7 +141,7 @@
90
141
  background-color: @grayLight;
91
142
  background-color: rgba(255,255,255,.5);
92
143
  }
93
- // Focus states (we use .focused since IE8 and down doesn't support :focus)
144
+ // Focus states (we use .focused since IE7-8 and down doesn't support :focus)
94
145
  &:focus,
95
146
  &.focused {
96
147
  padding: 5px 10px;
@@ -105,25 +156,21 @@
105
156
  }
106
157
 
107
158
 
108
- // Static navbar
109
- .navbar-static {
110
- margin-bottom: @baseLineHeight;
111
- }
112
- .navbar-static .navbar-inner {
113
- padding-left: 20px;
114
- padding-right: 20px;
115
- .border-radius(4px);
116
- }
159
+ // FIXED NAVBAR
160
+ // ------------
117
161
 
118
- // Fixed navbar
119
- .navbar-fixed {
162
+ .navbar-fixed-top {
120
163
  position: fixed;
121
164
  top: 0;
122
165
  right: 0;
123
166
  left: 0;
124
167
  z-index: @zindexFixedNavbar;
125
168
  }
126
-
169
+ .navbar-fixed-top .navbar-inner {
170
+ padding-left: 0;
171
+ padding-right: 0;
172
+ .border-radius(0);
173
+ }
127
174
 
128
175
 
129
176
  // NAVIGATION
@@ -149,33 +196,33 @@
149
196
  float: none;
150
197
  padding: 10px 10px 11px;
151
198
  line-height: 19px;
152
- color: @grayLight;
199
+ color: @navbarLinkColor;
153
200
  text-decoration: none;
154
201
  text-shadow: 0 -1px 0 rgba(0,0,0,.25);
155
202
  }
156
203
  // Hover
157
204
  .navbar .nav > li > a:hover {
158
- background-color: transparent;
159
- color: @white;
205
+ background-color: @navbarLinkBackgroundHover; // "transparent" is default to differentiate :hover from .active
206
+ color: @navbarLinkColorHover;
160
207
  text-decoration: none;
161
208
  }
162
209
 
163
210
  // Active nav items
164
- .navbar .nav .active > a {
165
- color: @white;
211
+ .navbar .nav .active > a,
212
+ .navbar .nav .active > a:hover {
213
+ color: @navbarLinkColorHover;
166
214
  text-decoration: none;
167
- background-color: @grayDarker;
168
- background-color: rgba(0,0,0,.5);
215
+ background-color: @navbarBackground;
169
216
  }
170
217
 
171
218
  // Dividers (basically a vertical hr)
172
- .navbar .vertical-divider {
173
- height: 40px;
219
+ .navbar .divider-vertical {
220
+ height: @navbarHeight;
174
221
  width: 1px;
175
- margin: 0 5px;
222
+ margin: 0 9px;
176
223
  overflow: hidden;
177
- background-color: @grayDarker;
178
- border-right: 1px solid #444;
224
+ background-color: @navbarBackground;
225
+ border-right: 1px solid @navbarBackgroundHighlight;
179
226
  }
180
227
 
181
228
  // Secondary (floated right) nav in topbar
@@ -239,6 +286,7 @@
239
286
 
240
287
  // Right aligned menus need alt position
241
288
  .navbar .nav.pull-right .dropdown-menu {
289
+ left: auto;
242
290
  right: 0;
243
291
  &:before {
244
292
  left: auto;
@@ -248,4 +296,4 @@
248
296
  left: auto;
249
297
  right: 13px;
250
298
  }
251
- }
299
+ }
@@ -21,39 +21,49 @@
21
21
  background-color: @grayLighter;
22
22
  }
23
23
 
24
+ // Nav headers (for dropdowns and lists)
25
+ .nav .nav-header {
26
+ display: block;
27
+ padding: 3px 15px;
28
+ font-size: 11px;
29
+ font-weight: bold;
30
+ line-height: @baseLineHeight;
31
+ color: @grayLight;
32
+ text-shadow: 0 1px 0 rgba(255,255,255,.5);
33
+ text-transform: uppercase;
34
+ }
35
+ // Space them out when they follow another list item (link)
36
+ .nav li + .nav-header {
37
+ margin-top: 9px;
38
+ }
24
39
 
25
40
 
26
41
  // NAV LIST
27
42
  // --------
28
43
 
29
- .nav.list {
44
+ .nav-list {
30
45
  padding-left: 14px;
31
46
  padding-right: 14px;
32
47
  margin-bottom: 0;
33
48
  }
34
- .nav.list > li > a,
35
- .nav.list .nav-header {
36
- display: block;
37
- padding: 3px 15px;
49
+ .nav-list > li > a,
50
+ .nav-list .nav-header {
38
51
  margin-left: -15px;
39
52
  margin-right: -15px;
40
53
  text-shadow: 0 1px 0 rgba(255,255,255,.5);
41
54
  }
42
- .nav.list .nav-header {
43
- font-size: 11px;
44
- font-weight: bold;
45
- line-height: @baseLineHeight;
46
- color: @grayLight;
47
- text-transform: uppercase;
48
- }
49
- .nav.list > li + .nav-header {
50
- margin-top: 9px;
55
+ .nav-list > li > a {
56
+ padding: 3px 15px;
51
57
  }
52
- .nav.list .active > a {
58
+ .nav-list .active > a,
59
+ .nav-list .active > a:hover {
53
60
  color: @white;
54
61
  text-shadow: 0 -1px 0 rgba(0,0,0,.2);
55
62
  background-color: @linkColor;
56
63
  }
64
+ .nav-list [class^="icon-"] {
65
+ margin-right: 2px;
66
+ }
57
67
 
58
68
 
59
69
 
@@ -61,16 +71,16 @@
61
71
  // -------------
62
72
 
63
73
  // Common styles
64
- .tabs,
65
- .pills {
74
+ .nav-tabs,
75
+ .nav-pills {
66
76
  .clearfix();
67
77
  }
68
- .tabs > li,
69
- .pills > li {
78
+ .nav-tabs > li,
79
+ .nav-pills > li {
70
80
  float: left;
71
81
  }
72
- .tabs > li > a,
73
- .pills > li > a {
82
+ .nav-tabs > li > a,
83
+ .nav-pills > li > a {
74
84
  padding-right: 12px;
75
85
  padding-left: 12px;
76
86
  margin-right: 2px;
@@ -81,17 +91,17 @@
81
91
  // ----
82
92
 
83
93
  // Give the tabs something to sit on
84
- .tabs {
94
+ .nav-tabs {
85
95
  border-bottom: 1px solid #ddd;
86
96
  }
87
97
 
88
98
  // Make the list-items overlay the bottom border
89
- .tabs > li {
99
+ .nav-tabs > li {
90
100
  margin-bottom: -1px;
91
101
  }
92
102
 
93
103
  // Actual tabs (as links)
94
- .tabs > li > a {
104
+ .nav-tabs > li > a {
95
105
  padding-top: 9px;
96
106
  padding-bottom: 9px;
97
107
  border: 1px solid transparent;
@@ -101,8 +111,8 @@
101
111
  }
102
112
  }
103
113
  // Active state, and it's :hover to override normal :hover
104
- .tabs > .active > a,
105
- .tabs > .active > a:hover {
114
+ .nav-tabs > .active > a,
115
+ .nav-tabs > .active > a:hover {
106
116
  color: @gray;
107
117
  background-color: @white;
108
118
  border: 1px solid #ddd;
@@ -114,7 +124,7 @@
114
124
  // -----
115
125
 
116
126
  // Links rendered as pills
117
- .pills > li > a {
127
+ .nav-pills > li > a {
118
128
  padding-top: 8px;
119
129
  padding-bottom: 8px;
120
130
  margin-top: 2px;
@@ -123,8 +133,8 @@
123
133
  }
124
134
 
125
135
  // Active state
126
- .pills .active > a,
127
- .pills .active > a:hover {
136
+ .nav-pills .active > a,
137
+ .nav-pills .active > a:hover {
128
138
  color: @white;
129
139
  background-color: @linkColor;
130
140
  }
@@ -135,37 +145,37 @@
135
145
  // -----------
136
146
 
137
147
  // Stacked tabs and pills
138
- .nav.stacked > li {
148
+ .nav-stacked > li {
139
149
  float: none;
140
150
  }
141
- .nav.stacked > li > a {
151
+ .nav-stacked > li > a {
142
152
  margin-right: 0; // no need for the gap between nav items
143
153
  }
144
154
 
145
155
  // Tabs
146
- .tabs.stacked {
156
+ .nav-tabs.nav-stacked {
147
157
  border-bottom: 0;
148
158
  }
149
- .tabs.stacked > li > a {
159
+ .nav-tabs.nav-stacked > li > a {
150
160
  border: 1px solid #ddd;
151
161
  .border-radius(0);
152
162
  }
153
- .tabs.stacked > li:first-child > a {
163
+ .nav-tabs.nav-stacked > li:first-child > a {
154
164
  .border-radius(4px 4px 0 0);
155
165
  }
156
- .tabs.stacked > li:last-child > a {
166
+ .nav-tabs.nav-stacked > li:last-child > a {
157
167
  .border-radius(0 0 4px 4px);
158
168
  }
159
- .tabs.stacked > li > a:hover {
169
+ .nav-tabs.nav-stacked > li > a:hover {
160
170
  border-color: #ddd;
161
171
  z-index: 2;
162
172
  }
163
173
 
164
174
  // Pills
165
- .pills.stacked > li > a {
175
+ .nav-pills.nav-stacked > li > a {
166
176
  margin-bottom: 3px;
167
177
  }
168
- .pills.stacked > li:last-child > a {
178
+ .nav-pills.nav-stacked > li:last-child > a {
169
179
  margin-bottom: 1px; // decrease margin to match sizing of stacked tabs
170
180
  }
171
181
 
@@ -175,32 +185,32 @@
175
185
  // ---------
176
186
 
177
187
  // Position the menu
178
- .pills .dropdown-menu,
179
- .tabs .dropdown-menu {
188
+ .nav-tabs .dropdown-menu,
189
+ .nav-pills .dropdown-menu {
180
190
  margin-top: 1px;
181
191
  border-width: 1px;
182
192
  }
183
- .pills .dropdown-menu {
193
+ .nav-pills .dropdown-menu {
184
194
  .border-radius(4px);
185
195
  }
186
196
 
187
197
  // Default dropdown links
188
198
  // -------------------------
189
199
  // Make carets use linkColor to start
190
- .tabs .dropdown-toggle .caret,
191
- .pills .dropdown-toggle .caret {
200
+ .nav-tabs .dropdown-toggle .caret,
201
+ .nav-pills .dropdown-toggle .caret {
192
202
  border-top-color: @linkColor;
193
203
  margin-top: 6px;
194
204
  }
195
- .tabs .dropdown-toggle:hover .caret,
196
- .pills .dropdown-toggle:hover .caret {
205
+ .nav-tabs .dropdown-toggle:hover .caret,
206
+ .nav-pills .dropdown-toggle:hover .caret {
197
207
  border-top-color: @linkColorHover;
198
208
  }
199
209
 
200
210
  // Active dropdown links
201
211
  // -------------------------
202
- .tabs .active .dropdown-toggle .caret,
203
- .pills .active .dropdown-toggle .caret {
212
+ .nav-tabs .active .dropdown-toggle .caret,
213
+ .nav-pills .active .dropdown-toggle .caret {
204
214
  border-top-color: @grayDark;
205
215
  }
206
216
 
@@ -213,8 +223,8 @@
213
223
 
214
224
  // Open dropdowns
215
225
  // -------------------------
216
- .tabs .open .dropdown-toggle,
217
- .pills .open .dropdown-toggle,
226
+ .nav-tabs .open .dropdown-toggle,
227
+ .nav-pills .open .dropdown-toggle,
218
228
  .nav > .open.active > a:hover {
219
229
  color: @white;
220
230
  background-color: @grayLight;
@@ -228,7 +238,7 @@
228
238
  }
229
239
 
230
240
  // Dropdowns in stacked tabs
231
- .tabs.stacked .open > a:hover {
241
+ .tabs-stacked .open > a:hover {
232
242
  border-color: @grayLight;
233
243
  }
234
244
 
@@ -245,11 +255,14 @@
245
255
  .tabbable {
246
256
  .clearfix();
247
257
  }
258
+ .tab-content {
259
+ overflow: hidden; // prevent content from running below tabs
260
+ }
248
261
 
249
262
  // Remove border on bottom, left, right
250
- .tabs-below .tabs,
251
- .tabs-right .tabs,
252
- .tabs-left .tabs {
263
+ .tabs-below .nav-tabs,
264
+ .tabs-right .nav-tabs,
265
+ .tabs-left .nav-tabs {
253
266
  border-bottom: 0;
254
267
  }
255
268
 
@@ -267,22 +280,22 @@
267
280
  // BOTTOM
268
281
  // ------
269
282
 
270
- .tabs-below .tabs {
283
+ .tabs-below .nav-tabs {
271
284
  border-top: 1px solid #ddd;
272
285
  }
273
- .tabs-below .tabs > li {
286
+ .tabs-below .nav-tabs > li {
274
287
  margin-top: -1px;
275
288
  margin-bottom: 0;
276
289
  }
277
- .tabs-below .tabs > li > a {
290
+ .tabs-below .nav-tabs > li > a {
278
291
  .border-radius(0 0 4px 4px);
279
292
  &:hover {
280
293
  border-bottom-color: transparent;
281
294
  border-top-color: #ddd;
282
295
  }
283
296
  }
284
- .tabs-below .tabs .active > a,
285
- .tabs-below .tabs .active > a:hover {
297
+ .tabs-below .nav-tabs .active > a,
298
+ .tabs-below .nav-tabs .active > a:hover {
286
299
  border-color: transparent #ddd #ddd #ddd;
287
300
  }
288
301
 
@@ -290,49 +303,51 @@
290
303
  // ------------
291
304
 
292
305
  // Common styles
293
- .tabs-left .tabs > li,
294
- .tabs-right .tabs > li {
306
+ .tabs-left .nav-tabs > li,
307
+ .tabs-right .nav-tabs > li {
295
308
  float: none;
296
309
  }
297
- .tabs-left .tabs > li > a,
298
- .tabs-right .tabs > li > a {
310
+ .tabs-left .nav-tabs > li > a,
311
+ .tabs-right .nav-tabs > li > a {
299
312
  min-width: 74px;
300
313
  margin-right: 0;
301
314
  margin-bottom: 3px;
302
315
  }
303
316
 
304
317
  // Tabs on the left
305
- .tabs-left .tabs {
318
+ .tabs-left .nav-tabs {
306
319
  float: left;
307
320
  margin-right: 19px;
308
321
  border-right: 1px solid #ddd;
309
322
  }
310
- .tabs-left .tabs > li > a {
323
+ .tabs-left .nav-tabs > li > a {
311
324
  margin-right: -1px;
312
325
  .border-radius(4px 0 0 4px);
313
326
  }
314
- .tabs-left .tabs > li > a:hover {
327
+ .tabs-left .nav-tabs > li > a:hover {
315
328
  border-color: @grayLighter #ddd @grayLighter @grayLighter;
316
329
  }
317
- .tabs-left .tabs .active > a,
318
- .tabs-left .tabs .active > a:hover {
330
+ .tabs-left .nav-tabs .active > a,
331
+ .tabs-left .nav-tabs .active > a:hover {
319
332
  border-color: #ddd transparent #ddd #ddd;
333
+ *border-right-color: @white;
320
334
  }
321
335
 
322
336
  // Tabs on the right
323
- .tabs-right .tabs {
337
+ .tabs-right .nav-tabs {
324
338
  float: right;
325
339
  margin-left: 19px;
326
340
  border-left: 1px solid #ddd;
327
341
  }
328
- .tabs-right .tabs > li > a {
342
+ .tabs-right .nav-tabs > li > a {
329
343
  margin-left: -1px;
330
344
  .border-radius(0 4px 4px 0);
331
345
  }
332
- .tabs-right .tabs > li > a:hover {
346
+ .tabs-right .nav-tabs > li > a:hover {
333
347
  border-color: @grayLighter @grayLighter @grayLighter #ddd;
334
348
  }
335
- .tabs-right .tabs .active > a,
336
- .tabs-right .tabs .active > a:hover {
349
+ .tabs-right .nav-tabs .active > a,
350
+ .tabs-right .nav-tabs .active > a:hover {
337
351
  border-color: #ddd #ddd #ddd transparent;
352
+ *border-left-color: @white;
338
353
  }