sass-twitter-bootstrap 2.0.1 → 2.1.1

Sign up to get free protection for your applications and to get access to all the features.
Files changed (66) hide show
  1. data/lib/sass/twitter/bootstrap/version.rb +1 -1
  2. data/vendor/assets/images/glyphicons-halflings-white.png +0 -0
  3. data/vendor/assets/images/glyphicons-halflings.png +0 -0
  4. data/vendor/assets/javascripts/twitter/bootstrap-affix.js +104 -0
  5. data/vendor/assets/javascripts/twitter/bootstrap-alert.js +28 -32
  6. data/vendor/assets/javascripts/twitter/bootstrap-button.js +29 -33
  7. data/vendor/assets/javascripts/twitter/bootstrap-carousel.js +43 -24
  8. data/vendor/assets/javascripts/twitter/bootstrap-collapse.js +50 -28
  9. data/vendor/assets/javascripts/twitter/bootstrap-dropdown.js +77 -19
  10. data/vendor/assets/javascripts/twitter/bootstrap-modal.js +113 -84
  11. data/vendor/assets/javascripts/twitter/bootstrap-popover.js +19 -11
  12. data/vendor/assets/javascripts/twitter/bootstrap-scrollspy.js +50 -24
  13. data/vendor/assets/javascripts/twitter/bootstrap-tab.js +13 -8
  14. data/vendor/assets/javascripts/twitter/bootstrap-tooltip.js +44 -39
  15. data/vendor/assets/javascripts/twitter/bootstrap-transition.js +29 -20
  16. data/vendor/assets/javascripts/twitter/bootstrap-typeahead.js +73 -44
  17. data/vendor/assets/javascripts/twitter/bootstrap.js +12 -0
  18. data/vendor/assets/stylesheets/tests/css-tests.css +1 -12
  19. data/vendor/assets/stylesheets/tests/css-tests.html +22 -125
  20. data/vendor/assets/stylesheets/tests/navbar.html +39 -38
  21. data/vendor/assets/stylesheets/twitter/_accordion.scss +8 -2
  22. data/vendor/assets/stylesheets/twitter/_alerts.scss +16 -21
  23. data/vendor/assets/stylesheets/twitter/_breadcrumbs.scss +12 -10
  24. data/vendor/assets/stylesheets/twitter/_button-groups.scss +137 -39
  25. data/vendor/assets/stylesheets/twitter/_buttons.scss +129 -81
  26. data/vendor/assets/stylesheets/twitter/_carousel.scss +13 -3
  27. data/vendor/assets/stylesheets/twitter/_close.scss +16 -3
  28. data/vendor/assets/stylesheets/twitter/_code.scss +11 -10
  29. data/vendor/assets/stylesheets/twitter/_component-animations.scss +12 -8
  30. data/vendor/assets/stylesheets/twitter/_dropdowns.scss +133 -53
  31. data/vendor/assets/stylesheets/twitter/_forms.scss +298 -170
  32. data/vendor/assets/stylesheets/twitter/_grid.scss +17 -4
  33. data/vendor/assets/stylesheets/twitter/_hero-unit.scss +7 -3
  34. data/vendor/assets/stylesheets/twitter/_labels-badges.scss +69 -0
  35. data/vendor/assets/stylesheets/twitter/_layouts.scss +2 -3
  36. data/vendor/assets/stylesheets/twitter/_mixins.scss +359 -258
  37. data/vendor/assets/stylesheets/twitter/_modals.scss +26 -12
  38. data/vendor/assets/stylesheets/twitter/_navbar.scss +318 -143
  39. data/vendor/assets/stylesheets/twitter/_navs.scss +87 -56
  40. data/vendor/assets/stylesheets/twitter/_pager.scss +16 -6
  41. data/vendor/assets/stylesheets/twitter/_pagination.scss +23 -14
  42. data/vendor/assets/stylesheets/twitter/_popovers.scss +101 -33
  43. data/vendor/assets/stylesheets/twitter/_progress-bars.scss +43 -16
  44. data/vendor/assets/stylesheets/twitter/_reset.scss +16 -6
  45. data/vendor/assets/stylesheets/twitter/_responsive-1200px-min.scss +28 -0
  46. data/vendor/assets/stylesheets/twitter/_responsive-767px-max.scss +174 -0
  47. data/vendor/assets/stylesheets/twitter/_responsive-768px-979px.scss +19 -0
  48. data/vendor/assets/stylesheets/twitter/_responsive-navbar.scss +177 -0
  49. data/vendor/assets/stylesheets/twitter/_responsive-utilities.scss +58 -0
  50. data/vendor/assets/stylesheets/twitter/_scaffolding.scss +32 -11
  51. data/vendor/assets/stylesheets/twitter/_sprites.scss +49 -14
  52. data/vendor/assets/stylesheets/twitter/_tables.scss +115 -42
  53. data/vendor/assets/stylesheets/twitter/_thumbnails.scss +23 -6
  54. data/vendor/assets/stylesheets/twitter/_tooltip.scss +47 -12
  55. data/vendor/assets/stylesheets/twitter/_type.scss +96 -93
  56. data/vendor/assets/stylesheets/twitter/_utilities.scss +24 -2
  57. data/vendor/assets/stylesheets/twitter/_variables.scss +202 -31
  58. data/vendor/assets/stylesheets/twitter/_wells.scss +17 -5
  59. data/vendor/assets/stylesheets/twitter/bootstrap.scss +3 -7
  60. data/vendor/assets/stylesheets/twitter/responsive.scss +15 -301
  61. metadata +10 -7
  62. data/vendor/assets/stylesheets/tests/buttons.html +0 -139
  63. data/vendor/assets/stylesheets/tests/forms-responsive.html +0 -71
  64. data/vendor/assets/stylesheets/tests/navbar-fixed-top.html +0 -104
  65. data/vendor/assets/stylesheets/tests/navbar-static-top.html +0 -107
  66. data/vendor/assets/stylesheets/twitter/_labels.scss +0 -32
@@ -11,12 +11,9 @@
11
11
  <link href="../../docs/assets/css/bootstrap.css" rel="stylesheet">
12
12
  <style>
13
13
  body {
14
- padding-top: 0;
14
+ padding-top: 60px;
15
15
  padding-bottom: 30px;
16
16
  }
17
- .navbar {
18
- margin-top: 20px;
19
- }
20
17
  </style>
21
18
  <link href="../../docs/assets/css/bootstrap-responsive.css" rel="stylesheet">
22
19
 
@@ -26,15 +23,36 @@
26
23
  <![endif]-->
27
24
 
28
25
  <!-- Le fav and touch icons -->
26
+ <link rel="shortcut icon" href="../../docs/assets/ico/favicon.ico">
29
27
  <link rel="apple-touch-icon-precomposed" sizes="144x144" href="../../docs/assets/ico/apple-touch-icon-144-precomposed.png">
30
28
  <link rel="apple-touch-icon-precomposed" sizes="114x114" href="../../docs/assets/ico/apple-touch-icon-114-precomposed.png">
31
- <link rel="apple-touch-icon-precomposed" sizes="72x72" href="../../docs/assets/ico/apple-touch-icon-72-precomposed.png">
32
- <link rel="apple-touch-icon-precomposed" href="../../docs/assets/ico/apple-touch-icon-57-precomposed.png">
33
- <link rel="shortcut icon" href="../../docs/assets/ico/favicon.png">
29
+ <link rel="apple-touch-icon-precomposed" sizes="72x72" href="../../docs/assets/ico/apple-touch-icon-72-precomposed.png">
30
+ <link rel="apple-touch-icon-precomposed" href="../../docs/assets/ico/apple-touch-icon-57-precomposed.png">
34
31
  </head>
35
32
 
36
33
  <body>
37
34
 
35
+ <!-- Fixed navbar -->
36
+ <div class="navbar navbar-fixed-top">
37
+ <div class="navbar-inner">
38
+ <div class="container">
39
+ <a class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse">
40
+ <span class="icon-bar"></span>
41
+ <span class="icon-bar"></span>
42
+ <span class="icon-bar"></span>
43
+ </a>
44
+ <a class="brand" href="#">Project name</a>
45
+ <div class="nav-collapse">
46
+ <ul class="nav">
47
+ <li class="active"><a href="#">Home</a></li>
48
+ <li><a href="#about">About</a></li>
49
+ <li><a href="#contact">Contact</a></li>
50
+ </ul>
51
+ </div><!--/.nav-collapse -->
52
+ </div>
53
+ </div>
54
+ </div>
55
+
38
56
  <div class="container">
39
57
 
40
58
  <!-- Static navbar -->
@@ -47,28 +65,11 @@
47
65
  <span class="icon-bar"></span>
48
66
  </a>
49
67
  <a class="brand" href="#">Project name</a>
50
- <div class="nav-collapse collapse">
68
+ <div class="nav-collapse">
51
69
  <ul class="nav">
52
70
  <li class="active"><a href="#">Home</a></li>
53
71
  <li><a href="#about">About</a></li>
54
72
  <li><a href="#contact">Contact</a></li>
55
- <li class="dropdown">
56
- <a href="#" class="dropdown-toggle" data-toggle="dropdown">Dropdown <b class="caret"></b></a>
57
- <ul class="dropdown-menu">
58
- <li><a href="#">Action</a></li>
59
- <li><a href="#">Another action</a></li>
60
- <li><a href="#">Something else here</a></li>
61
- <li class="divider"></li>
62
- <li class="nav-header">Nav header</li>
63
- <li><a href="#">Separated link</a></li>
64
- <li><a href="#">One more separated link</a></li>
65
- </ul>
66
- </li>
67
- </ul>
68
- <ul class="nav pull-right">
69
- <li class="active"><a href="./navbar.html">Default</a></li>
70
- <li><a href="./navbar-static-top.html">Static top</a></li>
71
- <li><a href="./navbar-fixed-top.html">Fixed top</a></li>
72
73
  </ul>
73
74
  </div><!--/.nav-collapse -->
74
75
  </div>
@@ -89,19 +90,19 @@
89
90
  <!-- Le javascript
90
91
  ================================================== -->
91
92
  <!-- Placed at the end of the document so the pages load faster -->
92
- <script src="../../docs/assets/js/jquery.js"></script>
93
- <script src="../../docs/assets/js/bootstrap-transition.js"></script>
94
- <script src="../../docs/assets/js/bootstrap-alert.js"></script>
95
- <script src="../../docs/assets/js/bootstrap-modal.js"></script>
96
- <script src="../../docs/assets/js/bootstrap-dropdown.js"></script>
97
- <script src="../../docs/assets/js/bootstrap-scrollspy.js"></script>
98
- <script src="../../docs/assets/js/bootstrap-tab.js"></script>
99
- <script src="../../docs/assets/js/bootstrap-tooltip.js"></script>
100
- <script src="../../docs/assets/js/bootstrap-popover.js"></script>
101
- <script src="../../docs/assets/js/bootstrap-button.js"></script>
102
- <script src="../../docs/assets/js/bootstrap-collapse.js"></script>
103
- <script src="../../docs/assets/js/bootstrap-carousel.js"></script>
104
- <script src="../../docs/assets/js/bootstrap-typeahead.js"></script>
93
+ <script src="../assets/js/jquery.js"></script>
94
+ <script src="../assets/js/bootstrap-transition.js"></script>
95
+ <script src="../assets/js/bootstrap-alert.js"></script>
96
+ <script src="../assets/js/bootstrap-modal.js"></script>
97
+ <script src="../assets/js/bootstrap-dropdown.js"></script>
98
+ <script src="../assets/js/bootstrap-scrollspy.js"></script>
99
+ <script src="../assets/js/bootstrap-tab.js"></script>
100
+ <script src="../assets/js/bootstrap-tooltip.js"></script>
101
+ <script src="../assets/js/bootstrap-popover.js"></script>
102
+ <script src="../assets/js/bootstrap-button.js"></script>
103
+ <script src="../assets/js/bootstrap-collapse.js"></script>
104
+ <script src="../assets/js/bootstrap-carousel.js"></script>
105
+ <script src="../assets/js/bootstrap-typeahead.js"></script>
105
106
 
106
107
  </body>
107
108
  </html>
@@ -1,5 +1,6 @@
1
- // ACCORDION
2
- // ---------
1
+ //
2
+ // Accordion
3
+ // --------------------------------------------------
3
4
 
4
5
 
5
6
  // Parent container
@@ -21,6 +22,11 @@
21
22
  padding: 8px 15px;
22
23
  }
23
24
 
25
+ // General toggle styles
26
+ .accordion-toggle {
27
+ cursor: pointer;
28
+ }
29
+
24
30
  // Inner needs the styles because you can't animate properly with any styles on the element
25
31
  .accordion-inner {
26
32
  padding: 9px 15px;
@@ -1,7 +1,11 @@
1
- // ALERT STYLES
2
- // ------------
1
+ //
2
+ // Alerts
3
+ // --------------------------------------------------
4
+
5
+
6
+ // Base styles
7
+ // -------------------------
3
8
 
4
- // Base alert styles
5
9
  .alert {
6
10
  padding: 8px 35px 8px 14px;
7
11
  margin-bottom: $baseLineHeight;
@@ -9,54 +13,45 @@
9
13
  background-color: $warningBackground;
10
14
  border: 1px solid $warningBorder;
11
15
  @include border-radius(4px);
12
- }
13
- .alert,
14
- .alert-heading {
15
16
  color: $warningText;
16
17
  }
18
+ .alert h4 {
19
+ margin: 0;
20
+ }
17
21
 
18
22
  // Adjust close link position
19
23
  .alert .close {
20
24
  position: relative;
21
25
  top: -2px;
22
26
  right: -21px;
23
- line-height: 18px;
27
+ line-height: $baseLineHeight;
24
28
  }
25
29
 
30
+
26
31
  // Alternate styles
27
- // ----------------
32
+ // -------------------------
28
33
 
29
34
  .alert-success {
30
35
  background-color: $successBackground;
31
- border-color: $successBorder;
32
- }
33
- .alert-success,
34
- .alert-success .alert-heading {
36
+ border-color: $successBorder;
35
37
  color: $successText;
36
38
  }
37
39
  .alert-danger,
38
40
  .alert-error {
39
41
  background-color: $errorBackground;
40
42
  border-color: $errorBorder;
41
- }
42
- .alert-danger,
43
- .alert-error,
44
- .alert-danger .alert-heading,
45
- .alert-error .alert-heading {
46
43
  color: $errorText;
47
44
  }
48
45
  .alert-info {
49
46
  background-color: $infoBackground;
50
47
  border-color: $infoBorder;
51
- }
52
- .alert-info,
53
- .alert-info .alert-heading {
54
48
  color: $infoText;
55
49
  }
56
50
 
57
51
 
58
52
  // Block alerts
59
- // ------------------------
53
+ // -------------------------
54
+
60
55
  .alert-block {
61
56
  padding-top: 14px;
62
57
  padding-bottom: 14px;
@@ -1,22 +1,24 @@
1
- // BREADCRUMBS
2
- // -----------
1
+ //
2
+ // Breadcrumbs
3
+ // --------------------------------------------------
4
+
3
5
 
4
6
  .breadcrumb {
5
- padding: 7px 14px;
7
+ padding: 8px 15px;
6
8
  margin: 0 0 $baseLineHeight;
7
- @include gradient-vertical($white, #f5f5f5);
8
- border: 1px solid #ddd;
9
- @include border-radius(3px);
10
- @include box-shadow(inset 0 1px 0 $white);
9
+ list-style: none;
10
+ background-color: #f5f5f5;
11
+ @include border-radius(4px);
11
12
  li {
12
13
  display: inline-block;
14
+ @include ie7-inline-block();
13
15
  text-shadow: 0 1px 0 $white;
14
16
  }
15
17
  .divider {
16
18
  padding: 0 5px;
17
- color: $grayLight;
19
+ color: #ccc;
18
20
  }
19
- .active a {
20
- color: $grayDark;
21
+ .active {
22
+ color: $grayLight;
21
23
  }
22
24
  }
@@ -1,11 +1,14 @@
1
- // BUTTON GROUPS
2
- // -------------
1
+ //
2
+ // Button groups
3
+ // --------------------------------------------------
3
4
 
4
5
 
5
6
  // Make the div behave like a button
6
7
  .btn-group {
7
8
  position: relative;
8
- @include clearfix(); // clears the floated buttons
9
+ font-size: 0; // remove as part 1 of font-size inline-block hack
10
+ vertical-align: middle; // match .btn alignment given font-size hack above
11
+ white-space: nowrap; // prevent buttons from wrapping when in tight spaces (e.g., the table on the tests page)
9
12
  @include ie7-restore-left-whitespace();
10
13
  }
11
14
 
@@ -16,23 +19,46 @@
16
19
 
17
20
  // Optional: Group multiple button groups together for a toolbar
18
21
  .btn-toolbar {
22
+ font-size: 0; // Hack to remove whitespace that results from using inline-block
19
23
  margin-top: $baseLineHeight / 2;
20
24
  margin-bottom: $baseLineHeight / 2;
21
25
  .btn-group {
22
26
  display: inline-block;
23
27
  @include ie7-inline-block();
24
28
  }
29
+ .btn + .btn,
30
+ .btn-group + .btn,
31
+ .btn + .btn-group {
32
+ margin-left: 5px;
33
+ }
25
34
  }
26
35
 
27
36
  // Float them, remove border radius, then re-add to first and last elements
28
- .btn-group .btn {
37
+ .btn-group > .btn {
29
38
  position: relative;
30
- float: left;
31
- margin-left: -1px;
32
39
  @include border-radius(0);
33
40
  }
41
+ .btn-group > .btn + .btn {
42
+ margin-left: -1px;
43
+ }
44
+ .btn-group > .btn,
45
+ .btn-group > .dropdown-menu {
46
+ font-size: $baseFontSize; // redeclare as part 2 of font-size inline-block hack
47
+ }
48
+
49
+ // Reset fonts for other sizes
50
+ .btn-group > .btn-mini {
51
+ font-size: 11px;
52
+ }
53
+ .btn-group > .btn-small {
54
+ font-size: 12px;
55
+ }
56
+ .btn-group > .btn-large {
57
+ font-size: 16px;
58
+ }
59
+
34
60
  // Set corners individual because sometimes a single button can be in a .btn-group and we need :first-child and :last-child to both match
35
- .btn-group .btn:first-child {
61
+ .btn-group > .btn:first-child {
36
62
  margin-left: 0;
37
63
  -webkit-border-top-left-radius: 4px;
38
64
  -moz-border-radius-topleft: 4px;
@@ -41,8 +67,9 @@
41
67
  -moz-border-radius-bottomleft: 4px;
42
68
  border-bottom-left-radius: 4px;
43
69
  }
44
- .btn-group .btn:last-child,
45
- .btn-group .dropdown-toggle {
70
+ // Need .dropdown-toggle since :last-child doesn't apply given a .dropdown-menu immediately after it
71
+ .btn-group > .btn:last-child,
72
+ .btn-group > .dropdown-toggle {
46
73
  -webkit-border-top-right-radius: 4px;
47
74
  -moz-border-radius-topright: 4px;
48
75
  border-top-right-radius: 4px;
@@ -51,7 +78,7 @@
51
78
  border-bottom-right-radius: 4px;
52
79
  }
53
80
  // Reset corners for large buttons
54
- .btn-group .btn.large:first-child {
81
+ .btn-group > .btn.large:first-child {
55
82
  margin-left: 0;
56
83
  -webkit-border-top-left-radius: 6px;
57
84
  -moz-border-radius-topleft: 6px;
@@ -60,8 +87,8 @@
60
87
  -moz-border-radius-bottomleft: 6px;
61
88
  border-bottom-left-radius: 6px;
62
89
  }
63
- .btn-group .btn.large:last-child,
64
- .btn-group .large.dropdown-toggle {
90
+ .btn-group > .btn.large:last-child,
91
+ .btn-group > .large.dropdown-toggle {
65
92
  -webkit-border-top-right-radius: 6px;
66
93
  -moz-border-radius-topright: 6px;
67
94
  border-top-right-radius: 6px;
@@ -71,10 +98,10 @@
71
98
  }
72
99
 
73
100
  // On hover/focus/active, bring the proper btn to front
74
- .btn-group .btn:hover,
75
- .btn-group .btn:focus,
76
- .btn-group .btn:active,
77
- .btn-group .btn.active {
101
+ .btn-group > .btn:hover,
102
+ .btn-group > .btn:focus,
103
+ .btn-group > .btn:active,
104
+ .btn-group > .btn.active {
78
105
  z-index: 2;
79
106
  }
80
107
 
@@ -90,58 +117,129 @@
90
117
  // ----------------------
91
118
 
92
119
  // Give the line between buttons some depth
93
- .btn-group .dropdown-toggle {
120
+ .btn-group > .btn + .dropdown-toggle {
94
121
  padding-left: 8px;
95
122
  padding-right: 8px;
96
- $shadow: inset 1px 0 0 rgba(255,255,255,.125), inset 0 1px 0 rgba(255,255,255,.2), 0 1px 2px rgba(0,0,0,.05);
97
- @include box-shadow($shadow);
123
+ @include box-shadow(#{inset 1px 0 0 rgba(255,255,255,.125), inset 0 1px 0 rgba(255,255,255,.2), 0 1px 2px rgba(0,0,0,.05)});
98
124
  *padding-top: 5px;
99
125
  *padding-bottom: 5px;
100
126
  }
127
+ .btn-group > .btn-mini + .dropdown-toggle {
128
+ padding-left: 5px;
129
+ padding-right: 5px;
130
+ *padding-top: 2px;
131
+ *padding-bottom: 2px;
132
+ }
133
+ .btn-group > .btn-small + .dropdown-toggle {
134
+ *padding-top: 5px;
135
+ *padding-bottom: 4px;
136
+ }
137
+ .btn-group > .btn-large + .dropdown-toggle {
138
+ padding-left: 12px;
139
+ padding-right: 12px;
140
+ *padding-top: 7px;
141
+ *padding-bottom: 7px;
142
+ }
101
143
 
102
144
  .btn-group.open {
103
- // IE7's z-index only goes to the nearest positioned ancestor, which would
104
- // make the menu appear below buttons that appeared later on the page
105
- *z-index: $zindexDropdown;
106
-
107
- // Reposition menu on open and round all corners
108
- .dropdown-menu {
109
- display: block;
110
- margin-top: 1px;
111
- @include border-radius(5px);
112
- }
113
145
 
146
+ // The clickable button for toggling the menu
147
+ // Remove the gradient and set the same inset shadow as the :active state
114
148
  .dropdown-toggle {
115
149
  background-image: none;
116
- $shadow: inset 0 1px 6px rgba(0,0,0,.15), 0 1px 2px rgba(0,0,0,.05);
117
- @include box-shadow($shadow);
150
+ @include box-shadow(#{inset 0 2px 4px rgba(0,0,0,.15), 0 1px 2px rgba(0,0,0,.05)});
151
+ }
152
+
153
+ // Keep the hover's background when dropdown is open
154
+ .btn.dropdown-toggle {
155
+ background-color: $btnBackgroundHighlight;
156
+ }
157
+ .btn-primary.dropdown-toggle {
158
+ background-color: $btnPrimaryBackgroundHighlight;
159
+ }
160
+ .btn-warning.dropdown-toggle {
161
+ background-color: $btnWarningBackgroundHighlight;
162
+ }
163
+ .btn-danger.dropdown-toggle {
164
+ background-color: $btnDangerBackgroundHighlight;
165
+ }
166
+ .btn-success.dropdown-toggle {
167
+ background-color: $btnSuccessBackgroundHighlight;
168
+ }
169
+ .btn-info.dropdown-toggle {
170
+ background-color: $btnInfoBackgroundHighlight;
171
+ }
172
+ .btn-inverse.dropdown-toggle {
173
+ background-color: $btnInverseBackgroundHighlight;
118
174
  }
119
175
  }
120
176
 
177
+
121
178
  // Reposition the caret
122
179
  .btn .caret {
123
- margin-top: 7px;
180
+ margin-top: 8px;
124
181
  margin-left: 0;
125
182
  }
126
- .btn:hover .caret,
127
- .open.btn-group .caret {
128
- @include opacity(100);
183
+ // Carets in other button sizes
184
+ .btn-mini .caret,
185
+ .btn-small .caret,
186
+ .btn-large .caret {
187
+ margin-top: 6px;
188
+ }
189
+ .btn-large .caret {
190
+ border-left-width: 5px;
191
+ border-right-width: 5px;
192
+ border-top-width: 5px;
129
193
  }
194
+ // Upside down carets for .dropup
195
+ .dropup .btn-large .caret {
196
+ border-bottom: 5px solid $black;
197
+ border-top: 0;
198
+ }
199
+
130
200
 
131
201
 
132
202
  // Account for other colors
133
203
  .btn-primary,
204
+ .btn-warning,
134
205
  .btn-danger,
135
206
  .btn-info,
136
207
  .btn-success,
137
208
  .btn-inverse {
138
209
  .caret {
139
210
  border-top-color: $white;
140
- @include opacity(75);
211
+ border-bottom-color: $white;
141
212
  }
142
213
  }
143
214
 
144
- // Small button dropdowns
145
- .btn-small .caret {
146
- margin-top: 4px;
215
+
216
+
217
+ // Vertical button groups
218
+ // ----------------------
219
+
220
+ .btn-group-vertical {
221
+ display: inline-block; // makes buttons only take up the width they need
222
+ @include ie7-inline-block();
223
+ }
224
+ .btn-group-vertical .btn {
225
+ display: block;
226
+ float: none;
227
+ width: 100%;
228
+ @include border-radius(0);
229
+ }
230
+ .btn-group-vertical .btn + .btn {
231
+ margin-left: 0;
232
+ margin-top: -1px;
233
+ }
234
+ .btn-group-vertical .btn:first-child {
235
+ @include border-radius(4px 4px 0 0);
236
+ }
237
+ .btn-group-vertical .btn:last-child {
238
+ @include border-radius(0 0 4px 4px);
239
+ }
240
+ .btn-group-vertical .btn-large:first-child {
241
+ @include border-radius(6px 6px 0 0);
242
+ }
243
+ .btn-group-vertical .btn-large:last-child {
244
+ @include border-radius(0 0 6px 6px);
147
245
  }