sass-twitter-bootstrap 2.0.1 → 2.1.1
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.
- data/lib/sass/twitter/bootstrap/version.rb +1 -1
- data/vendor/assets/images/glyphicons-halflings-white.png +0 -0
- data/vendor/assets/images/glyphicons-halflings.png +0 -0
- data/vendor/assets/javascripts/twitter/bootstrap-affix.js +104 -0
- data/vendor/assets/javascripts/twitter/bootstrap-alert.js +28 -32
- data/vendor/assets/javascripts/twitter/bootstrap-button.js +29 -33
- data/vendor/assets/javascripts/twitter/bootstrap-carousel.js +43 -24
- data/vendor/assets/javascripts/twitter/bootstrap-collapse.js +50 -28
- data/vendor/assets/javascripts/twitter/bootstrap-dropdown.js +77 -19
- data/vendor/assets/javascripts/twitter/bootstrap-modal.js +113 -84
- data/vendor/assets/javascripts/twitter/bootstrap-popover.js +19 -11
- data/vendor/assets/javascripts/twitter/bootstrap-scrollspy.js +50 -24
- data/vendor/assets/javascripts/twitter/bootstrap-tab.js +13 -8
- data/vendor/assets/javascripts/twitter/bootstrap-tooltip.js +44 -39
- data/vendor/assets/javascripts/twitter/bootstrap-transition.js +29 -20
- data/vendor/assets/javascripts/twitter/bootstrap-typeahead.js +73 -44
- data/vendor/assets/javascripts/twitter/bootstrap.js +12 -0
- data/vendor/assets/stylesheets/tests/css-tests.css +1 -12
- data/vendor/assets/stylesheets/tests/css-tests.html +22 -125
- data/vendor/assets/stylesheets/tests/navbar.html +39 -38
- data/vendor/assets/stylesheets/twitter/_accordion.scss +8 -2
- data/vendor/assets/stylesheets/twitter/_alerts.scss +16 -21
- data/vendor/assets/stylesheets/twitter/_breadcrumbs.scss +12 -10
- data/vendor/assets/stylesheets/twitter/_button-groups.scss +137 -39
- data/vendor/assets/stylesheets/twitter/_buttons.scss +129 -81
- data/vendor/assets/stylesheets/twitter/_carousel.scss +13 -3
- data/vendor/assets/stylesheets/twitter/_close.scss +16 -3
- data/vendor/assets/stylesheets/twitter/_code.scss +11 -10
- data/vendor/assets/stylesheets/twitter/_component-animations.scss +12 -8
- data/vendor/assets/stylesheets/twitter/_dropdowns.scss +133 -53
- data/vendor/assets/stylesheets/twitter/_forms.scss +298 -170
- data/vendor/assets/stylesheets/twitter/_grid.scss +17 -4
- data/vendor/assets/stylesheets/twitter/_hero-unit.scss +7 -3
- data/vendor/assets/stylesheets/twitter/_labels-badges.scss +69 -0
- data/vendor/assets/stylesheets/twitter/_layouts.scss +2 -3
- data/vendor/assets/stylesheets/twitter/_mixins.scss +359 -258
- data/vendor/assets/stylesheets/twitter/_modals.scss +26 -12
- data/vendor/assets/stylesheets/twitter/_navbar.scss +318 -143
- data/vendor/assets/stylesheets/twitter/_navs.scss +87 -56
- data/vendor/assets/stylesheets/twitter/_pager.scss +16 -6
- data/vendor/assets/stylesheets/twitter/_pagination.scss +23 -14
- data/vendor/assets/stylesheets/twitter/_popovers.scss +101 -33
- data/vendor/assets/stylesheets/twitter/_progress-bars.scss +43 -16
- data/vendor/assets/stylesheets/twitter/_reset.scss +16 -6
- data/vendor/assets/stylesheets/twitter/_responsive-1200px-min.scss +28 -0
- data/vendor/assets/stylesheets/twitter/_responsive-767px-max.scss +174 -0
- data/vendor/assets/stylesheets/twitter/_responsive-768px-979px.scss +19 -0
- data/vendor/assets/stylesheets/twitter/_responsive-navbar.scss +177 -0
- data/vendor/assets/stylesheets/twitter/_responsive-utilities.scss +58 -0
- data/vendor/assets/stylesheets/twitter/_scaffolding.scss +32 -11
- data/vendor/assets/stylesheets/twitter/_sprites.scss +49 -14
- data/vendor/assets/stylesheets/twitter/_tables.scss +115 -42
- data/vendor/assets/stylesheets/twitter/_thumbnails.scss +23 -6
- data/vendor/assets/stylesheets/twitter/_tooltip.scss +47 -12
- data/vendor/assets/stylesheets/twitter/_type.scss +96 -93
- data/vendor/assets/stylesheets/twitter/_utilities.scss +24 -2
- data/vendor/assets/stylesheets/twitter/_variables.scss +202 -31
- data/vendor/assets/stylesheets/twitter/_wells.scss +17 -5
- data/vendor/assets/stylesheets/twitter/bootstrap.scss +3 -7
- data/vendor/assets/stylesheets/twitter/responsive.scss +15 -301
- metadata +10 -7
- data/vendor/assets/stylesheets/tests/buttons.html +0 -139
- data/vendor/assets/stylesheets/tests/forms-responsive.html +0 -71
- data/vendor/assets/stylesheets/tests/navbar-fixed-top.html +0 -104
- data/vendor/assets/stylesheets/tests/navbar-static-top.html +0 -107
- data/vendor/assets/stylesheets/twitter/_labels.scss +0 -32
@@ -1,8 +1,11 @@
|
|
1
|
-
//
|
2
|
-
//
|
1
|
+
//
|
2
|
+
// Modals
|
3
|
+
// --------------------------------------------------
|
3
4
|
|
4
|
-
|
5
|
-
|
5
|
+
|
6
|
+
// Recalculate z-index where appropriate,
|
7
|
+
// but only apply to elements within modal
|
8
|
+
.modal-open .modal {
|
6
9
|
.dropdown-menu { z-index: $zindexDropdown + $zindexModal; }
|
7
10
|
.dropdown.open { *z-index: $zindexDropdown + $zindexModal; }
|
8
11
|
.popover { z-index: $zindexPopover + $zindexModal; }
|
@@ -33,7 +36,6 @@
|
|
33
36
|
top: 50%;
|
34
37
|
left: 50%;
|
35
38
|
z-index: $zindexModal;
|
36
|
-
max-height: 500px;
|
37
39
|
overflow: auto;
|
38
40
|
width: 560px;
|
39
41
|
margin: -250px 0 0 -280px;
|
@@ -45,8 +47,7 @@
|
|
45
47
|
@include box-shadow(0 3px 7px rgba(0,0,0,0.3));
|
46
48
|
@include background-clip(padding-box);
|
47
49
|
&.fade {
|
48
|
-
@include transition(opacity .3s linear);
|
49
|
-
// @include transition(top .3s ease-out);
|
50
|
+
@include transition(#{opacity .3s linear, top .3s ease-out});
|
50
51
|
top: -25%;
|
51
52
|
}
|
52
53
|
&.fade.in { top: 50%; }
|
@@ -56,14 +57,21 @@
|
|
56
57
|
border-bottom: 1px solid #eee;
|
57
58
|
// Close icon
|
58
59
|
.close { margin-top: 2px; }
|
60
|
+
// Heading
|
61
|
+
h3 {
|
62
|
+
margin: 0;
|
63
|
+
line-height: 30px;
|
64
|
+
}
|
59
65
|
}
|
60
66
|
|
61
|
-
// Body (where all modal content
|
67
|
+
// Body (where all modal content resides)
|
62
68
|
.modal-body {
|
69
|
+
overflow-y: auto;
|
70
|
+
max-height: 400px;
|
63
71
|
padding: 15px;
|
64
72
|
}
|
65
73
|
// Remove bottom margin if need be
|
66
|
-
.modal-
|
74
|
+
.modal-form {
|
67
75
|
margin-bottom: 0;
|
68
76
|
}
|
69
77
|
|
@@ -71,14 +79,20 @@
|
|
71
79
|
.modal-footer {
|
72
80
|
padding: 14px 15px 15px;
|
73
81
|
margin-bottom: 0;
|
82
|
+
text-align: right; // right align buttons
|
74
83
|
background-color: #f5f5f5;
|
75
84
|
border-top: 1px solid #ddd;
|
76
85
|
@include border-radius(0 0 6px 6px);
|
77
86
|
@include box-shadow(inset 0 1px 0 $white);
|
78
|
-
@include clearfix();
|
79
|
-
|
80
|
-
|
87
|
+
@include clearfix(); // clear it in case folks use .pull-* classes on buttons
|
88
|
+
|
89
|
+
// Properly space out buttons
|
90
|
+
.btn + .btn {
|
81
91
|
margin-left: 5px;
|
82
92
|
margin-bottom: 0; // account for input[type="submit"] which gets the bottom margin like all other inputs
|
83
93
|
}
|
94
|
+
// but override that for button groups
|
95
|
+
.btn-group .btn + .btn {
|
96
|
+
margin-left: -1px;
|
97
|
+
}
|
84
98
|
}
|
@@ -1,103 +1,119 @@
|
|
1
|
-
//
|
2
|
-
//
|
1
|
+
//
|
2
|
+
// Navbars (Redux)
|
3
|
+
// --------------------------------------------------
|
3
4
|
|
4
5
|
|
5
6
|
// COMMON STYLES
|
6
7
|
// -------------
|
7
8
|
|
9
|
+
// Base class and wrapper
|
8
10
|
.navbar {
|
9
11
|
overflow: visible;
|
10
12
|
margin-bottom: $baseLineHeight;
|
13
|
+
color: $navbarText;
|
14
|
+
|
15
|
+
// Fix for IE7's bad z-indexing so dropdowns don't appear below content that follows the navbar
|
16
|
+
*position: relative;
|
17
|
+
*z-index: 2;
|
11
18
|
}
|
12
19
|
|
13
|
-
//
|
20
|
+
// Inner for background effects
|
21
|
+
// Gradient is applied to its own element because overflow visible is not honored by IE when filter is present
|
14
22
|
.navbar-inner {
|
23
|
+
min-height: $navbarHeight;
|
15
24
|
padding-left: 20px;
|
16
25
|
padding-right: 20px;
|
17
26
|
@include gradient-vertical($navbarBackgroundHighlight, $navbarBackground);
|
27
|
+
border: 1px solid $navbarBorder;
|
18
28
|
@include border-radius(4px);
|
19
|
-
|
20
|
-
@include box-shadow($shadow);
|
21
|
-
}
|
29
|
+
@include box-shadow(0 1px 4px rgba(0,0,0,.065));
|
22
30
|
|
23
|
-
//
|
24
|
-
|
25
|
-
display: none;
|
26
|
-
float: right;
|
27
|
-
padding: 7px 10px;
|
28
|
-
margin-left: 5px;
|
29
|
-
margin-right: 5px;
|
30
|
-
@include buttonBackground($navbarBackgroundHighlight, $navbarBackground);
|
31
|
-
$shadow: inset 0 1px 0 rgba(255,255,255,.1), 0 1px 0 rgba(255,255,255,.075);
|
32
|
-
@include box-shadow($shadow);
|
33
|
-
}
|
34
|
-
.btn-navbar .icon-bar {
|
35
|
-
display: block;
|
36
|
-
width: 18px;
|
37
|
-
height: 2px;
|
38
|
-
background-color: #f5f5f5;
|
39
|
-
@include border-radius(1px);
|
40
|
-
@include box-shadow(0 1px 0 rgba(0,0,0,.25));
|
31
|
+
// Prevent floats from breaking the navbar
|
32
|
+
@include clearfix();
|
41
33
|
}
|
42
|
-
|
43
|
-
|
34
|
+
|
35
|
+
// Set width to auto for default container
|
36
|
+
// We then reset it for fixed navbars in the #gridSystem mixin
|
37
|
+
.navbar .container {
|
38
|
+
width: auto;
|
44
39
|
}
|
40
|
+
|
45
41
|
// Override the default collapsed state
|
46
42
|
.nav-collapse.collapse {
|
47
43
|
height: auto;
|
48
44
|
}
|
49
45
|
|
50
46
|
|
51
|
-
// Brand
|
52
|
-
|
53
|
-
|
54
|
-
|
47
|
+
// Brand: website or project name
|
48
|
+
// -------------------------
|
49
|
+
.navbar .brand {
|
50
|
+
float: left;
|
51
|
+
display: block;
|
52
|
+
// Vertically center the text given $navbarHeight
|
53
|
+
padding: (($navbarHeight - $baseLineHeight) / 2) 20px (($navbarHeight - $baseLineHeight) / 2);
|
54
|
+
margin-left: -20px; // negative indent to left-align the text down the page
|
55
|
+
font-size: 20px;
|
56
|
+
font-weight: 200;
|
57
|
+
color: $navbarBrandColor;
|
58
|
+
text-shadow: 0 1px 0 $navbarBackgroundHighlight;
|
59
|
+
&:hover {
|
55
60
|
text-decoration: none;
|
56
61
|
}
|
57
|
-
|
58
|
-
|
59
|
-
|
60
|
-
|
61
|
-
|
62
|
-
|
63
|
-
|
64
|
-
|
65
|
-
|
66
|
-
|
67
|
-
|
68
|
-
|
69
|
-
|
70
|
-
|
71
|
-
|
72
|
-
color: $navbarText;
|
73
|
-
a:hover {
|
74
|
-
color: $white;
|
75
|
-
background-color: transparent;
|
76
|
-
}
|
77
|
-
}
|
78
|
-
// Buttons in navbar
|
79
|
-
.btn,
|
80
|
-
.btn-group {
|
81
|
-
margin-top: 5px; // make buttons vertically centered in navbar
|
82
|
-
}
|
83
|
-
.btn-group .btn {
|
84
|
-
margin-top: 0; // then undo the margin here so we don't accidentally double it
|
62
|
+
}
|
63
|
+
|
64
|
+
// Plain text in topbar
|
65
|
+
// -------------------------
|
66
|
+
.navbar-text {
|
67
|
+
margin-bottom: 0;
|
68
|
+
line-height: $navbarHeight;
|
69
|
+
}
|
70
|
+
|
71
|
+
// Janky solution for now to account for links outside the .nav
|
72
|
+
// -------------------------
|
73
|
+
.navbar-link {
|
74
|
+
color: $navbarLinkColor;
|
75
|
+
&:hover {
|
76
|
+
color: $navbarLinkColorHover;
|
85
77
|
}
|
86
78
|
}
|
87
79
|
|
80
|
+
// Dividers in navbar
|
81
|
+
// -------------------------
|
82
|
+
.navbar .divider-vertical {
|
83
|
+
height: $navbarHeight;
|
84
|
+
margin: 0 9px;
|
85
|
+
border-left: 1px solid $navbarBackground;
|
86
|
+
border-right: 1px solid $navbarBackgroundHighlight;
|
87
|
+
}
|
88
|
+
|
89
|
+
// Buttons in navbar
|
90
|
+
// -------------------------
|
91
|
+
.navbar .btn,
|
92
|
+
.navbar .btn-group {
|
93
|
+
@include navbarVerticalAlign(30px); // Vertically center in navbar
|
94
|
+
}
|
95
|
+
.navbar .btn-group .btn,
|
96
|
+
.navbar .input-prepend .btn,
|
97
|
+
.navbar .input-append .btn {
|
98
|
+
margin-top: 0; // then undo the margin here so we don't accidentally double it
|
99
|
+
}
|
100
|
+
|
88
101
|
// Navbar forms
|
102
|
+
// -------------------------
|
89
103
|
.navbar-form {
|
90
104
|
margin-bottom: 0; // remove default bottom margin
|
91
105
|
@include clearfix();
|
92
106
|
input,
|
93
|
-
select
|
94
|
-
display: inline-block;
|
95
|
-
margin-top: 5px;
|
96
|
-
margin-bottom: 0;
|
97
|
-
}
|
107
|
+
select,
|
98
108
|
.radio,
|
99
109
|
.checkbox {
|
100
|
-
|
110
|
+
@include navbarVerticalAlign(30px); // Vertically center in navbar
|
111
|
+
}
|
112
|
+
input,
|
113
|
+
select,
|
114
|
+
.btn {
|
115
|
+
display: inline-block;
|
116
|
+
margin-bottom: 0;
|
101
117
|
}
|
102
118
|
input[type="image"],
|
103
119
|
input[type="checkbox"],
|
@@ -115,63 +131,90 @@
|
|
115
131
|
}
|
116
132
|
|
117
133
|
// Navbar search
|
134
|
+
// -------------------------
|
118
135
|
.navbar-search {
|
119
136
|
position: relative;
|
120
137
|
float: left;
|
121
|
-
|
138
|
+
@include navbarVerticalAlign(30px); // Vertically center in navbar
|
122
139
|
margin-bottom: 0;
|
123
140
|
.search-query {
|
124
|
-
|
141
|
+
margin-bottom: 0;
|
142
|
+
padding: 4px 14px;
|
125
143
|
@include font-sans-serif(13px, normal, 1);
|
126
|
-
|
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
|
-
@include box-shadow($shadow);
|
133
|
-
@include transition(none);
|
134
|
-
|
135
|
-
// Placeholder text gets special styles; can't be bundled together though for some reason
|
136
|
-
@include placeholder($grayLighter);
|
137
|
-
|
138
|
-
// Hover states
|
139
|
-
&:hover {
|
140
|
-
color: $white;
|
141
|
-
background-color: $grayLight;
|
142
|
-
background-color: rgba(255,255,255,.5);
|
143
|
-
}
|
144
|
-
// Focus states (we use .focused since IE7-8 and down doesn't support :focus)
|
145
|
-
&:focus,
|
146
|
-
&.focused {
|
147
|
-
padding: 5px 10px;
|
148
|
-
color: $grayDark;
|
149
|
-
text-shadow: 0 1px 0 $white;
|
150
|
-
background-color: $white;
|
151
|
-
border: 0;
|
152
|
-
@include box-shadow(0 0 3px rgba(0,0,0,.15));
|
153
|
-
outline: 0;
|
154
|
-
}
|
144
|
+
@include border-radius(15px); // redeclare because of specificity of the type attribute
|
155
145
|
}
|
156
146
|
}
|
157
147
|
|
158
148
|
|
159
|
-
// FIXED NAVBAR
|
160
|
-
// ------------
|
161
149
|
|
162
|
-
|
150
|
+
// Static navbar
|
151
|
+
// -------------------------
|
152
|
+
|
153
|
+
.navbar-static-top {
|
154
|
+
position: static;
|
155
|
+
width: 100%;
|
156
|
+
margin-bottom: 0; // remove 18px margin for default navbar
|
157
|
+
.navbar-inner {
|
158
|
+
@include border-radius(0);
|
159
|
+
}
|
160
|
+
}
|
161
|
+
|
162
|
+
|
163
|
+
|
164
|
+
// Fixed navbar
|
165
|
+
// -------------------------
|
166
|
+
|
167
|
+
// Shared (top/bottom) styles
|
168
|
+
.navbar-fixed-top,
|
169
|
+
.navbar-fixed-bottom {
|
163
170
|
position: fixed;
|
164
|
-
top: 0;
|
165
171
|
right: 0;
|
166
172
|
left: 0;
|
167
173
|
z-index: $zindexFixedNavbar;
|
174
|
+
margin-bottom: 0; // remove 18px margin for default navbar
|
168
175
|
}
|
169
|
-
.navbar-fixed-top .navbar-inner
|
176
|
+
.navbar-fixed-top .navbar-inner,
|
177
|
+
.navbar-static-top .navbar-inner {
|
178
|
+
border-width: 0 0 1px;
|
179
|
+
}
|
180
|
+
.navbar-fixed-bottom .navbar-inner {
|
181
|
+
border-width: 1px 0 0;
|
182
|
+
}
|
183
|
+
.navbar-fixed-top .navbar-inner,
|
184
|
+
.navbar-fixed-bottom .navbar-inner {
|
170
185
|
padding-left: 0;
|
171
186
|
padding-right: 0;
|
172
187
|
@include border-radius(0);
|
173
188
|
}
|
174
189
|
|
190
|
+
// Reset container width
|
191
|
+
// Required here as we reset the width earlier on and the grid mixins don't override early enough
|
192
|
+
.navbar-static-top .container,
|
193
|
+
.navbar-fixed-top .container,
|
194
|
+
.navbar-fixed-bottom .container {
|
195
|
+
@include grid-core-span($gridColumns, $gridColumnWidth, $gridGutterWidth);
|
196
|
+
}
|
197
|
+
|
198
|
+
// Fixed to top
|
199
|
+
.navbar-fixed-top {
|
200
|
+
top: 0;
|
201
|
+
}
|
202
|
+
.navbar-fixed-top,
|
203
|
+
.navbar-static-top {
|
204
|
+
.navbar-inner {
|
205
|
+
@include box-shadow(#{inset 0 -1px 0 rgba(0,0,0,.1), 0 1px 10px rgba(0,0,0,.1)});
|
206
|
+
}
|
207
|
+
}
|
208
|
+
|
209
|
+
// Fixed to bottom
|
210
|
+
.navbar-fixed-bottom {
|
211
|
+
bottom: 0;
|
212
|
+
.navbar-inner {
|
213
|
+
@include box-shadow(#{inset 0 1px 0 rgba(0,0,0,.1), 0 -1px 10px rgba(0,0,0,.1)});
|
214
|
+
}
|
215
|
+
}
|
216
|
+
|
217
|
+
|
175
218
|
|
176
219
|
// NAVIGATION
|
177
220
|
// ----------
|
@@ -185,22 +228,27 @@
|
|
185
228
|
}
|
186
229
|
.navbar .nav.pull-right {
|
187
230
|
float: right; // redeclare due to specificity
|
231
|
+
margin-right: 0; // remove margin on float right nav
|
188
232
|
}
|
189
233
|
.navbar .nav > li {
|
190
|
-
display: block;
|
191
234
|
float: left;
|
192
235
|
}
|
193
236
|
|
194
237
|
// Links
|
195
238
|
.navbar .nav > li > a {
|
196
239
|
float: none;
|
197
|
-
|
198
|
-
|
240
|
+
// Vertically center the text given $navbarHeight
|
241
|
+
padding: (($navbarHeight - $baseLineHeight) / 2) 15px (($navbarHeight - $baseLineHeight) / 2);
|
199
242
|
color: $navbarLinkColor;
|
200
243
|
text-decoration: none;
|
201
|
-
text-shadow: 0
|
244
|
+
text-shadow: 0 1px 0 $navbarBackgroundHighlight;
|
245
|
+
}
|
246
|
+
.navbar .nav .dropdown-toggle .caret {
|
247
|
+
margin-top: 8px;
|
202
248
|
}
|
249
|
+
|
203
250
|
// Hover
|
251
|
+
.navbar .nav > li > a:focus,
|
204
252
|
.navbar .nav > li > a:hover {
|
205
253
|
background-color: $navbarLinkBackgroundHover; // "transparent" is default to differentiate :hover from .active
|
206
254
|
color: $navbarLinkColorHover;
|
@@ -208,27 +256,38 @@
|
|
208
256
|
}
|
209
257
|
|
210
258
|
// Active nav items
|
211
|
-
.navbar .nav .active > a,
|
212
|
-
.navbar .nav .active > a:hover
|
213
|
-
|
259
|
+
.navbar .nav > .active > a,
|
260
|
+
.navbar .nav > .active > a:hover,
|
261
|
+
.navbar .nav > .active > a:focus {
|
262
|
+
color: $navbarLinkColorActive;
|
214
263
|
text-decoration: none;
|
215
|
-
background-color: $
|
264
|
+
background-color: $navbarLinkBackgroundActive;
|
265
|
+
-webkit-box-shadow: inset 0 3px 8px rgba(0,0,0,.125);
|
266
|
+
-moz-box-shadow: inset 0 3px 8px rgba(0,0,0,.125);
|
267
|
+
box-shadow: inset 0 3px 8px rgba(0,0,0,.125);
|
216
268
|
}
|
217
269
|
|
218
|
-
//
|
219
|
-
.navbar .
|
220
|
-
|
221
|
-
|
222
|
-
|
223
|
-
|
224
|
-
|
225
|
-
|
270
|
+
// Navbar button for toggling navbar items in responsive layouts
|
271
|
+
// These definitions need to come after '.navbar .btn'
|
272
|
+
.navbar .btn-navbar {
|
273
|
+
display: none;
|
274
|
+
float: right;
|
275
|
+
padding: 7px 10px;
|
276
|
+
margin-left: 5px;
|
277
|
+
margin-right: 5px;
|
278
|
+
@include buttonBackground(darken($navbarBackgroundHighlight, 5%), darken($navbarBackground, 5.25%));
|
279
|
+
@include box-shadow(#{inset 0 1px 0 rgba(255,255,255,.1), 0 1px 0 rgba(255,255,255,.075)});
|
226
280
|
}
|
227
|
-
|
228
|
-
|
229
|
-
|
230
|
-
|
231
|
-
|
281
|
+
.navbar .btn-navbar .icon-bar {
|
282
|
+
display: block;
|
283
|
+
width: 18px;
|
284
|
+
height: 2px;
|
285
|
+
background-color: #f5f5f5;
|
286
|
+
@include border-radius(1px);
|
287
|
+
@include box-shadow(0 1px 0 rgba(0,0,0,.25));
|
288
|
+
}
|
289
|
+
.btn-navbar .icon-bar + .icon-bar {
|
290
|
+
margin-top: 3px;
|
232
291
|
}
|
233
292
|
|
234
293
|
|
@@ -237,16 +296,14 @@
|
|
237
296
|
// --------------
|
238
297
|
|
239
298
|
// Menu position and menu carets
|
240
|
-
.navbar .dropdown-menu {
|
241
|
-
margin-top: 1px;
|
242
|
-
@include border-radius(4px);
|
299
|
+
.navbar .nav > li > .dropdown-menu {
|
243
300
|
&:before {
|
244
301
|
content: '';
|
245
302
|
display: inline-block;
|
246
303
|
border-left: 7px solid transparent;
|
247
304
|
border-right: 7px solid transparent;
|
248
305
|
border-bottom: 7px solid #ccc;
|
249
|
-
border-bottom-color:
|
306
|
+
border-bottom-color: $dropdownBorder;
|
250
307
|
position: absolute;
|
251
308
|
top: -7px;
|
252
309
|
left: 9px;
|
@@ -256,36 +313,50 @@
|
|
256
313
|
display: inline-block;
|
257
314
|
border-left: 6px solid transparent;
|
258
315
|
border-right: 6px solid transparent;
|
259
|
-
border-bottom: 6px solid $
|
316
|
+
border-bottom: 6px solid $dropdownBackground;
|
260
317
|
position: absolute;
|
261
318
|
top: -6px;
|
262
319
|
left: 10px;
|
263
320
|
}
|
264
321
|
}
|
265
|
-
|
266
|
-
|
267
|
-
|
268
|
-
|
269
|
-
|
270
|
-
|
271
|
-
|
272
|
-
|
322
|
+
// Menu position and menu caret support for dropups via extra dropup class
|
323
|
+
.navbar-fixed-bottom .dropdown-menu {
|
324
|
+
&:before {
|
325
|
+
border-top: 7px solid #ccc;
|
326
|
+
border-top-color: $dropdownBorder;
|
327
|
+
border-bottom: 0;
|
328
|
+
bottom: -7px;
|
329
|
+
top: auto;
|
330
|
+
}
|
331
|
+
&:after {
|
332
|
+
border-top: 6px solid $dropdownBackground;
|
333
|
+
border-bottom: 0;
|
334
|
+
bottom: -6px;
|
335
|
+
top: auto;
|
336
|
+
}
|
273
337
|
}
|
274
338
|
|
275
339
|
// 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 {
|
279
|
-
background-color:
|
340
|
+
.navbar .nav li.dropdown.open > .dropdown-toggle,
|
341
|
+
.navbar .nav li.dropdown.active > .dropdown-toggle,
|
342
|
+
.navbar .nav li.dropdown.open.active > .dropdown-toggle {
|
343
|
+
background-color: $navbarLinkBackgroundActive;
|
344
|
+
color: $navbarLinkColorActive;
|
280
345
|
}
|
281
|
-
|
282
|
-
|
283
|
-
|
284
|
-
|
346
|
+
.navbar .nav li.dropdown > .dropdown-toggle .caret {
|
347
|
+
border-top-color: $navbarLinkColor;
|
348
|
+
border-bottom-color: $navbarLinkColor;
|
349
|
+
}
|
350
|
+
.navbar .nav li.dropdown.open > .dropdown-toggle .caret,
|
351
|
+
.navbar .nav li.dropdown.active > .dropdown-toggle .caret,
|
352
|
+
.navbar .nav li.dropdown.open.active > .dropdown-toggle .caret {
|
353
|
+
border-top-color: $navbarLinkColorActive;
|
354
|
+
border-bottom-color: $navbarLinkColorActive;
|
285
355
|
}
|
286
356
|
|
287
357
|
// Right aligned menus need alt position
|
288
|
-
.navbar .
|
358
|
+
.navbar .pull-right > li > .dropdown-menu,
|
359
|
+
.navbar .nav > li > .dropdown-menu.pull-right {
|
289
360
|
left: auto;
|
290
361
|
right: 0;
|
291
362
|
&:before {
|
@@ -296,4 +367,108 @@
|
|
296
367
|
left: auto;
|
297
368
|
right: 13px;
|
298
369
|
}
|
370
|
+
.dropdown-menu {
|
371
|
+
left: auto;
|
372
|
+
right: 100%;
|
373
|
+
margin-left: 0;
|
374
|
+
margin-right: -1px;
|
375
|
+
@include border-radius(6px 0 6px 6px);
|
376
|
+
}
|
377
|
+
}
|
378
|
+
|
379
|
+
|
380
|
+
// Inverted navbar
|
381
|
+
// -------------------------
|
382
|
+
|
383
|
+
.navbar-inverse {
|
384
|
+
color: $navbarInverseText;
|
385
|
+
|
386
|
+
.navbar-inner {
|
387
|
+
@include gradient-vertical($navbarInverseBackgroundHighlight, $navbarInverseBackground);
|
388
|
+
border-color: $navbarInverseBorder;
|
389
|
+
}
|
390
|
+
|
391
|
+
.brand,
|
392
|
+
.nav > li > a {
|
393
|
+
color: $navbarInverseLinkColor;
|
394
|
+
text-shadow: 0 -1px 0 rgba(0,0,0,.25);
|
395
|
+
&:hover {
|
396
|
+
color: $navbarInverseLinkColorHover;
|
397
|
+
}
|
398
|
+
}
|
399
|
+
|
400
|
+
.nav > li > a:focus,
|
401
|
+
.nav > li > a:hover {
|
402
|
+
background-color: $navbarInverseLinkBackgroundHover;
|
403
|
+
color: $navbarInverseLinkColorHover;
|
404
|
+
}
|
405
|
+
|
406
|
+
.nav .active > a,
|
407
|
+
.nav .active > a:hover,
|
408
|
+
.nav .active > a:focus {
|
409
|
+
color: $navbarInverseLinkColorActive;
|
410
|
+
background-color: $navbarInverseLinkBackgroundActive;
|
411
|
+
}
|
412
|
+
|
413
|
+
// Inline text links
|
414
|
+
.navbar-link {
|
415
|
+
color: $navbarInverseLinkColor;
|
416
|
+
&:hover {
|
417
|
+
color: $navbarInverseLinkColorHover;
|
418
|
+
}
|
419
|
+
}
|
420
|
+
|
421
|
+
// Dividers in navbar
|
422
|
+
.divider-vertical {
|
423
|
+
border-left-color: $navbarInverseBackground;
|
424
|
+
border-right-color: $navbarInverseBackgroundHighlight;
|
425
|
+
}
|
426
|
+
|
427
|
+
// Dropdowns
|
428
|
+
.nav li.dropdown.open > .dropdown-toggle,
|
429
|
+
.nav li.dropdown.active > .dropdown-toggle,
|
430
|
+
.nav li.dropdown.open.active > .dropdown-toggle {
|
431
|
+
background-color: $navbarInverseLinkBackgroundActive;
|
432
|
+
color: $navbarInverseLinkColorActive;
|
433
|
+
}
|
434
|
+
.nav li.dropdown > .dropdown-toggle .caret {
|
435
|
+
border-top-color: $navbarInverseLinkColor;
|
436
|
+
border-bottom-color: $navbarInverseLinkColor;
|
437
|
+
}
|
438
|
+
.nav li.dropdown.open > .dropdown-toggle .caret,
|
439
|
+
.nav li.dropdown.active > .dropdown-toggle .caret,
|
440
|
+
.nav li.dropdown.open.active > .dropdown-toggle .caret {
|
441
|
+
border-top-color: $navbarInverseLinkColorActive;
|
442
|
+
border-bottom-color: $navbarInverseLinkColorActive;
|
443
|
+
}
|
444
|
+
|
445
|
+
// Navbar search
|
446
|
+
.navbar-search {
|
447
|
+
.search-query {
|
448
|
+
color: $white;
|
449
|
+
background-color: $navbarInverseSearchBackground;
|
450
|
+
border-color: $navbarInverseSearchBorder;
|
451
|
+
@include box-shadow(#{inset 0 1px 2px rgba(0,0,0,.1), 0 1px 0 rgba(255,255,255,.15)});
|
452
|
+
@include transition(none);
|
453
|
+
@include placeholder($navbarInverseSearchPlaceholderColor);
|
454
|
+
|
455
|
+
// Focus states (we use .focused since IE7-8 and down doesn't support :focus)
|
456
|
+
&:focus,
|
457
|
+
&.focused {
|
458
|
+
padding: 5px 15px;
|
459
|
+
color: $grayDark;
|
460
|
+
text-shadow: 0 1px 0 $white;
|
461
|
+
background-color: $navbarInverseSearchBackgroundFocus;
|
462
|
+
border: 0;
|
463
|
+
@include box-shadow(0 0 3px rgba(0,0,0,.15));
|
464
|
+
outline: 0;
|
465
|
+
}
|
466
|
+
}
|
467
|
+
}
|
468
|
+
|
469
|
+
// Navbar collapse button
|
470
|
+
.btn-navbar {
|
471
|
+
@include buttonBackground(darken($navbarInverseBackgroundHighlight, 5%), darken($navbarInverseBackground, 5%));
|
472
|
+
}
|
473
|
+
|
299
474
|
}
|