twbs_sass_rails 0.2.0 → 0.3.1
Sign up to get free protection for your applications and to get access to all the features.
- checksums.yaml +4 -4
- data/CHANGELOG.md +17 -8
- data/CONTRIBUTING.md +4 -4
- data/Gemfile.lock +52 -65
- data/LICENSE +2 -2
- data/README.md +48 -18
- data/Rakefile +67 -32
- data/app/assets/fonts/fontawesome-webfont.eot +0 -0
- data/app/assets/fonts/fontawesome-webfont.svg +23 -8
- data/app/assets/fonts/fontawesome-webfont.ttf +0 -0
- data/app/assets/fonts/fontawesome-webfont.woff +0 -0
- data/app/assets/fonts/glyphicons-halflings-regular.eot +0 -0
- data/app/assets/fonts/glyphicons-halflings-regular.svg +200 -199
- data/app/assets/fonts/glyphicons-halflings-regular.ttf +0 -0
- data/app/assets/fonts/glyphicons-halflings-regular.woff +0 -0
- data/gemfiles/Gemfile.rails-3.2.x +2 -3
- data/gemfiles/Gemfile.rails-4.0.x +2 -3
- data/lib/generators/twbs_sass_rails/install/install_generator.rb +2 -2
- data/lib/generators/twbs_sass_rails/install/templates/{twbs-variables.css.less → twbs-variables.css.scss} +4 -3
- data/lib/generators/twbs_sass_rails/install/templates/{twbs.css.less → twbs.css.scss} +12 -7
- data/lib/twbs_sass_rails/version.rb +1 -1
- data/test/dummy/app/assets/stylesheets/{default-twbs.css.less → default-twbs.css.scss} +0 -0
- data/test/dummy/app/assets/stylesheets/test.css.scss +9 -0
- data/test/dummy/app/assets/stylesheets/twbs-variables.css.scss +7 -0
- data/test/dummy/app/assets/stylesheets/{twbs.css.less → twbs.css.scss} +12 -7
- data/test/dummy/config/application.rb +4 -1
- data/test/dummy/config/environments/development.rb +1 -1
- data/test/generators/install_generator_test.rb +4 -4
- data/test/integration/assets_precompile_integration_test.rb +11 -5
- data/test/integration/twbs_sass_rails_integration_test.rb +8 -7
- data/test/test_helper.rb +2 -4
- data/twbs_sass_rails.gemspec +6 -9
- data/vendor/assets/javascripts/respond.js +223 -212
- data/vendor/assets/javascripts/twbs/bootstrap/affix.js +36 -25
- data/vendor/assets/javascripts/twbs/bootstrap/alert.js +7 -17
- data/vendor/assets/javascripts/twbs/bootstrap/button.js +26 -28
- data/vendor/assets/javascripts/twbs/bootstrap/carousel.js +22 -34
- data/vendor/assets/javascripts/twbs/bootstrap/collapse.js +9 -18
- data/vendor/assets/javascripts/twbs/bootstrap/dropdown.js +25 -32
- data/vendor/assets/javascripts/twbs/bootstrap/modal.js +27 -30
- data/vendor/assets/javascripts/twbs/bootstrap/popover.js +16 -23
- data/vendor/assets/javascripts/twbs/bootstrap/scrollspy.js +19 -24
- data/vendor/assets/javascripts/twbs/bootstrap/tab.js +10 -20
- data/vendor/assets/javascripts/twbs/bootstrap/tooltip.js +54 -41
- data/vendor/assets/javascripts/twbs/bootstrap/transition.js +13 -21
- data/vendor/assets/stylesheets/fontawesome/_bordered-pulled.scss +16 -0
- data/vendor/assets/stylesheets/fontawesome/_core.scss +12 -0
- data/vendor/assets/stylesheets/fontawesome/_extras.scss +44 -0
- data/vendor/assets/stylesheets/fontawesome/_fixed-width.scss +6 -0
- data/vendor/assets/stylesheets/fontawesome/_icons.scss +412 -0
- data/vendor/assets/stylesheets/fontawesome/_larger.scss +13 -0
- data/vendor/assets/stylesheets/fontawesome/_list.scss +19 -0
- data/vendor/assets/stylesheets/fontawesome/_mixins.scss +20 -0
- data/vendor/assets/stylesheets/fontawesome/_path.scss +14 -0
- data/vendor/assets/stylesheets/fontawesome/_rotated-flipped.scss +9 -0
- data/vendor/assets/stylesheets/fontawesome/_spinning.scss +30 -0
- data/vendor/assets/stylesheets/fontawesome/_stacked.scss +20 -0
- data/vendor/assets/stylesheets/fontawesome/_variables.scss +381 -0
- data/vendor/assets/stylesheets/fontawesome/font-awesome.scss +17 -0
- data/vendor/assets/stylesheets/twbs/bootstrap/{alerts.less → _alerts.scss} +10 -10
- data/vendor/assets/stylesheets/twbs/bootstrap/{badges.less → _badges.scss} +19 -15
- data/vendor/assets/stylesheets/twbs/bootstrap/_breadcrumbs.scss +26 -0
- data/vendor/assets/stylesheets/twbs/bootstrap/{button-groups.less → _button-groups.scss} +38 -60
- data/vendor/assets/stylesheets/twbs/bootstrap/{buttons.less → _buttons.scss} +28 -34
- data/vendor/assets/stylesheets/twbs/bootstrap/{carousel.less → _carousel.scss} +38 -19
- data/vendor/assets/stylesheets/twbs/bootstrap/_close.scss +35 -0
- data/vendor/assets/stylesheets/twbs/bootstrap/_code.scss +63 -0
- data/vendor/assets/stylesheets/twbs/bootstrap/{component-animations.less → _component-animations.scss} +2 -2
- data/vendor/assets/stylesheets/twbs/bootstrap/{dropdowns.less → _dropdowns.scss} +53 -33
- data/vendor/assets/stylesheets/twbs/bootstrap/{forms.less → _forms.scss} +133 -79
- data/vendor/assets/stylesheets/twbs/bootstrap/{glyphicons.less → _glyphicons.scss} +16 -19
- data/vendor/assets/stylesheets/twbs/bootstrap/_grid.scss +100 -0
- data/vendor/assets/stylesheets/twbs/bootstrap/{input-groups.less → _input-groups.scss} +58 -29
- data/vendor/assets/stylesheets/twbs/bootstrap/_jumbotron.scss +44 -0
- data/vendor/assets/stylesheets/twbs/bootstrap/{labels.less → _labels.scss} +14 -8
- data/vendor/assets/stylesheets/twbs/bootstrap/_list-group.scss +110 -0
- data/vendor/assets/stylesheets/twbs/bootstrap/{media.less → _media.scss} +0 -0
- data/vendor/assets/stylesheets/twbs/bootstrap/_mixins.scss +931 -0
- data/vendor/assets/stylesheets/twbs/bootstrap/{modals.less → _modals.scss} +37 -40
- data/vendor/assets/stylesheets/twbs/bootstrap/_navbar.scss +620 -0
- data/vendor/assets/stylesheets/twbs/bootstrap/{navs.less → _navs.scss} +41 -52
- data/vendor/assets/stylesheets/twbs/bootstrap/{normalize.less → _normalize.scss} +148 -121
- data/vendor/assets/stylesheets/twbs/bootstrap/{pager.less → _pager.scss} +8 -8
- data/vendor/assets/stylesheets/twbs/bootstrap/_pagination.scss +88 -0
- data/vendor/assets/stylesheets/twbs/bootstrap/_panels.scss +230 -0
- data/vendor/assets/stylesheets/twbs/bootstrap/{popovers.less → _popovers.scss} +36 -36
- data/vendor/assets/stylesheets/twbs/bootstrap/{print.less → _print.scss} +6 -5
- data/vendor/assets/stylesheets/twbs/bootstrap/_progress-bars.scss +80 -0
- data/vendor/assets/stylesheets/twbs/bootstrap/_responsive-utilities.scss +80 -0
- data/vendor/assets/stylesheets/twbs/bootstrap/{scaffolding.less → _scaffolding.scss} +39 -24
- data/vendor/assets/stylesheets/twbs/bootstrap/{tables.less → _tables.scss} +42 -48
- data/vendor/assets/stylesheets/twbs/bootstrap/_theme.scss +247 -0
- data/vendor/assets/stylesheets/twbs/bootstrap/_thumbnails.scss +38 -0
- data/vendor/assets/stylesheets/twbs/bootstrap/_tooltip.scss +95 -0
- data/vendor/assets/stylesheets/twbs/bootstrap/_type.scss +296 -0
- data/vendor/assets/stylesheets/twbs/bootstrap/{utilities.less → _utilities.scss} +14 -3
- data/vendor/assets/stylesheets/twbs/bootstrap/_variables.scss +831 -0
- data/vendor/assets/stylesheets/twbs/bootstrap/{wells.less → _wells.scss} +6 -6
- data/vendor/assets/stylesheets/twbs/bootstrap/bootstrap.scss +48 -0
- data/vendor/assets/stylesheets/twbs/{bootstrap.less → bootstrap.scss} +0 -0
- metadata +94 -134
- data/test/dummy/app/assets/stylesheets/test.css.less +0 -5
- data/test/dummy/app/assets/stylesheets/twbs-variables.css.less +0 -6
- data/test/dummy/config/database.yml +0 -25
- data/test/dummy/db/.keep +0 -0
- data/vendor/assets/stylesheets/fontawesome/bootstrap.less +0 -84
- data/vendor/assets/stylesheets/fontawesome/core.less +0 -129
- data/vendor/assets/stylesheets/fontawesome/extras.less +0 -93
- data/vendor/assets/stylesheets/fontawesome/font-awesome.less +0 -33
- data/vendor/assets/stylesheets/fontawesome/icons.less +0 -381
- data/vendor/assets/stylesheets/fontawesome/mixins.less +0 -48
- data/vendor/assets/stylesheets/fontawesome/path.less +0 -14
- data/vendor/assets/stylesheets/fontawesome/variables.less +0 -735
- data/vendor/assets/stylesheets/twbs/bootstrap/bootstrap.less +0 -58
- data/vendor/assets/stylesheets/twbs/bootstrap/breadcrumbs.less +0 -23
- data/vendor/assets/stylesheets/twbs/bootstrap/close.less +0 -33
- data/vendor/assets/stylesheets/twbs/bootstrap/code.less +0 -56
- data/vendor/assets/stylesheets/twbs/bootstrap/grid.less +0 -346
- data/vendor/assets/stylesheets/twbs/bootstrap/jumbotron.less +0 -40
- data/vendor/assets/stylesheets/twbs/bootstrap/list-group.less +0 -88
- data/vendor/assets/stylesheets/twbs/bootstrap/mixins.less +0 -744
- data/vendor/assets/stylesheets/twbs/bootstrap/navbar.less +0 -621
- data/vendor/assets/stylesheets/twbs/bootstrap/pagination.less +0 -85
- data/vendor/assets/stylesheets/twbs/bootstrap/panels.less +0 -143
- data/vendor/assets/stylesheets/twbs/bootstrap/progress-bars.less +0 -96
- data/vendor/assets/stylesheets/twbs/bootstrap/responsive-utilities.less +0 -220
- data/vendor/assets/stylesheets/twbs/bootstrap/theme.less +0 -244
- data/vendor/assets/stylesheets/twbs/bootstrap/thumbnails.less +0 -32
- data/vendor/assets/stylesheets/twbs/bootstrap/tooltip.less +0 -95
- data/vendor/assets/stylesheets/twbs/bootstrap/type.less +0 -271
- data/vendor/assets/stylesheets/twbs/bootstrap/variables.less +0 -635
@@ -10,13 +10,9 @@
|
|
10
10
|
height: 0;
|
11
11
|
margin-left: 2px;
|
12
12
|
vertical-align: middle;
|
13
|
-
border-top:
|
14
|
-
border-right:
|
15
|
-
border-left:
|
16
|
-
// Firefox fix for https://github.com/twbs/bootstrap/issues/9538. Once fixed,
|
17
|
-
// we can just straight up remove this.
|
18
|
-
border-bottom: 0 dotted;
|
19
|
-
content: "";
|
13
|
+
border-top: $caret-width-base solid;
|
14
|
+
border-right: $caret-width-base solid transparent;
|
15
|
+
border-left: $caret-width-base solid transparent;
|
20
16
|
}
|
21
17
|
|
22
18
|
// The dropdown wrapper (div)
|
@@ -34,22 +30,24 @@
|
|
34
30
|
position: absolute;
|
35
31
|
top: 100%;
|
36
32
|
left: 0;
|
37
|
-
z-index:
|
33
|
+
z-index: $zindex-dropdown;
|
38
34
|
display: none; // none by default, but block on "open" of the menu
|
39
35
|
float: left;
|
40
36
|
min-width: 160px;
|
41
37
|
padding: 5px 0;
|
42
38
|
margin: 2px 0 0; // override default ul
|
43
39
|
list-style: none;
|
44
|
-
font-size:
|
45
|
-
background-color:
|
46
|
-
border: 1px solid
|
47
|
-
border: 1px solid
|
48
|
-
border-radius:
|
49
|
-
|
40
|
+
font-size: $font-size-base;
|
41
|
+
background-color: $dropdown-bg;
|
42
|
+
border: 1px solid $dropdown-fallback-border; // IE8 fallback
|
43
|
+
border: 1px solid $dropdown-border;
|
44
|
+
border-radius: $border-radius-base;
|
45
|
+
@include box-shadow(0 6px 12px rgba(0,0,0,.175));
|
50
46
|
background-clip: padding-box;
|
51
47
|
|
52
48
|
// Aligns the dropdown menu to right
|
49
|
+
//
|
50
|
+
// Deprecated as of 3.1.0 in favor of `.dropdown-menu-[dir]`
|
53
51
|
&.pull-right {
|
54
52
|
right: 0;
|
55
53
|
left: auto;
|
@@ -57,7 +55,7 @@
|
|
57
55
|
|
58
56
|
// Dividers (basically an hr) within the dropdown
|
59
57
|
.divider {
|
60
|
-
|
58
|
+
@include nav-divider($dropdown-divider-bg);
|
61
59
|
}
|
62
60
|
|
63
61
|
// Links within the dropdown menu
|
@@ -66,8 +64,8 @@
|
|
66
64
|
padding: 3px 20px;
|
67
65
|
clear: both;
|
68
66
|
font-weight: normal;
|
69
|
-
line-height:
|
70
|
-
color:
|
67
|
+
line-height: $line-height-base;
|
68
|
+
color: $dropdown-link-color;
|
71
69
|
white-space: nowrap; // prevent links from randomly breaking onto new lines
|
72
70
|
}
|
73
71
|
}
|
@@ -77,8 +75,8 @@
|
|
77
75
|
&:hover,
|
78
76
|
&:focus {
|
79
77
|
text-decoration: none;
|
80
|
-
color:
|
81
|
-
background-color:
|
78
|
+
color: $dropdown-link-hover-color;
|
79
|
+
background-color: $dropdown-link-hover-bg;
|
82
80
|
}
|
83
81
|
}
|
84
82
|
|
@@ -87,10 +85,10 @@
|
|
87
85
|
&,
|
88
86
|
&:hover,
|
89
87
|
&:focus {
|
90
|
-
color:
|
88
|
+
color: $dropdown-link-active-color;
|
91
89
|
text-decoration: none;
|
92
90
|
outline: 0;
|
93
|
-
background-color:
|
91
|
+
background-color: $dropdown-link-active-bg;
|
94
92
|
}
|
95
93
|
}
|
96
94
|
|
@@ -102,7 +100,7 @@
|
|
102
100
|
&,
|
103
101
|
&:hover,
|
104
102
|
&:focus {
|
105
|
-
color:
|
103
|
+
color: $dropdown-link-disabled-color;
|
106
104
|
}
|
107
105
|
}
|
108
106
|
// Nuke hover/focus effects
|
@@ -112,7 +110,7 @@
|
|
112
110
|
text-decoration: none;
|
113
111
|
background-color: transparent;
|
114
112
|
background-image: none; // Remove CSS gradient
|
115
|
-
|
113
|
+
@include reset-filter();
|
116
114
|
cursor: not-allowed;
|
117
115
|
}
|
118
116
|
}
|
@@ -130,13 +128,32 @@
|
|
130
128
|
}
|
131
129
|
}
|
132
130
|
|
131
|
+
// Menu positioning
|
132
|
+
//
|
133
|
+
// Add extra class to `.dropdown-menu` to flip the alignment of the dropdown
|
134
|
+
// menu with the parent.
|
135
|
+
.dropdown-menu-right {
|
136
|
+
left: auto; // Reset the default from `.dropdown-menu`
|
137
|
+
right: 0;
|
138
|
+
}
|
139
|
+
// With v3, we enabled auto-flipping if you have a dropdown within a right
|
140
|
+
// aligned nav component. To enable the undoing of that, we provide an override
|
141
|
+
// to restore the default dropdown menu alignment.
|
142
|
+
//
|
143
|
+
// This is only for left-aligning a dropdown menu within a `.navbar-right` or
|
144
|
+
// `.pull-right` nav component.
|
145
|
+
.dropdown-menu-left {
|
146
|
+
left: 0;
|
147
|
+
right: auto;
|
148
|
+
}
|
149
|
+
|
133
150
|
// Dropdown section headers
|
134
151
|
.dropdown-header {
|
135
152
|
display: block;
|
136
153
|
padding: 3px 20px;
|
137
|
-
font-size:
|
138
|
-
line-height:
|
139
|
-
color:
|
154
|
+
font-size: $font-size-small;
|
155
|
+
line-height: $line-height-base;
|
156
|
+
color: $dropdown-header-color;
|
140
157
|
}
|
141
158
|
|
142
159
|
// Backdrop to catch body clicks on mobile, etc.
|
@@ -146,7 +163,7 @@
|
|
146
163
|
right: 0;
|
147
164
|
bottom: 0;
|
148
165
|
top: 0;
|
149
|
-
z-index:
|
166
|
+
z-index: ($zindex-dropdown - 10);
|
150
167
|
}
|
151
168
|
|
152
169
|
// Right aligned dropdowns
|
@@ -164,10 +181,8 @@
|
|
164
181
|
.navbar-fixed-bottom .dropdown {
|
165
182
|
// Reverse the caret
|
166
183
|
.caret {
|
167
|
-
|
168
|
-
|
169
|
-
border-top: 0 dotted;
|
170
|
-
border-bottom: 4px solid @dropdown-caret-color;
|
184
|
+
border-top: 0;
|
185
|
+
border-bottom: $caret-width-base solid;
|
171
186
|
content: "";
|
172
187
|
}
|
173
188
|
// Different positioning for bottom up menu
|
@@ -183,10 +198,15 @@
|
|
183
198
|
//
|
184
199
|
// Reiterate per navbar.less and the modified component alignment there.
|
185
200
|
|
186
|
-
@media (min-width:
|
201
|
+
@media (min-width: $grid-float-breakpoint) {
|
187
202
|
.navbar-right {
|
188
203
|
.dropdown-menu {
|
189
|
-
|
204
|
+
right: 0; left: auto;
|
205
|
+
}
|
206
|
+
// Necessary for overrides of the default right aligned menu.
|
207
|
+
// Will remove come v4 in all likelihood.
|
208
|
+
.dropdown-menu-left {
|
209
|
+
left: 0; right: auto;
|
190
210
|
}
|
191
211
|
}
|
192
212
|
}
|
@@ -11,18 +11,22 @@ fieldset {
|
|
11
11
|
padding: 0;
|
12
12
|
margin: 0;
|
13
13
|
border: 0;
|
14
|
+
// Chrome and Firefox set a `min-width: -webkit-min-content;` on fieldsets,
|
15
|
+
// so we reset that to ensure it behaves more like a standard block element.
|
16
|
+
// See https://github.com/twbs/bootstrap/issues/12359.
|
17
|
+
min-width: 0;
|
14
18
|
}
|
15
19
|
|
16
20
|
legend {
|
17
21
|
display: block;
|
18
22
|
width: 100%;
|
19
23
|
padding: 0;
|
20
|
-
margin-bottom:
|
21
|
-
font-size: (
|
24
|
+
margin-bottom: $line-height-computed;
|
25
|
+
font-size: ($font-size-base * 1.5);
|
22
26
|
line-height: inherit;
|
23
|
-
color:
|
27
|
+
color: $legend-color;
|
24
28
|
border: 0;
|
25
|
-
border-bottom: 1px solid
|
29
|
+
border-bottom: 1px solid $legend-border-color;
|
26
30
|
}
|
27
31
|
|
28
32
|
label {
|
@@ -33,10 +37,14 @@ label {
|
|
33
37
|
|
34
38
|
|
35
39
|
// Normalize form controls
|
40
|
+
//
|
41
|
+
// While most of our form styles require extra classes, some basic normalization
|
42
|
+
// is required to ensure optimum display with or without those classes to better
|
43
|
+
// address browser inconsistencies.
|
36
44
|
|
37
45
|
// Override content-box in Normalize (* isn't specific enough)
|
38
46
|
input[type="search"] {
|
39
|
-
|
47
|
+
@include box-sizing(border-box);
|
40
48
|
}
|
41
49
|
|
42
50
|
// Position radios and checkboxes better
|
@@ -47,57 +55,37 @@ input[type="checkbox"] {
|
|
47
55
|
line-height: normal;
|
48
56
|
}
|
49
57
|
|
50
|
-
// Set the height of
|
58
|
+
// Set the height of file controls to match text inputs
|
51
59
|
input[type="file"] {
|
52
60
|
display: block;
|
53
61
|
}
|
54
62
|
|
63
|
+
// Make range inputs behave like textual form controls
|
64
|
+
input[type="range"] {
|
65
|
+
display: block;
|
66
|
+
width: 100%;
|
67
|
+
}
|
68
|
+
|
55
69
|
// Make multiple select elements height not fixed
|
56
70
|
select[multiple],
|
57
71
|
select[size] {
|
58
72
|
height: auto;
|
59
73
|
}
|
60
74
|
|
61
|
-
//
|
62
|
-
select optgroup {
|
63
|
-
font-size: inherit;
|
64
|
-
font-style: inherit;
|
65
|
-
font-family: inherit;
|
66
|
-
}
|
67
|
-
|
68
|
-
// Focus for select, file, radio, and checkbox
|
75
|
+
// Focus for file, radio, and checkbox
|
69
76
|
input[type="file"]:focus,
|
70
77
|
input[type="radio"]:focus,
|
71
78
|
input[type="checkbox"]:focus {
|
72
|
-
|
73
|
-
}
|
74
|
-
|
75
|
-
// Fix for Chrome number input
|
76
|
-
// Setting certain font-sizes causes the `I` bar to appear on hover of the bottom increment button.
|
77
|
-
// See https://github.com/twbs/bootstrap/issues/8350 for more.
|
78
|
-
input[type="number"] {
|
79
|
-
&::-webkit-outer-spin-button,
|
80
|
-
&::-webkit-inner-spin-button {
|
81
|
-
height: auto;
|
82
|
-
}
|
79
|
+
@include tab-focus();
|
83
80
|
}
|
84
81
|
|
85
82
|
// Adjust output element
|
86
83
|
output {
|
87
84
|
display: block;
|
88
|
-
padding-top: (
|
89
|
-
font-size:
|
90
|
-
line-height:
|
91
|
-
color:
|
92
|
-
vertical-align: middle;
|
93
|
-
}
|
94
|
-
|
95
|
-
// Placeholder
|
96
|
-
//
|
97
|
-
// Placeholder text gets special styles because when browsers invalidate entire
|
98
|
-
// lines if it doesn't understand a selector/
|
99
|
-
.form-control {
|
100
|
-
.placeholder();
|
85
|
+
padding-top: ($padding-base-vertical + 1);
|
86
|
+
font-size: $font-size-base;
|
87
|
+
line-height: $line-height-base;
|
88
|
+
color: $input-color;
|
101
89
|
}
|
102
90
|
|
103
91
|
|
@@ -126,21 +114,23 @@ output {
|
|
126
114
|
.form-control {
|
127
115
|
display: block;
|
128
116
|
width: 100%;
|
129
|
-
height:
|
130
|
-
padding:
|
131
|
-
font-size:
|
132
|
-
line-height:
|
133
|
-
color:
|
134
|
-
|
135
|
-
background-color: @input-bg;
|
117
|
+
height: $input-height-base; // Make inputs at least the height of their button counterpart (base line-height + padding + border)
|
118
|
+
padding: $padding-base-vertical $padding-base-horizontal;
|
119
|
+
font-size: $font-size-base;
|
120
|
+
line-height: $line-height-base;
|
121
|
+
color: $input-color;
|
122
|
+
background-color: $input-bg;
|
136
123
|
background-image: none; // Reset unusual Firefox-on-Android default style; see https://github.com/necolas/normalize.css/issues/214
|
137
|
-
border: 1px solid
|
138
|
-
border-radius:
|
139
|
-
|
140
|
-
|
124
|
+
border: 1px solid $input-border;
|
125
|
+
border-radius: $input-border-radius;
|
126
|
+
@include box-shadow(inset 0 1px 1px rgba(0,0,0,.075));
|
127
|
+
@include transition(border-color ease-in-out .15s, box-shadow ease-in-out .15s);
|
141
128
|
|
142
129
|
// Customize the `:focus` state to imitate native WebKit styles.
|
143
|
-
|
130
|
+
@include form-control-focus();
|
131
|
+
|
132
|
+
// Placeholder
|
133
|
+
@include placeholder();
|
144
134
|
|
145
135
|
// Disabled and read-only inputs
|
146
136
|
// Note: HTML5 says that controls under a fieldset > legend:first-child won't
|
@@ -150,13 +140,24 @@ output {
|
|
150
140
|
&[readonly],
|
151
141
|
fieldset[disabled] & {
|
152
142
|
cursor: not-allowed;
|
153
|
-
background-color:
|
143
|
+
background-color: $input-bg-disabled;
|
144
|
+
opacity: 1; // iOS fix for unreadable disabled content
|
154
145
|
}
|
155
146
|
|
156
|
-
//
|
157
|
-
|
158
|
-
|
159
|
-
|
147
|
+
// [converter] extracted textarea& to textarea.form-control
|
148
|
+
}
|
149
|
+
|
150
|
+
// Reset height for `textarea`s
|
151
|
+
textarea.form-control {
|
152
|
+
height: auto;
|
153
|
+
}
|
154
|
+
|
155
|
+
// Special styles for iOS date input
|
156
|
+
//
|
157
|
+
// In Mobile Safari, date inputs require a pixel line-height that matches the
|
158
|
+
// given height of the input.
|
159
|
+
input[type="date"] {
|
160
|
+
line-height: $input-height-base;
|
160
161
|
}
|
161
162
|
|
162
163
|
|
@@ -177,14 +178,12 @@ output {
|
|
177
178
|
.radio,
|
178
179
|
.checkbox {
|
179
180
|
display: block;
|
180
|
-
min-height:
|
181
|
+
min-height: $line-height-computed; // clear the floating input if there is no label text
|
181
182
|
margin-top: 10px;
|
182
183
|
margin-bottom: 10px;
|
183
184
|
padding-left: 20px;
|
184
|
-
vertical-align: middle;
|
185
185
|
label {
|
186
186
|
display: inline;
|
187
|
-
margin-bottom: 0;
|
188
187
|
font-weight: normal;
|
189
188
|
cursor: pointer;
|
190
189
|
}
|
@@ -232,31 +231,52 @@ input[type="checkbox"],
|
|
232
231
|
}
|
233
232
|
}
|
234
233
|
|
234
|
+
|
235
235
|
// Form control sizing
|
236
|
-
|
237
|
-
|
238
|
-
|
236
|
+
//
|
237
|
+
// Build on `.form-control` with modifier classes to decrease or increase the
|
238
|
+
// height and font-size of form controls.
|
239
239
|
|
240
|
-
.input-
|
241
|
-
|
242
|
-
|
240
|
+
@include input-size('.input-sm', $input-height-small, $padding-small-vertical, $padding-small-horizontal, $font-size-small, $line-height-small, $border-radius-small);
|
241
|
+
|
242
|
+
@include input-size('.input-lg', $input-height-large, $padding-large-vertical, $padding-large-horizontal, $font-size-large, $line-height-large, $border-radius-large);
|
243
243
|
|
244
244
|
|
245
245
|
// Form control feedback states
|
246
246
|
//
|
247
247
|
// Apply contextual and semantic states to individual form controls.
|
248
248
|
|
249
|
-
|
249
|
+
.has-feedback {
|
250
|
+
// Enable absolute positioning
|
251
|
+
position: relative;
|
252
|
+
|
253
|
+
// Ensure icons don't overlap text
|
254
|
+
.form-control {
|
255
|
+
padding-right: ($input-height-base * 1.25);
|
256
|
+
}
|
257
|
+
|
258
|
+
// Feedback icon (requires .glyphicon classes)
|
259
|
+
.form-control-feedback {
|
260
|
+
position: absolute;
|
261
|
+
top: ($line-height-computed + 5); // Height of the `label` and its margin
|
262
|
+
right: 0;
|
263
|
+
display: block;
|
264
|
+
width: $input-height-base;
|
265
|
+
height: $input-height-base;
|
266
|
+
line-height: $input-height-base;
|
267
|
+
text-align: center;
|
268
|
+
}
|
269
|
+
}
|
270
|
+
|
271
|
+
// Feedback states
|
272
|
+
.has-success {
|
273
|
+
@include form-control-validation($state-success-text, $state-success-text, $state-success-bg);
|
274
|
+
}
|
250
275
|
.has-warning {
|
251
|
-
|
276
|
+
@include form-control-validation($state-warning-text, $state-warning-text, $state-warning-bg);
|
252
277
|
}
|
253
|
-
// Error
|
254
278
|
.has-error {
|
255
|
-
|
256
|
-
}
|
257
|
-
// Success
|
258
|
-
.has-success {
|
259
|
-
.form-control-validation(@state-success-text; @state-success-text; @state-success-bg);
|
279
|
+
@include form-control-validation($state-danger-text, $state-danger-text, $state-danger-bg);
|
260
280
|
}
|
261
281
|
|
262
282
|
|
@@ -267,7 +287,6 @@ input[type="checkbox"],
|
|
267
287
|
|
268
288
|
.form-control-static {
|
269
289
|
margin-bottom: 0; // Remove default margin from `p`
|
270
|
-
padding-top: (@padding-base-vertical + 1);
|
271
290
|
}
|
272
291
|
|
273
292
|
|
@@ -280,7 +299,7 @@ input[type="checkbox"],
|
|
280
299
|
display: block; // account for any element using help-block
|
281
300
|
margin-top: 5px;
|
282
301
|
margin-bottom: 10px;
|
283
|
-
color: lighten(
|
302
|
+
color: lighten($text-color, 25%); // lighten the text some for contrast
|
284
303
|
}
|
285
304
|
|
286
305
|
|
@@ -299,9 +318,9 @@ input[type="checkbox"],
|
|
299
318
|
.form-inline {
|
300
319
|
|
301
320
|
// Kick in the inline
|
302
|
-
@media (min-width:
|
321
|
+
@media (min-width: $screen-sm-min) {
|
303
322
|
// Inline-block all the things for "inline"
|
304
|
-
.form-group
|
323
|
+
.form-group {
|
305
324
|
display: inline-block;
|
306
325
|
margin-bottom: 0;
|
307
326
|
vertical-align: middle;
|
@@ -310,6 +329,13 @@ input[type="checkbox"],
|
|
310
329
|
// In navbar-form, allow folks to *not* use `.form-group`
|
311
330
|
.form-control {
|
312
331
|
display: inline-block;
|
332
|
+
width: auto; // Prevent labels from stacking above inputs in `.form-group`
|
333
|
+
vertical-align: middle;
|
334
|
+
}
|
335
|
+
|
336
|
+
.control-label {
|
337
|
+
margin-bottom: 0;
|
338
|
+
vertical-align: middle;
|
313
339
|
}
|
314
340
|
|
315
341
|
// Remove default margin on radios/checkboxes that were used for stacking, and
|
@@ -321,12 +347,21 @@ input[type="checkbox"],
|
|
321
347
|
margin-top: 0;
|
322
348
|
margin-bottom: 0;
|
323
349
|
padding-left: 0;
|
350
|
+
vertical-align: middle;
|
324
351
|
}
|
325
352
|
.radio input[type="radio"],
|
326
353
|
.checkbox input[type="checkbox"] {
|
327
354
|
float: none;
|
328
355
|
margin-left: 0;
|
329
356
|
}
|
357
|
+
|
358
|
+
// Validation states
|
359
|
+
//
|
360
|
+
// Reposition the icon because it's now within a grid column and columns have
|
361
|
+
// `position: relative;` on them. Also accounts for the grid gutter padding.
|
362
|
+
.has-feedback .form-control-feedback {
|
363
|
+
top: 0;
|
364
|
+
}
|
330
365
|
}
|
331
366
|
}
|
332
367
|
|
@@ -346,18 +381,37 @@ input[type="checkbox"],
|
|
346
381
|
.checkbox-inline {
|
347
382
|
margin-top: 0;
|
348
383
|
margin-bottom: 0;
|
349
|
-
padding-top: (
|
384
|
+
padding-top: ($padding-base-vertical + 1); // Default padding plus a border
|
385
|
+
}
|
386
|
+
// Account for padding we're adding to ensure the alignment and of help text
|
387
|
+
// and other content below items
|
388
|
+
.radio,
|
389
|
+
.checkbox {
|
390
|
+
min-height: ($line-height-computed + ($padding-base-vertical + 1));
|
350
391
|
}
|
351
392
|
|
352
393
|
// Make form groups behave like rows
|
353
394
|
.form-group {
|
354
|
-
|
395
|
+
@include make-row();
|
396
|
+
}
|
397
|
+
|
398
|
+
.form-control-static {
|
399
|
+
padding-top: ($padding-base-vertical + 1);
|
355
400
|
}
|
356
401
|
|
357
402
|
// Only right align form labels here when the columns stop stacking
|
358
|
-
@media (min-width:
|
403
|
+
@media (min-width: $screen-sm-min) {
|
359
404
|
.control-label {
|
360
405
|
text-align: right;
|
361
406
|
}
|
362
407
|
}
|
408
|
+
|
409
|
+
// Validation states
|
410
|
+
//
|
411
|
+
// Reposition the icon because it's now within a grid column and columns have
|
412
|
+
// `position: relative;` on them. Also accounts for the grid gutter padding.
|
413
|
+
.has-feedback .form-control-feedback {
|
414
|
+
top: 0;
|
415
|
+
right: ($grid-gutter-width / 2);
|
416
|
+
}
|
363
417
|
}
|
@@ -10,11 +10,11 @@
|
|
10
10
|
// Import the fonts
|
11
11
|
@font-face {
|
12
12
|
font-family: 'Glyphicons Halflings';
|
13
|
-
src:
|
14
|
-
src:
|
15
|
-
|
16
|
-
|
17
|
-
|
13
|
+
src: font-url('#{$icon-font-name}.eot');
|
14
|
+
src: font-url('#{$icon-font-name}.eot?#iefix') format('embedded-opentype'),
|
15
|
+
font-url('#{$icon-font-name}.woff') format('woff'),
|
16
|
+
font-url('#{$icon-font-name}.ttf') format('truetype'),
|
17
|
+
font-url('#{$icon-font-name}.svg##{$icon-font-svg-id}') format('svg');
|
18
18
|
}
|
19
19
|
|
20
20
|
// Catchall baseclass
|
@@ -27,10 +27,7 @@
|
|
27
27
|
font-weight: normal;
|
28
28
|
line-height: 1;
|
29
29
|
-webkit-font-smoothing: antialiased;
|
30
|
-
|
31
|
-
&:empty{
|
32
|
-
width: 1em;
|
33
|
-
}
|
30
|
+
-moz-osx-font-smoothing: grayscale;
|
34
31
|
}
|
35
32
|
|
36
33
|
// Individual icons
|
@@ -72,6 +69,7 @@
|
|
72
69
|
.glyphicon-repeat { &:before { content: "\e030"; } }
|
73
70
|
.glyphicon-refresh { &:before { content: "\e031"; } }
|
74
71
|
.glyphicon-list-alt { &:before { content: "\e032"; } }
|
72
|
+
.glyphicon-lock { &:before { content: "\e033"; } }
|
75
73
|
.glyphicon-flag { &:before { content: "\e034"; } }
|
76
74
|
.glyphicon-headphones { &:before { content: "\e035"; } }
|
77
75
|
.glyphicon-volume-off { &:before { content: "\e036"; } }
|
@@ -82,7 +80,9 @@
|
|
82
80
|
.glyphicon-tag { &:before { content: "\e041"; } }
|
83
81
|
.glyphicon-tags { &:before { content: "\e042"; } }
|
84
82
|
.glyphicon-book { &:before { content: "\e043"; } }
|
83
|
+
.glyphicon-bookmark { &:before { content: "\e044"; } }
|
85
84
|
.glyphicon-print { &:before { content: "\e045"; } }
|
85
|
+
.glyphicon-camera { &:before { content: "\e046"; } }
|
86
86
|
.glyphicon-font { &:before { content: "\e047"; } }
|
87
87
|
.glyphicon-bold { &:before { content: "\e048"; } }
|
88
88
|
.glyphicon-italic { &:before { content: "\e049"; } }
|
@@ -136,10 +136,12 @@
|
|
136
136
|
.glyphicon-exclamation-sign { &:before { content: "\e101"; } }
|
137
137
|
.glyphicon-gift { &:before { content: "\e102"; } }
|
138
138
|
.glyphicon-leaf { &:before { content: "\e103"; } }
|
139
|
+
.glyphicon-fire { &:before { content: "\e104"; } }
|
139
140
|
.glyphicon-eye-open { &:before { content: "\e105"; } }
|
140
141
|
.glyphicon-eye-close { &:before { content: "\e106"; } }
|
141
142
|
.glyphicon-warning-sign { &:before { content: "\e107"; } }
|
142
143
|
.glyphicon-plane { &:before { content: "\e108"; } }
|
144
|
+
.glyphicon-calendar { &:before { content: "\e109"; } }
|
143
145
|
.glyphicon-random { &:before { content: "\e110"; } }
|
144
146
|
.glyphicon-comment { &:before { content: "\e111"; } }
|
145
147
|
.glyphicon-magnet { &:before { content: "\e112"; } }
|
@@ -153,6 +155,7 @@
|
|
153
155
|
.glyphicon-resize-horizontal { &:before { content: "\e120"; } }
|
154
156
|
.glyphicon-hdd { &:before { content: "\e121"; } }
|
155
157
|
.glyphicon-bullhorn { &:before { content: "\e122"; } }
|
158
|
+
.glyphicon-bell { &:before { content: "\e123"; } }
|
156
159
|
.glyphicon-certificate { &:before { content: "\e124"; } }
|
157
160
|
.glyphicon-thumbs-up { &:before { content: "\e125"; } }
|
158
161
|
.glyphicon-thumbs-down { &:before { content: "\e126"; } }
|
@@ -165,13 +168,17 @@
|
|
165
168
|
.glyphicon-circle-arrow-up { &:before { content: "\e133"; } }
|
166
169
|
.glyphicon-circle-arrow-down { &:before { content: "\e134"; } }
|
167
170
|
.glyphicon-globe { &:before { content: "\e135"; } }
|
171
|
+
.glyphicon-wrench { &:before { content: "\e136"; } }
|
168
172
|
.glyphicon-tasks { &:before { content: "\e137"; } }
|
169
173
|
.glyphicon-filter { &:before { content: "\e138"; } }
|
174
|
+
.glyphicon-briefcase { &:before { content: "\e139"; } }
|
170
175
|
.glyphicon-fullscreen { &:before { content: "\e140"; } }
|
171
176
|
.glyphicon-dashboard { &:before { content: "\e141"; } }
|
177
|
+
.glyphicon-paperclip { &:before { content: "\e142"; } }
|
172
178
|
.glyphicon-heart-empty { &:before { content: "\e143"; } }
|
173
179
|
.glyphicon-link { &:before { content: "\e144"; } }
|
174
180
|
.glyphicon-phone { &:before { content: "\e145"; } }
|
181
|
+
.glyphicon-pushpin { &:before { content: "\e146"; } }
|
175
182
|
.glyphicon-usd { &:before { content: "\e148"; } }
|
176
183
|
.glyphicon-gbp { &:before { content: "\e149"; } }
|
177
184
|
.glyphicon-sort { &:before { content: "\e150"; } }
|
@@ -224,13 +231,3 @@
|
|
224
231
|
.glyphicon-cloud-upload { &:before { content: "\e198"; } }
|
225
232
|
.glyphicon-tree-conifer { &:before { content: "\e199"; } }
|
226
233
|
.glyphicon-tree-deciduous { &:before { content: "\e200"; } }
|
227
|
-
.glyphicon-briefcase { &:before { content: "\1f4bc"; } }
|
228
|
-
.glyphicon-calendar { &:before { content: "\1f4c5"; } }
|
229
|
-
.glyphicon-pushpin { &:before { content: "\1f4cc"; } }
|
230
|
-
.glyphicon-paperclip { &:before { content: "\1f4ce"; } }
|
231
|
-
.glyphicon-camera { &:before { content: "\1f4f7"; } }
|
232
|
-
.glyphicon-lock { &:before { content: "\1f512"; } }
|
233
|
-
.glyphicon-bell { &:before { content: "\1f514"; } }
|
234
|
-
.glyphicon-bookmark { &:before { content: "\1f516"; } }
|
235
|
-
.glyphicon-fire { &:before { content: "\1f525"; } }
|
236
|
-
.glyphicon-wrench { &:before { content: "\1f527"; } }
|