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.
- data/README.md +258 -33
- data/Rakefile +0 -59
- data/lib/bootstrap/generators/engine.rb +6 -1
- data/lib/bootstrap/generators/version.rb +1 -1
- data/lib/generators/bootstrap/install/install_generator.rb +10 -2
- data/lib/generators/bootstrap/install/templates/assets/stylesheets/bootstrap-variables.css.scss +120 -15
- data/lib/generators/bootstrap/install/templates/assets/stylesheets/bootstrap-variables.less +206 -0
- data/lib/generators/bootstrap/install/templates/assets/stylesheets/fluid.css +2 -0
- data/lib/generators/bootstrap/install/templates/assets/stylesheets/fluid.css.less +5 -4
- data/lib/generators/bootstrap/install/templates/assets/stylesheets/fluid.css.scss +3 -2
- data/lib/generators/bootstrap/install/templates/assets/stylesheets/hero.css +2 -0
- data/lib/generators/bootstrap/install/templates/assets/stylesheets/hero.css.less +5 -4
- data/lib/generators/bootstrap/install/templates/assets/stylesheets/hero.css.scss +3 -2
- data/lib/generators/bootstrap/install/templates/config/initializers/simple_form.rb +3 -0
- data/lib/generators/bootstrap/install/templates/form_builders/form_builder/_form.html.erb +3 -3
- data/lib/generators/bootstrap/install/templates/form_builders/form_builder/_form.html.haml +2 -2
- data/lib/generators/bootstrap/install/templates/form_builders/simple_form/_form.html.erb +1 -1
- data/lib/generators/bootstrap/install/templates/form_builders/simple_form/_form.html.haml +1 -1
- data/test/fixtures/application.js +3 -0
- data/test/lib/generators/bootstrap/install_generator_test.rb +4 -3
- data/test/test_helper.rb +8 -1
- data/vendor/assets/images/glyphicons-halflings-white.png +0 -0
- data/vendor/assets/images/glyphicons-halflings.png +0 -0
- data/vendor/assets/javascripts/bootstrap-alert.js +28 -32
- data/vendor/assets/javascripts/bootstrap-button.js +29 -33
- data/vendor/assets/javascripts/bootstrap-carousel.js +33 -21
- data/vendor/assets/javascripts/bootstrap-collapse.js +47 -26
- data/vendor/assets/javascripts/bootstrap-dropdown.js +18 -10
- data/vendor/assets/javascripts/bootstrap-modal.js +25 -17
- data/vendor/assets/javascripts/bootstrap-popover.js +13 -10
- data/vendor/assets/javascripts/bootstrap-scrollspy.js +44 -18
- data/vendor/assets/javascripts/bootstrap-tab.js +12 -7
- data/vendor/assets/javascripts/bootstrap-tooltip.js +40 -35
- data/vendor/assets/javascripts/bootstrap-transition.js +30 -20
- data/vendor/assets/javascripts/bootstrap-typeahead.js +29 -15
- data/vendor/{assets/stylesheets → twitter/bootstrap}/less/accordion.less +5 -0
- data/vendor/{assets/stylesheets → twitter/bootstrap}/less/alerts.less +2 -14
- data/vendor/{assets/stylesheets → twitter/bootstrap}/less/bootstrap.less +2 -2
- data/vendor/{assets/stylesheets → twitter/bootstrap}/less/breadcrumbs.less +2 -0
- data/vendor/{assets/stylesheets → twitter/bootstrap}/less/button-groups.less +76 -33
- data/vendor/{assets/stylesheets → twitter/bootstrap}/less/buttons.less +32 -24
- data/vendor/{assets/stylesheets → twitter/bootstrap}/less/carousel.less +0 -0
- data/vendor/{assets/stylesheets → twitter/bootstrap}/less/close.less +12 -1
- data/vendor/{assets/stylesheets → twitter/bootstrap}/less/code.less +6 -6
- data/vendor/{assets/stylesheets → twitter/bootstrap}/less/component-animations.less +7 -5
- data/vendor/{assets/stylesheets → twitter/bootstrap}/less/dropdowns.less +58 -45
- data/vendor/{assets/stylesheets → twitter/bootstrap}/less/forms.less +205 -144
- data/vendor/twitter/bootstrap/less/grid.less +5 -0
- data/vendor/{assets/stylesheets → twitter/bootstrap}/less/hero-unit.less +3 -1
- data/vendor/twitter/bootstrap/less/labels-badges.less +55 -0
- data/vendor/{assets/stylesheets → twitter/bootstrap}/less/layouts.less +1 -1
- data/vendor/{assets/stylesheets → twitter/bootstrap}/less/mixins.less +235 -179
- data/vendor/{assets/stylesheets → twitter/bootstrap}/less/modals.less +13 -6
- data/vendor/{assets/stylesheets → twitter/bootstrap}/less/navbar.less +131 -72
- data/vendor/{assets/stylesheets → twitter/bootstrap}/less/navs.less +53 -43
- data/vendor/{assets/stylesheets → twitter/bootstrap}/less/pager.less +6 -0
- data/vendor/{assets/stylesheets → twitter/bootstrap}/less/pagination.less +1 -0
- data/vendor/{assets/stylesheets → twitter/bootstrap}/less/popovers.less +0 -0
- data/vendor/{assets/stylesheets → twitter/bootstrap}/less/progress-bars.less +27 -5
- data/vendor/{assets/stylesheets → twitter/bootstrap}/less/reset.less +8 -3
- data/vendor/twitter/bootstrap/less/responsive-1200px-min.less +26 -0
- data/vendor/twitter/bootstrap/less/responsive-767px-max.less +149 -0
- data/vendor/twitter/bootstrap/less/responsive-768px-979px.less +17 -0
- data/vendor/twitter/bootstrap/less/responsive-navbar.less +153 -0
- data/vendor/twitter/bootstrap/less/responsive-utilities.less +41 -0
- data/vendor/twitter/bootstrap/less/responsive.less +48 -0
- data/vendor/{assets/stylesheets → twitter/bootstrap}/less/scaffolding.less +4 -4
- data/vendor/{assets/stylesheets → twitter/bootstrap}/less/sprites.less +42 -9
- data/vendor/{assets/stylesheets → twitter/bootstrap}/less/tables.less +46 -20
- data/vendor/{assets/stylesheets → twitter/bootstrap}/less/thumbnails.less +14 -2
- data/vendor/{assets/stylesheets → twitter/bootstrap}/less/tooltip.less +0 -0
- data/vendor/{assets/stylesheets → twitter/bootstrap}/less/type.less +27 -13
- data/vendor/{assets/stylesheets → twitter/bootstrap}/less/utilities.less +0 -0
- data/vendor/twitter/bootstrap/less/variables.less +206 -0
- data/vendor/{assets/stylesheets → twitter/bootstrap}/less/wells.less +10 -0
- data/vendor/{assets/stylesheets/scss/accordion.scss → twitter/bootstrap/sass/_accordion.scss} +5 -0
- data/vendor/{assets/stylesheets/scss/alerts.scss → twitter/bootstrap/sass/_alerts.scss} +3 -15
- data/vendor/{assets/stylesheets/scss/breadcrumbs.scss → twitter/bootstrap/sass/_breadcrumbs.scss} +2 -0
- data/vendor/{assets/stylesheets/scss/button-groups.scss → twitter/bootstrap/sass/_button-groups.scss} +76 -33
- data/vendor/{assets/stylesheets/scss/buttons.scss → twitter/bootstrap/sass/_buttons.scss} +33 -25
- data/vendor/{assets/stylesheets/scss/carousel.scss → twitter/bootstrap/sass/_carousel.scss} +1 -1
- data/vendor/{assets/stylesheets/scss/close.scss → twitter/bootstrap/sass/_close.scss} +12 -1
- data/vendor/{assets/stylesheets/scss/code.scss → twitter/bootstrap/sass/_code.scss} +7 -7
- data/vendor/{assets/stylesheets/scss/component-animations.scss → twitter/bootstrap/sass/_component-animations.scss} +9 -7
- data/vendor/{assets/stylesheets/scss/dropdowns.scss → twitter/bootstrap/sass/_dropdowns.scss} +58 -45
- data/vendor/{assets/stylesheets/scss/forms.scss → twitter/bootstrap/sass/_forms.scss} +205 -145
- data/vendor/twitter/bootstrap/sass/_grid.scss +5 -0
- data/vendor/{assets/stylesheets/scss/hero-unit.scss → twitter/bootstrap/sass/_hero-unit.scss} +3 -1
- data/vendor/twitter/bootstrap/sass/_labels-badges.scss +52 -0
- data/vendor/{assets/stylesheets/scss/layouts.scss → twitter/bootstrap/sass/_layouts.scss} +2 -2
- data/vendor/{assets/stylesheets/scss/mixins.scss → twitter/bootstrap/sass/_mixins.scss} +246 -182
- data/vendor/{assets/stylesheets/scss/modals.scss → twitter/bootstrap/sass/_modals.scss} +14 -7
- data/vendor/{assets/stylesheets/scss/navbar.scss → twitter/bootstrap/sass/_navbar.scss} +132 -73
- data/vendor/{assets/stylesheets/scss/navs.scss → twitter/bootstrap/sass/_navs.scss} +53 -43
- data/vendor/{assets/stylesheets/scss/pager.scss → twitter/bootstrap/sass/_pager.scss} +6 -0
- data/vendor/{assets/stylesheets/scss/pagination.scss → twitter/bootstrap/sass/_pagination.scss} +1 -0
- data/vendor/{assets/stylesheets/scss/popovers.scss → twitter/bootstrap/sass/_popovers.scss} +0 -0
- data/vendor/{assets/stylesheets/scss/progress-bars.scss → twitter/bootstrap/sass/_progress-bars.scss} +27 -5
- data/vendor/{assets/stylesheets/scss/reset.scss → twitter/bootstrap/sass/_reset.scss} +8 -3
- data/vendor/twitter/bootstrap/sass/_responsive-1200px-min.scss +26 -0
- data/vendor/twitter/bootstrap/sass/_responsive-767px-max.scss +149 -0
- data/vendor/twitter/bootstrap/sass/_responsive-768px-979px.scss +17 -0
- data/vendor/twitter/bootstrap/sass/_responsive-navbar.scss +153 -0
- data/vendor/twitter/bootstrap/sass/_responsive-utilities.scss +41 -0
- data/vendor/{assets/stylesheets/scss/scaffolding.scss → twitter/bootstrap/sass/_scaffolding.scss} +4 -4
- data/vendor/{assets/stylesheets/scss/sprites.scss → twitter/bootstrap/sass/_sprites.scss} +40 -7
- data/vendor/{assets/stylesheets/scss/tables.scss → twitter/bootstrap/sass/_tables.scss} +37 -32
- data/vendor/{assets/stylesheets/scss/thumbnails.scss → twitter/bootstrap/sass/_thumbnails.scss} +14 -2
- data/vendor/{assets/stylesheets/scss/tooltip.scss → twitter/bootstrap/sass/_tooltip.scss} +1 -1
- data/vendor/{assets/stylesheets/scss/type.scss → twitter/bootstrap/sass/_type.scss} +27 -13
- data/vendor/{assets/stylesheets/scss/utilities.scss → twitter/bootstrap/sass/_utilities.scss} +0 -0
- data/vendor/twitter/bootstrap/sass/_variables.scss +204 -0
- data/vendor/{assets/stylesheets/scss/wells.scss → twitter/bootstrap/sass/_wells.scss} +10 -0
- data/vendor/{assets/stylesheets/scss → twitter/bootstrap/sass}/bootstrap.scss +3 -3
- data/vendor/twitter/bootstrap/sass/responsive.scss +48 -0
- metadata +93 -84
- data/lib/generators/bootstrap/install/templates/assets/javascripts/bootstrap-generators.js +0 -1
- data/lib/generators/bootstrap/install/templates/assets/stylesheets/bootstrap-variables.css.less +0 -98
- data/vendor/assets/stylesheets/bootstrap.css +0 -3363
- data/vendor/assets/stylesheets/less/grid.less +0 -8
- data/vendor/assets/stylesheets/less/labels.less +0 -32
- data/vendor/assets/stylesheets/less/responsive.less +0 -327
- data/vendor/assets/stylesheets/less/variables.less +0 -107
- data/vendor/assets/stylesheets/scss/grid.scss +0 -8
- data/vendor/assets/stylesheets/scss/labels.scss +0 -32
- data/vendor/assets/stylesheets/scss/responsive.scss +0 -327
- data/vendor/assets/stylesheets/scss/variables.scss +0 -107
|
@@ -8,25 +8,24 @@
|
|
|
8
8
|
// Core
|
|
9
9
|
.btn {
|
|
10
10
|
display: inline-block;
|
|
11
|
+
@include ie7-inline-block();
|
|
11
12
|
padding: 4px 10px 4px;
|
|
12
13
|
margin-bottom: 0; // For input.btn
|
|
13
14
|
font-size: $baseFontSize;
|
|
14
15
|
line-height: $baseLineHeight;
|
|
16
|
+
*line-height: 20px;
|
|
15
17
|
color: $grayDark;
|
|
16
18
|
text-align: center;
|
|
17
19
|
text-shadow: 0 1px 1px rgba(255,255,255,.75);
|
|
18
20
|
vertical-align: middle;
|
|
19
|
-
@include buttonBackground($white, darken($white, 10%));
|
|
20
|
-
border: 1px solid #ccc;
|
|
21
|
-
border-bottom-color: #bbb;
|
|
22
|
-
@include border-radius(4px);
|
|
23
|
-
$shadow: inset 0 1px 0 rgba(255,255,255,.2), 0 1px 2px rgba(0,0,0,.05);
|
|
24
|
-
@include box-shadow($shadow);
|
|
25
21
|
cursor: pointer;
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
22
|
+
@include buttonBackground($btnBackground, $btnBackgroundHighlight);
|
|
23
|
+
border: 1px solid $btnBorder;
|
|
24
|
+
*border: 0; // Remove the border to prevent IE7's black border on input:focus
|
|
25
|
+
border-bottom-color: darken($btnBorder, 10%);
|
|
26
|
+
@include border-radius(4px);
|
|
27
|
+
@include ie7-restore-left-whitespace(); // Give IE7 some love
|
|
28
|
+
@include box-shadow(#{inset 0 1px 0 rgba(255,255,255,.2), 0 1px 2px rgba(0,0,0,.05)});
|
|
30
29
|
}
|
|
31
30
|
|
|
32
31
|
// Hover state
|
|
@@ -34,6 +33,7 @@
|
|
|
34
33
|
color: $grayDark;
|
|
35
34
|
text-decoration: none;
|
|
36
35
|
background-color: darken($white, 10%);
|
|
36
|
+
*background-color: darken($white, 15%); /* Buttons in IE7 don't get borders, so darken on hover */
|
|
37
37
|
background-position: 0 -15px;
|
|
38
38
|
|
|
39
39
|
// transition is only when going to hover, otherwise the background
|
|
@@ -49,20 +49,19 @@
|
|
|
49
49
|
// Active state
|
|
50
50
|
.btn.active,
|
|
51
51
|
.btn:active {
|
|
52
|
-
background-image: none;
|
|
53
|
-
$shadow: inset 0 2px 4px rgba(0,0,0,.15), 0 1px 2px rgba(0,0,0,.05);
|
|
54
|
-
@include box-shadow($shadow);
|
|
55
52
|
background-color: darken($white, 10%);
|
|
56
|
-
background-color: darken($white, 15%)
|
|
53
|
+
background-color: darken($white, 15%) \9;
|
|
54
|
+
background-image: none;
|
|
57
55
|
outline: 0;
|
|
56
|
+
@include box-shadow(#{inset 0 2px 4px rgba(0,0,0,.15), 0 1px 2px rgba(0,0,0,.05)});
|
|
58
57
|
}
|
|
59
58
|
|
|
60
59
|
// Disabled state
|
|
61
60
|
.btn.disabled,
|
|
62
61
|
.btn[disabled] {
|
|
63
62
|
cursor: default;
|
|
64
|
-
background-image: none;
|
|
65
63
|
background-color: darken($white, 10%);
|
|
64
|
+
background-image: none;
|
|
66
65
|
@include opacity(65);
|
|
67
66
|
@include box-shadow(none);
|
|
68
67
|
}
|
|
@@ -117,8 +116,8 @@
|
|
|
117
116
|
.btn-info:hover,
|
|
118
117
|
.btn-inverse,
|
|
119
118
|
.btn-inverse:hover {
|
|
120
|
-
text-shadow: 0 -1px 0 rgba(0,0,0,.25);
|
|
121
119
|
color: $white;
|
|
120
|
+
text-shadow: 0 -1px 0 rgba(0,0,0,.25);
|
|
122
121
|
}
|
|
123
122
|
// Provide *some* extra contrast for those who can get it
|
|
124
123
|
.btn-primary.active,
|
|
@@ -126,34 +125,39 @@
|
|
|
126
125
|
.btn-danger.active,
|
|
127
126
|
.btn-success.active,
|
|
128
127
|
.btn-info.active,
|
|
129
|
-
.btn-
|
|
128
|
+
.btn-inverse.active {
|
|
130
129
|
color: rgba(255,255,255,.75);
|
|
131
130
|
}
|
|
132
131
|
|
|
133
132
|
// Set the backgrounds
|
|
134
133
|
// -------------------------
|
|
134
|
+
.btn {
|
|
135
|
+
// reset here as of 2.0.3 due to Recess property order
|
|
136
|
+
border-color: #ccc;
|
|
137
|
+
border-color: rgba(0,0,0,.1) rgba(0,0,0,.1) rgba(0,0,0,.25);
|
|
138
|
+
}
|
|
135
139
|
.btn-primary {
|
|
136
|
-
@include buttonBackground($
|
|
140
|
+
@include buttonBackground($btnPrimaryBackground, $btnPrimaryBackgroundHighlight);
|
|
137
141
|
}
|
|
138
142
|
// Warning appears are orange
|
|
139
143
|
.btn-warning {
|
|
140
|
-
@include buttonBackground(
|
|
144
|
+
@include buttonBackground($btnWarningBackground, $btnWarningBackgroundHighlight);
|
|
141
145
|
}
|
|
142
146
|
// Danger and error appear as red
|
|
143
147
|
.btn-danger {
|
|
144
|
-
@include buttonBackground(
|
|
148
|
+
@include buttonBackground($btnDangerBackground, $btnDangerBackgroundHighlight);
|
|
145
149
|
}
|
|
146
150
|
// Success appears as green
|
|
147
151
|
.btn-success {
|
|
148
|
-
@include buttonBackground(
|
|
152
|
+
@include buttonBackground($btnSuccessBackground, $btnSuccessBackgroundHighlight);
|
|
149
153
|
}
|
|
150
154
|
// Info appears as a neutral blue
|
|
151
155
|
.btn-info {
|
|
152
|
-
@include buttonBackground(
|
|
156
|
+
@include buttonBackground($btnInfoBackground, $btnInfoBackgroundHighlight);
|
|
153
157
|
}
|
|
154
158
|
// Inverse appears as dark gray
|
|
155
159
|
.btn-inverse {
|
|
156
|
-
@include buttonBackground(
|
|
160
|
+
@include buttonBackground($btnInverseBackground, $btnInverseBackgroundHighlight);
|
|
157
161
|
}
|
|
158
162
|
|
|
159
163
|
|
|
@@ -172,12 +176,16 @@ input[type="submit"].btn {
|
|
|
172
176
|
// IE7 has some default padding on button controls
|
|
173
177
|
*padding-top: 2px;
|
|
174
178
|
*padding-bottom: 2px;
|
|
175
|
-
&.large {
|
|
179
|
+
&.btn-large {
|
|
176
180
|
*padding-top: 7px;
|
|
177
181
|
*padding-bottom: 7px;
|
|
178
182
|
}
|
|
179
|
-
&.small {
|
|
183
|
+
&.btn-small {
|
|
180
184
|
*padding-top: 3px;
|
|
181
185
|
*padding-bottom: 3px;
|
|
182
186
|
}
|
|
187
|
+
&.btn-mini {
|
|
188
|
+
*padding-top: 1px;
|
|
189
|
+
*padding-bottom: 1px;
|
|
190
|
+
}
|
|
183
191
|
}
|
|
@@ -12,7 +12,18 @@
|
|
|
12
12
|
&:hover {
|
|
13
13
|
color: $black;
|
|
14
14
|
text-decoration: none;
|
|
15
|
-
@include opacity(40);
|
|
16
15
|
cursor: pointer;
|
|
16
|
+
@include opacity(40);
|
|
17
17
|
}
|
|
18
18
|
}
|
|
19
|
+
|
|
20
|
+
// Additional properties for button version
|
|
21
|
+
// iOS requires the button element instead of an anchor tag.
|
|
22
|
+
// If you want the anchor version, it requires `href="#"`.
|
|
23
|
+
button.close {
|
|
24
|
+
padding: 0;
|
|
25
|
+
cursor: pointer;
|
|
26
|
+
background: transparent;
|
|
27
|
+
border: 0;
|
|
28
|
+
-webkit-appearance: none;
|
|
29
|
+
}
|
|
@@ -14,7 +14,7 @@ pre {
|
|
|
14
14
|
|
|
15
15
|
// Inline code
|
|
16
16
|
code {
|
|
17
|
-
padding:
|
|
17
|
+
padding: 2px 4px;
|
|
18
18
|
color: #d14;
|
|
19
19
|
background-color: #f7f7f9;
|
|
20
20
|
border: 1px solid #e1e1e8;
|
|
@@ -25,16 +25,16 @@ pre {
|
|
|
25
25
|
display: block;
|
|
26
26
|
padding: ($baseLineHeight - 1) / 2;
|
|
27
27
|
margin: 0 0 $baseLineHeight / 2;
|
|
28
|
-
font-size: 12px
|
|
28
|
+
font-size: $baseFontSize * .925; // 13px to 12px
|
|
29
29
|
line-height: $baseLineHeight;
|
|
30
|
+
word-break: break-all;
|
|
31
|
+
word-wrap: break-word;
|
|
32
|
+
white-space: pre;
|
|
33
|
+
white-space: pre-wrap;
|
|
30
34
|
background-color: #f5f5f5;
|
|
31
35
|
border: 1px solid #ccc; // fallback for IE7-8
|
|
32
36
|
border: 1px solid rgba(0,0,0,.15);
|
|
33
37
|
@include border-radius(4px);
|
|
34
|
-
white-space: pre;
|
|
35
|
-
white-space: pre-wrap;
|
|
36
|
-
word-break: break-all;
|
|
37
|
-
word-wrap: break-word;
|
|
38
38
|
|
|
39
39
|
// Make prettyprint styles more spaced out for readability
|
|
40
40
|
&.prettyprint {
|
|
@@ -54,4 +54,4 @@ pre {
|
|
|
54
54
|
.pre-scrollable {
|
|
55
55
|
max-height: 340px;
|
|
56
56
|
overflow-y: scroll;
|
|
57
|
-
}
|
|
57
|
+
}
|
|
@@ -2,17 +2,19 @@
|
|
|
2
2
|
// --------------------
|
|
3
3
|
|
|
4
4
|
.fade {
|
|
5
|
+
@include opacity(0);
|
|
5
6
|
@include transition(opacity .15s linear);
|
|
6
|
-
opacity: 0;
|
|
7
7
|
&.in {
|
|
8
|
-
opacity
|
|
8
|
+
@include opacity(100);
|
|
9
9
|
}
|
|
10
10
|
}
|
|
11
11
|
|
|
12
12
|
.collapse {
|
|
13
|
-
|
|
14
|
-
position:relative;
|
|
15
|
-
overflow:hidden;
|
|
13
|
+
position: relative;
|
|
16
14
|
height: 0;
|
|
17
|
-
|
|
18
|
-
|
|
15
|
+
overflow: hidden;
|
|
16
|
+
@include transition(height .35s ease);
|
|
17
|
+
&.in {
|
|
18
|
+
height: auto;
|
|
19
|
+
}
|
|
20
|
+
}
|
data/vendor/{assets/stylesheets/scss/dropdowns.scss → twitter/bootstrap/sass/_dropdowns.scss}
RENAMED
|
@@ -2,6 +2,7 @@
|
|
|
2
2
|
// --------------
|
|
3
3
|
|
|
4
4
|
// Use the .menu class on any <li> element within the topbar or ul.tabs and you'll get some superfancy dropdowns
|
|
5
|
+
.dropup,
|
|
5
6
|
.dropdown {
|
|
6
7
|
position: relative;
|
|
7
8
|
}
|
|
@@ -13,77 +14,64 @@
|
|
|
13
14
|
.open .dropdown-toggle {
|
|
14
15
|
outline: 0;
|
|
15
16
|
}
|
|
17
|
+
|
|
16
18
|
// Dropdown arrow/caret
|
|
19
|
+
// --------------------
|
|
17
20
|
.caret {
|
|
18
21
|
display: inline-block;
|
|
19
22
|
width: 0;
|
|
20
23
|
height: 0;
|
|
21
|
-
text-indent: -99999px;
|
|
22
|
-
// IE7 won't do the border trick if there's a text indent, but it doesn't
|
|
23
|
-
// do the content that text-indent is hiding, either, so we're ok.
|
|
24
|
-
*text-indent: 0;
|
|
25
24
|
vertical-align: top;
|
|
26
|
-
border-left: 4px solid transparent;
|
|
27
|
-
border-right: 4px solid transparent;
|
|
28
25
|
border-top: 4px solid $black;
|
|
26
|
+
border-right: 4px solid transparent;
|
|
27
|
+
border-left: 4px solid transparent;
|
|
28
|
+
content: "";
|
|
29
29
|
@include opacity(30);
|
|
30
|
-
content: "\2193";
|
|
31
30
|
}
|
|
31
|
+
|
|
32
|
+
// Place the caret
|
|
32
33
|
.dropdown .caret {
|
|
33
34
|
margin-top: 8px;
|
|
34
35
|
margin-left: 2px;
|
|
35
36
|
}
|
|
36
37
|
.dropdown:hover .caret,
|
|
37
|
-
.open
|
|
38
|
+
.open .caret {
|
|
38
39
|
@include opacity(100);
|
|
39
40
|
}
|
|
41
|
+
|
|
40
42
|
// The dropdown menu (ul)
|
|
43
|
+
// ----------------------
|
|
41
44
|
.dropdown-menu {
|
|
42
45
|
position: absolute;
|
|
43
46
|
top: 100%;
|
|
44
47
|
left: 0;
|
|
45
48
|
z-index: $zindexDropdown;
|
|
46
|
-
float: left;
|
|
47
49
|
display: none; // none by default, but block on "open" of the menu
|
|
50
|
+
float: left;
|
|
48
51
|
min-width: 160px;
|
|
49
|
-
_width: 160px;
|
|
50
52
|
padding: 4px 0;
|
|
51
|
-
margin: 0; // override default ul
|
|
53
|
+
margin: 1px 0 0; // override default ul
|
|
52
54
|
list-style: none;
|
|
53
|
-
background-color: $
|
|
54
|
-
border
|
|
55
|
-
border
|
|
56
|
-
border-
|
|
57
|
-
border-width:
|
|
58
|
-
@include border-radius(
|
|
55
|
+
background-color: $dropdownBackground;
|
|
56
|
+
border: 1px solid #ccc;
|
|
57
|
+
border: 1px solid rgba(0,0,0,.2);
|
|
58
|
+
*border-right-width: 2px;
|
|
59
|
+
*border-bottom-width: 2px;
|
|
60
|
+
@include border-radius(5px);
|
|
59
61
|
@include box-shadow(0 5px 10px rgba(0,0,0,.2));
|
|
60
62
|
-webkit-background-clip: padding-box;
|
|
61
63
|
-moz-background-clip: padding;
|
|
62
64
|
background-clip: padding-box;
|
|
63
|
-
*border-right-width: 2px;
|
|
64
|
-
*border-bottom-width: 2px;
|
|
65
65
|
|
|
66
|
-
//
|
|
67
|
-
&.
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
margin-bottom: 2px;
|
|
66
|
+
// Aligns the dropdown menu to right
|
|
67
|
+
&.pull-right {
|
|
68
|
+
right: 0;
|
|
69
|
+
left: auto;
|
|
71
70
|
}
|
|
72
71
|
|
|
73
72
|
// Dividers (basically an hr) within the dropdown
|
|
74
73
|
.divider {
|
|
75
|
-
|
|
76
|
-
margin: 5px 1px;
|
|
77
|
-
overflow: hidden;
|
|
78
|
-
background-color: #e5e5e5;
|
|
79
|
-
border-bottom: 1px solid $white;
|
|
80
|
-
|
|
81
|
-
// IE7 needs a set width since we gave a height. Restricting just
|
|
82
|
-
// to IE7 to keep the 1px left/right space in other browsers.
|
|
83
|
-
// It is unclear where IE is getting the extra space that we need
|
|
84
|
-
// to negative-margin away, but so it goes.
|
|
85
|
-
*width: 100%;
|
|
86
|
-
*margin: -5px 0 5px;
|
|
74
|
+
@include nav-divider();
|
|
87
75
|
}
|
|
88
76
|
|
|
89
77
|
// Links within the dropdown menu
|
|
@@ -93,37 +81,62 @@
|
|
|
93
81
|
clear: both;
|
|
94
82
|
font-weight: normal;
|
|
95
83
|
line-height: $baseLineHeight;
|
|
96
|
-
color: $
|
|
84
|
+
color: $dropdownLinkColor;
|
|
97
85
|
white-space: nowrap;
|
|
98
86
|
}
|
|
99
87
|
}
|
|
100
88
|
|
|
101
89
|
// Hover state
|
|
90
|
+
// -----------
|
|
102
91
|
.dropdown-menu li > a:hover,
|
|
103
92
|
.dropdown-menu .active > a,
|
|
104
93
|
.dropdown-menu .active > a:hover {
|
|
105
|
-
color: $
|
|
94
|
+
color: $dropdownLinkColorHover;
|
|
106
95
|
text-decoration: none;
|
|
107
|
-
background-color: $
|
|
96
|
+
background-color: $dropdownLinkBackgroundHover;
|
|
108
97
|
}
|
|
109
98
|
|
|
110
99
|
// Open state for the dropdown
|
|
111
|
-
|
|
100
|
+
// ---------------------------
|
|
101
|
+
.open {
|
|
112
102
|
// IE7's z-index only goes to the nearest positioned ancestor, which would
|
|
113
103
|
// make the menu appear below buttons that appeared later on the page
|
|
114
104
|
*z-index: $zindexDropdown;
|
|
115
105
|
|
|
116
|
-
.dropdown-toggle {
|
|
117
|
-
color: $white;
|
|
118
|
-
background: #ccc;
|
|
119
|
-
background: rgba(0,0,0,.3);
|
|
120
|
-
}
|
|
121
106
|
.dropdown-menu {
|
|
122
107
|
display: block;
|
|
123
108
|
}
|
|
124
109
|
}
|
|
125
110
|
|
|
111
|
+
// Right aligned dropdowns
|
|
112
|
+
// ---------------------------
|
|
113
|
+
.pull-right .dropdown-menu {
|
|
114
|
+
right: 0;
|
|
115
|
+
left: auto;
|
|
116
|
+
}
|
|
117
|
+
|
|
118
|
+
// Allow for dropdowns to go bottom up (aka, dropup-menu)
|
|
119
|
+
// ------------------------------------------------------
|
|
120
|
+
// Just add .dropup after the standard .dropdown class and you're set, bro.
|
|
121
|
+
// TODO: abstract this so that the navbar fixed styles are not placed here?
|
|
122
|
+
.dropup,
|
|
123
|
+
.navbar-fixed-bottom .dropdown {
|
|
124
|
+
// Reverse the caret
|
|
125
|
+
.caret {
|
|
126
|
+
border-top: 0;
|
|
127
|
+
border-bottom: 4px solid $black;
|
|
128
|
+
content: "\2191";
|
|
129
|
+
}
|
|
130
|
+
// Different positioning for bottom up menu
|
|
131
|
+
.dropdown-menu {
|
|
132
|
+
top: auto;
|
|
133
|
+
bottom: 100%;
|
|
134
|
+
margin-bottom: 1px;
|
|
135
|
+
}
|
|
136
|
+
}
|
|
137
|
+
|
|
126
138
|
// Typeahead
|
|
139
|
+
// ---------
|
|
127
140
|
.typeahead {
|
|
128
141
|
margin-top: 2px; // give it some space to breathe
|
|
129
142
|
@include border-radius(4px);
|
|
@@ -27,7 +27,7 @@ legend {
|
|
|
27
27
|
line-height: $baseLineHeight * 2;
|
|
28
28
|
color: $grayDark;
|
|
29
29
|
border: 0;
|
|
30
|
-
border-bottom: 1px solid #
|
|
30
|
+
border-bottom: 1px solid #e5e5e5;
|
|
31
31
|
|
|
32
32
|
// Small
|
|
33
33
|
small {
|
|
@@ -42,83 +42,113 @@ input,
|
|
|
42
42
|
button,
|
|
43
43
|
select,
|
|
44
44
|
textarea {
|
|
45
|
-
@include font-shorthand($baseFontSize,normal
|
|
45
|
+
@include font-shorthand($baseFontSize, normal, $baseLineHeight); // Set size, weight, line-height here
|
|
46
46
|
}
|
|
47
47
|
input,
|
|
48
48
|
button,
|
|
49
49
|
select,
|
|
50
50
|
textarea {
|
|
51
|
-
|
|
51
|
+
font-family: $baseFontFamily; // And only set font-family here for those that need it (note the missing label element)
|
|
52
52
|
}
|
|
53
53
|
|
|
54
54
|
// Identify controls by their labels
|
|
55
55
|
label {
|
|
56
56
|
display: block;
|
|
57
57
|
margin-bottom: 5px;
|
|
58
|
-
color: $grayDark;
|
|
59
58
|
}
|
|
60
59
|
|
|
61
|
-
//
|
|
62
|
-
|
|
63
|
-
|
|
60
|
+
// Form controls
|
|
61
|
+
// -------------------------
|
|
62
|
+
|
|
63
|
+
// Shared size and type resets
|
|
64
64
|
select,
|
|
65
|
+
textarea,
|
|
66
|
+
input[type="text"],
|
|
67
|
+
input[type="password"],
|
|
68
|
+
input[type="datetime"],
|
|
69
|
+
input[type="datetime-local"],
|
|
70
|
+
input[type="date"],
|
|
71
|
+
input[type="month"],
|
|
72
|
+
input[type="time"],
|
|
73
|
+
input[type="week"],
|
|
74
|
+
input[type="number"],
|
|
75
|
+
input[type="email"],
|
|
76
|
+
input[type="url"],
|
|
77
|
+
input[type="search"],
|
|
78
|
+
input[type="tel"],
|
|
79
|
+
input[type="color"],
|
|
65
80
|
.uneditable-input {
|
|
66
81
|
display: inline-block;
|
|
67
|
-
width: 210px;
|
|
68
82
|
height: $baseLineHeight;
|
|
69
83
|
padding: 4px;
|
|
70
84
|
margin-bottom: 9px;
|
|
71
85
|
font-size: $baseFontSize;
|
|
72
86
|
line-height: $baseLineHeight;
|
|
73
87
|
color: $gray;
|
|
74
|
-
border: 1px solid #ccc;
|
|
75
|
-
@include border-radius(3px);
|
|
76
88
|
}
|
|
77
|
-
|
|
78
|
-
|
|
89
|
+
|
|
90
|
+
// Reset appearance properties for textual inputs and textarea
|
|
91
|
+
// Declare width for legacy (can't be on input[type=*] selectors or it's too specific)
|
|
92
|
+
input,
|
|
93
|
+
textarea {
|
|
94
|
+
width: 210px;
|
|
95
|
+
}
|
|
96
|
+
// Reset height since textareas have rows
|
|
97
|
+
textarea {
|
|
79
98
|
height: auto;
|
|
80
99
|
}
|
|
100
|
+
// Everything else
|
|
101
|
+
textarea,
|
|
102
|
+
input[type="text"],
|
|
103
|
+
input[type="password"],
|
|
104
|
+
input[type="datetime"],
|
|
105
|
+
input[type="datetime-local"],
|
|
106
|
+
input[type="date"],
|
|
107
|
+
input[type="month"],
|
|
108
|
+
input[type="time"],
|
|
109
|
+
input[type="week"],
|
|
110
|
+
input[type="number"],
|
|
111
|
+
input[type="email"],
|
|
112
|
+
input[type="url"],
|
|
113
|
+
input[type="search"],
|
|
114
|
+
input[type="tel"],
|
|
115
|
+
input[type="color"],
|
|
116
|
+
.uneditable-input {
|
|
117
|
+
background-color: $inputBackground;
|
|
118
|
+
border: 1px solid $inputBorder;
|
|
119
|
+
@include border-radius($inputBorderRadius);
|
|
120
|
+
@include box-shadow(inset 0 1px 1px rgba(0,0,0,.075));
|
|
121
|
+
@include transition(#{border linear .2s, box-shadow linear .2s});
|
|
81
122
|
|
|
82
|
-
//
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
123
|
+
// Focus state
|
|
124
|
+
&:focus {
|
|
125
|
+
border-color: rgba(82,168,236,.8);
|
|
126
|
+
outline: 0;
|
|
127
|
+
outline: thin dotted \9; /* IE6-9 */
|
|
128
|
+
@include box-shadow(#{inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(82,168,236,.6)});
|
|
129
|
+
}
|
|
87
130
|
}
|
|
88
131
|
|
|
89
|
-
//
|
|
90
|
-
input[type="
|
|
91
|
-
input[type="checkbox"]
|
|
92
|
-
input[type="radio"] {
|
|
93
|
-
width: auto;
|
|
94
|
-
height: auto;
|
|
95
|
-
padding: 0;
|
|
132
|
+
// Position radios and checkboxes better
|
|
133
|
+
input[type="radio"],
|
|
134
|
+
input[type="checkbox"] {
|
|
96
135
|
margin: 3px 0;
|
|
97
136
|
*margin-top: 0; /* IE7 */
|
|
98
137
|
line-height: normal;
|
|
99
138
|
cursor: pointer;
|
|
100
|
-
@include border-radius(0);
|
|
101
|
-
border: 0 \9; /* IE9 and down */
|
|
102
|
-
}
|
|
103
|
-
input[type="image"] {
|
|
104
|
-
border: 0;
|
|
105
139
|
}
|
|
106
140
|
|
|
107
|
-
// Reset
|
|
108
|
-
input[type="
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
|
|
114
|
-
background-color: initial;
|
|
115
|
-
@include box-shadow(none);
|
|
141
|
+
// Reset width of input buttons, radios, checkboxes
|
|
142
|
+
input[type="submit"],
|
|
143
|
+
input[type="reset"],
|
|
144
|
+
input[type="button"],
|
|
145
|
+
input[type="radio"],
|
|
146
|
+
input[type="checkbox"] {
|
|
147
|
+
width: auto; // Override of generic input selector
|
|
116
148
|
}
|
|
117
149
|
|
|
118
|
-
//
|
|
119
|
-
|
|
120
|
-
input[type="reset"],
|
|
121
|
-
input[type="submit"] {
|
|
150
|
+
// Make uneditable textareas behave like a textarea
|
|
151
|
+
.uneditable-textarea {
|
|
122
152
|
width: auto;
|
|
123
153
|
height: auto;
|
|
124
154
|
}
|
|
@@ -131,15 +161,10 @@ input[type="file"] {
|
|
|
131
161
|
line-height: 28px;
|
|
132
162
|
}
|
|
133
163
|
|
|
134
|
-
//
|
|
135
|
-
input[type="file"] {
|
|
136
|
-
line-height: 18px \9;
|
|
137
|
-
}
|
|
138
|
-
|
|
139
|
-
// Chrome on Linux and Mobile Safari need background-color
|
|
164
|
+
// Make select elements obey height by applying a border
|
|
140
165
|
select {
|
|
141
166
|
width: 220px; // default input width + 10px of padding that doesn't get applied
|
|
142
|
-
|
|
167
|
+
border: 1px solid #bbb;
|
|
143
168
|
}
|
|
144
169
|
|
|
145
170
|
// Make multiple select elements height not fixed
|
|
@@ -148,19 +173,12 @@ select[size] {
|
|
|
148
173
|
height: auto;
|
|
149
174
|
}
|
|
150
175
|
|
|
151
|
-
//
|
|
152
|
-
|
|
153
|
-
|
|
154
|
-
|
|
155
|
-
|
|
156
|
-
|
|
157
|
-
textarea {
|
|
158
|
-
height: auto;
|
|
159
|
-
}
|
|
160
|
-
|
|
161
|
-
// Hidden inputs
|
|
162
|
-
input[type="hidden"] {
|
|
163
|
-
display: none;
|
|
176
|
+
// Focus for select, file, radio, and checkbox
|
|
177
|
+
select:focus,
|
|
178
|
+
input[type="file"]:focus,
|
|
179
|
+
input[type="radio"]:focus,
|
|
180
|
+
input[type="checkbox"]:focus {
|
|
181
|
+
@include tab-focus();
|
|
164
182
|
}
|
|
165
183
|
|
|
166
184
|
|
|
@@ -171,6 +189,7 @@ input[type="hidden"] {
|
|
|
171
189
|
// Indent the labels to position radios/checkboxes as hanging
|
|
172
190
|
.radio,
|
|
173
191
|
.checkbox {
|
|
192
|
+
min-height: 18px; // clear the floating input if there is no label text
|
|
174
193
|
padding-left: 18px;
|
|
175
194
|
}
|
|
176
195
|
.radio input[type="radio"],
|
|
@@ -201,33 +220,6 @@ input[type="hidden"] {
|
|
|
201
220
|
|
|
202
221
|
|
|
203
222
|
|
|
204
|
-
// FOCUS STATE
|
|
205
|
-
// -----------
|
|
206
|
-
|
|
207
|
-
input,
|
|
208
|
-
textarea {
|
|
209
|
-
@include box-shadow(inset 0 1px 1px rgba(0,0,0,.075));
|
|
210
|
-
$transition: border linear .2s, box-shadow linear .2s;
|
|
211
|
-
@include transition($transition);
|
|
212
|
-
}
|
|
213
|
-
input:focus,
|
|
214
|
-
textarea:focus {
|
|
215
|
-
border-color: rgba(82,168,236,.8);
|
|
216
|
-
$shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(82,168,236,.6);
|
|
217
|
-
@include box-shadow($shadow);
|
|
218
|
-
outline: 0;
|
|
219
|
-
outline: thin dotted \9; /* IE6-9 */
|
|
220
|
-
}
|
|
221
|
-
input[type="file"]:focus,
|
|
222
|
-
input[type="radio"]:focus,
|
|
223
|
-
input[type="checkbox"]:focus,
|
|
224
|
-
select:focus {
|
|
225
|
-
@include box-shadow(none); // override for file inputs
|
|
226
|
-
@include tab-focus();
|
|
227
|
-
}
|
|
228
|
-
|
|
229
|
-
|
|
230
|
-
|
|
231
223
|
// INPUT SIZES
|
|
232
224
|
// -----------
|
|
233
225
|
|
|
@@ -243,18 +235,31 @@ select:focus {
|
|
|
243
235
|
input[class*="span"],
|
|
244
236
|
select[class*="span"],
|
|
245
237
|
textarea[class*="span"],
|
|
246
|
-
.uneditable-input
|
|
238
|
+
.uneditable-input[class*="span"],
|
|
239
|
+
// Redeclare since the fluid row class is more specific
|
|
240
|
+
.row-fluid input[class*="span"],
|
|
241
|
+
.row-fluid select[class*="span"],
|
|
242
|
+
.row-fluid textarea[class*="span"],
|
|
243
|
+
.row-fluid .uneditable-input[class*="span"] {
|
|
247
244
|
float: none;
|
|
248
245
|
margin-left: 0;
|
|
249
246
|
}
|
|
247
|
+
// Ensure input-prepend/append never wraps
|
|
248
|
+
.input-append input[class*="span"],
|
|
249
|
+
.input-append .uneditable-input[class*="span"],
|
|
250
|
+
.input-prepend input[class*="span"],
|
|
251
|
+
.input-prepend .uneditable-input[class*="span"],
|
|
252
|
+
.row-fluid .input-prepend [class*="span"],
|
|
253
|
+
.row-fluid .input-append [class*="span"] {
|
|
254
|
+
display: inline-block;
|
|
255
|
+
}
|
|
250
256
|
|
|
251
257
|
|
|
252
258
|
|
|
253
259
|
// GRID SIZING FOR INPUTS
|
|
254
260
|
// ----------------------
|
|
255
261
|
|
|
256
|
-
@include
|
|
257
|
-
|
|
262
|
+
@include grid-input($gridColumnWidth, $gridGutterWidth);
|
|
258
263
|
|
|
259
264
|
|
|
260
265
|
|
|
@@ -268,9 +273,16 @@ textarea[disabled],
|
|
|
268
273
|
input[readonly],
|
|
269
274
|
select[readonly],
|
|
270
275
|
textarea[readonly] {
|
|
271
|
-
background-color: #f5f5f5;
|
|
272
|
-
border-color: #ddd;
|
|
273
276
|
cursor: not-allowed;
|
|
277
|
+
background-color: $inputDisabledBackground;
|
|
278
|
+
border-color: #ddd;
|
|
279
|
+
}
|
|
280
|
+
// Explicitly reset the colors here
|
|
281
|
+
input[type="radio"][disabled],
|
|
282
|
+
input[type="checkbox"][disabled],
|
|
283
|
+
input[type="radio"][readonly],
|
|
284
|
+
input[type="checkbox"][readonly] {
|
|
285
|
+
background-color: transparent;
|
|
274
286
|
}
|
|
275
287
|
|
|
276
288
|
|
|
@@ -301,7 +313,7 @@ select:focus:required:invalid {
|
|
|
301
313
|
border-color: #ee5f5b;
|
|
302
314
|
&:focus {
|
|
303
315
|
border-color: darken(#ee5f5b, 10%);
|
|
304
|
-
@include box-shadow(0 0 6px lighten(#ee5f5b, 20%));
|
|
316
|
+
@include box-shadow(0 0 6px lighten(#ee5f5b, 20%));
|
|
305
317
|
}
|
|
306
318
|
}
|
|
307
319
|
|
|
@@ -314,38 +326,42 @@ select:focus:required:invalid {
|
|
|
314
326
|
padding: ($baseLineHeight - 1) 20px $baseLineHeight;
|
|
315
327
|
margin-top: $baseLineHeight;
|
|
316
328
|
margin-bottom: $baseLineHeight;
|
|
317
|
-
background-color:
|
|
318
|
-
border-top: 1px solid #
|
|
329
|
+
background-color: $formActionsBackground;
|
|
330
|
+
border-top: 1px solid #e5e5e5;
|
|
331
|
+
@include clearfix(); // Adding clearfix to allow for .pull-right button containers
|
|
319
332
|
}
|
|
320
333
|
|
|
321
334
|
// For text that needs to appear as an input but should not be an input
|
|
322
335
|
.uneditable-input {
|
|
323
|
-
|
|
324
|
-
|
|
336
|
+
overflow: hidden; // prevent text from wrapping, but still cut it off like an input does
|
|
337
|
+
white-space: nowrap;
|
|
338
|
+
cursor: not-allowed;
|
|
339
|
+
background-color: $inputBackground;
|
|
325
340
|
border-color: #eee;
|
|
326
341
|
@include box-shadow(inset 0 1px 2px rgba(0,0,0,.025));
|
|
327
|
-
cursor: not-allowed;
|
|
328
342
|
}
|
|
329
343
|
|
|
330
344
|
// Placeholder text gets special styles; can't be bundled together though for some reason
|
|
331
|
-
@include placeholder(
|
|
345
|
+
@include placeholder();
|
|
332
346
|
|
|
333
347
|
|
|
334
348
|
|
|
335
349
|
// HELP TEXT
|
|
336
350
|
// ---------
|
|
337
351
|
|
|
352
|
+
.help-block,
|
|
353
|
+
.help-inline {
|
|
354
|
+
color: $gray; // lighten the text some for contrast
|
|
355
|
+
}
|
|
356
|
+
|
|
338
357
|
.help-block {
|
|
339
358
|
display: block; // account for any element using help-block
|
|
340
|
-
margin-
|
|
341
|
-
margin-bottom: 0;
|
|
342
|
-
color: $grayLight;
|
|
359
|
+
margin-bottom: $baseLineHeight / 2;
|
|
343
360
|
}
|
|
344
361
|
|
|
345
362
|
.help-inline {
|
|
346
363
|
display: inline-block;
|
|
347
364
|
@include ie7-inline-block();
|
|
348
|
-
margin-bottom: 9px;
|
|
349
365
|
vertical-align: middle;
|
|
350
366
|
padding-left: 5px;
|
|
351
367
|
}
|
|
@@ -359,12 +375,16 @@ select:focus:required:invalid {
|
|
|
359
375
|
.input-prepend,
|
|
360
376
|
.input-append {
|
|
361
377
|
margin-bottom: 5px;
|
|
362
|
-
@include clearfix(); // Clear the float to prevent wrapping
|
|
363
378
|
input,
|
|
379
|
+
select,
|
|
364
380
|
.uneditable-input {
|
|
365
|
-
|
|
381
|
+
position: relative; // placed here by default so that on :focus we can place the input above the .add-on for full border and box-shadow goodness
|
|
382
|
+
margin-bottom: 0; // prevent bottom margin from screwing up alignment in stacked forms
|
|
383
|
+
*margin-left: 0;
|
|
384
|
+
vertical-align: middle;
|
|
385
|
+
@include border-radius(0 $inputBorderRadius $inputBorderRadius 0);
|
|
386
|
+
// Make input on top when focused so blue border and shadow always show
|
|
366
387
|
&:focus {
|
|
367
|
-
position: relative;
|
|
368
388
|
z-index: 2;
|
|
369
389
|
}
|
|
370
390
|
}
|
|
@@ -372,21 +392,23 @@ select:focus:required:invalid {
|
|
|
372
392
|
border-left-color: #ccc;
|
|
373
393
|
}
|
|
374
394
|
.add-on {
|
|
375
|
-
|
|
376
|
-
display: block;
|
|
395
|
+
display: inline-block;
|
|
377
396
|
width: auto;
|
|
378
|
-
min-width: 16px;
|
|
379
397
|
height: $baseLineHeight;
|
|
380
|
-
|
|
398
|
+
min-width: 16px;
|
|
381
399
|
padding: 4px 5px;
|
|
382
400
|
font-weight: normal;
|
|
383
401
|
line-height: $baseLineHeight;
|
|
384
|
-
color: $grayLight;
|
|
385
402
|
text-align: center;
|
|
386
403
|
text-shadow: 0 1px 0 $white;
|
|
387
|
-
|
|
404
|
+
vertical-align: middle;
|
|
405
|
+
background-color: $grayLighter;
|
|
388
406
|
border: 1px solid #ccc;
|
|
389
|
-
|
|
407
|
+
}
|
|
408
|
+
.add-on,
|
|
409
|
+
.btn {
|
|
410
|
+
margin-left: -1px;
|
|
411
|
+
@include border-radius(0);
|
|
390
412
|
}
|
|
391
413
|
.active {
|
|
392
414
|
background-color: lighten($green, 30);
|
|
@@ -394,33 +416,46 @@ select:focus:required:invalid {
|
|
|
394
416
|
}
|
|
395
417
|
}
|
|
396
418
|
.input-prepend {
|
|
397
|
-
.add-on
|
|
398
|
-
|
|
419
|
+
.add-on,
|
|
420
|
+
.btn {
|
|
421
|
+
margin-right: -1px;
|
|
422
|
+
}
|
|
423
|
+
.add-on:first-child,
|
|
424
|
+
.btn:first-child {
|
|
425
|
+
@include border-radius($inputBorderRadius 0 0 $inputBorderRadius);
|
|
399
426
|
}
|
|
400
427
|
}
|
|
401
428
|
.input-append {
|
|
402
429
|
input,
|
|
430
|
+
select,
|
|
403
431
|
.uneditable-input {
|
|
404
|
-
|
|
405
|
-
@include border-radius(3px 0 0 3px);
|
|
432
|
+
@include border-radius($inputBorderRadius 0 0 $inputBorderRadius);
|
|
406
433
|
}
|
|
407
434
|
.uneditable-input {
|
|
435
|
+
border-right-color: #ccc;
|
|
408
436
|
border-left-color: #eee;
|
|
409
|
-
border-right-color: #ccc;
|
|
410
437
|
}
|
|
411
|
-
.add-on
|
|
412
|
-
|
|
413
|
-
|
|
414
|
-
@include border-radius(0 3px 3px 0);
|
|
438
|
+
.add-on:last-child,
|
|
439
|
+
.btn:last-child {
|
|
440
|
+
@include border-radius(0 $inputBorderRadius $inputBorderRadius 0);
|
|
415
441
|
}
|
|
416
|
-
|
|
417
|
-
|
|
418
|
-
|
|
419
|
-
|
|
420
|
-
|
|
421
|
-
|
|
422
|
-
|
|
423
|
-
|
|
442
|
+
}
|
|
443
|
+
// Remove all border-radius for inputs with both prepend and append
|
|
444
|
+
.input-prepend.input-append {
|
|
445
|
+
input,
|
|
446
|
+
select,
|
|
447
|
+
.uneditable-input {
|
|
448
|
+
@include border-radius(0);
|
|
449
|
+
}
|
|
450
|
+
.add-on:first-child,
|
|
451
|
+
.btn:first-child {
|
|
452
|
+
margin-right: -1px;
|
|
453
|
+
@include border-radius($inputBorderRadius 0 0 $inputBorderRadius);
|
|
454
|
+
}
|
|
455
|
+
.add-on:last-child,
|
|
456
|
+
.btn:last-child {
|
|
457
|
+
margin-left: -1px;
|
|
458
|
+
@include border-radius(0 $inputBorderRadius $inputBorderRadius 0);
|
|
424
459
|
}
|
|
425
460
|
}
|
|
426
461
|
|
|
@@ -430,8 +465,10 @@ select:focus:required:invalid {
|
|
|
430
465
|
// -----------
|
|
431
466
|
|
|
432
467
|
.search-query {
|
|
433
|
-
padding-left: 14px;
|
|
434
468
|
padding-right: 14px;
|
|
469
|
+
padding-right: 4px \9;
|
|
470
|
+
padding-left: 14px;
|
|
471
|
+
padding-left: 4px \9; /* IE7-8 doesn't have border-radius, so don't indent the padding */
|
|
435
472
|
margin-bottom: 0; // remove the default margin on all inputs
|
|
436
473
|
@include border-radius(14px);
|
|
437
474
|
}
|
|
@@ -451,8 +488,11 @@ select:focus:required:invalid {
|
|
|
451
488
|
textarea,
|
|
452
489
|
select,
|
|
453
490
|
.help-inline,
|
|
454
|
-
.uneditable-input
|
|
491
|
+
.uneditable-input,
|
|
492
|
+
.input-prepend,
|
|
493
|
+
.input-append {
|
|
455
494
|
display: inline-block;
|
|
495
|
+
@include ie7-inline-block();
|
|
456
496
|
margin-bottom: 0;
|
|
457
497
|
}
|
|
458
498
|
// Re-hide hidden elements due to specifity
|
|
@@ -461,28 +501,35 @@ select:focus:required:invalid {
|
|
|
461
501
|
}
|
|
462
502
|
}
|
|
463
503
|
.form-search label,
|
|
464
|
-
.form-inline label
|
|
504
|
+
.form-inline label {
|
|
505
|
+
display: inline-block;
|
|
506
|
+
}
|
|
507
|
+
// Remove margin for input-prepend/-append
|
|
465
508
|
.form-search .input-append,
|
|
466
509
|
.form-inline .input-append,
|
|
467
510
|
.form-search .input-prepend,
|
|
468
511
|
.form-inline .input-prepend {
|
|
469
|
-
|
|
470
|
-
}
|
|
471
|
-
// Make the prepend and append add-on vertical-align: middle;
|
|
472
|
-
.form-search .input-append .add-on,
|
|
473
|
-
.form-inline .input-prepend .add-on,
|
|
474
|
-
.form-search .input-append .add-on,
|
|
475
|
-
.form-inline .input-prepend .add-on {
|
|
476
|
-
vertical-align: middle;
|
|
512
|
+
margin-bottom: 0;
|
|
477
513
|
}
|
|
478
|
-
// Inline checkbox/radio labels
|
|
514
|
+
// Inline checkbox/radio labels (remove padding on left)
|
|
479
515
|
.form-search .radio,
|
|
480
|
-
.form-inline .radio,
|
|
481
516
|
.form-search .checkbox,
|
|
517
|
+
.form-inline .radio,
|
|
482
518
|
.form-inline .checkbox {
|
|
519
|
+
padding-left: 0;
|
|
483
520
|
margin-bottom: 0;
|
|
484
521
|
vertical-align: middle;
|
|
485
522
|
}
|
|
523
|
+
// Remove float and margin, set to inline-block
|
|
524
|
+
.form-search .radio input[type="radio"],
|
|
525
|
+
.form-search .checkbox input[type="checkbox"],
|
|
526
|
+
.form-inline .radio input[type="radio"],
|
|
527
|
+
.form-inline .checkbox input[type="checkbox"] {
|
|
528
|
+
float: left;
|
|
529
|
+
margin-right: 3px;
|
|
530
|
+
margin-left: 0;
|
|
531
|
+
}
|
|
532
|
+
|
|
486
533
|
|
|
487
534
|
// Margin to space out fieldsets
|
|
488
535
|
.control-group {
|
|
@@ -513,7 +560,20 @@ legend + .control-group {
|
|
|
513
560
|
}
|
|
514
561
|
// Move over all input controls and content
|
|
515
562
|
.controls {
|
|
563
|
+
// Super jank IE7 fix to ensure the inputs in .input-append and input-prepend
|
|
564
|
+
// don't inherit the margin of the parent, in this case .controls
|
|
565
|
+
*display: inline-block;
|
|
566
|
+
*padding-left: 20px;
|
|
516
567
|
margin-left: 160px;
|
|
568
|
+
*margin-left: 0;
|
|
569
|
+
&:first-child {
|
|
570
|
+
*padding-left: 160px;
|
|
571
|
+
}
|
|
572
|
+
}
|
|
573
|
+
// Remove bottom margin on block level help text since that's accounted for on .control-group
|
|
574
|
+
.help-block {
|
|
575
|
+
margin-top: $baseLineHeight / 2;
|
|
576
|
+
margin-bottom: 0;
|
|
517
577
|
}
|
|
518
578
|
// Move over buttons in .form-actions to align with .controls
|
|
519
579
|
.form-actions {
|