bootstrap-sass 3.0.3.0 → 3.1.0.0
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.
Potentially problematic release.
This version of bootstrap-sass might be problematic. Click here for more details.
- checksums.yaml +4 -4
- data/.gitignore +1 -1
- data/CHANGELOG.md +4 -0
- data/CONTRIBUTING.md +2 -2
- data/Gemfile +1 -1
- data/LICENSE +17 -10
- data/README.md +17 -17
- data/Rakefile +7 -2
- data/bootstrap-sass.gemspec +9 -9
- data/bower.json +22 -0
- data/composer.json +35 -0
- data/lib/bootstrap-sass.rb +1 -3
- data/lib/bootstrap-sass/sass_functions.rb +4 -3
- data/lib/bootstrap-sass/version.rb +2 -2
- data/tasks/converter.rb +21 -15
- data/tasks/converter/fonts_conversion.rb +7 -3
- data/tasks/converter/js_conversion.rb +20 -3
- data/tasks/converter/less_conversion.rb +89 -60
- data/tasks/converter/logger.rb +6 -14
- data/tasks/converter/network.rb +7 -32
- data/test/compilation_test.rb +1 -1
- data/test/dummy/app/views/pages/root.html.slim +8 -2
- data/test/dummy/config/application.rb +2 -2
- data/test/gemfiles/sass_3_2.gemfile +1 -1
- data/test/gemfiles/sass_head.gemfile +2 -3
- data/test/sprockets_rails_test.rb +21 -0
- data/vendor/assets/javascripts/bootstrap/affix.js +34 -23
- data/vendor/assets/javascripts/bootstrap/alert.js +5 -15
- data/vendor/assets/javascripts/bootstrap/button.js +21 -29
- data/vendor/assets/javascripts/bootstrap/carousel.js +16 -28
- data/vendor/assets/javascripts/bootstrap/collapse.js +7 -16
- data/vendor/assets/javascripts/bootstrap/dropdown.js +19 -26
- data/vendor/assets/javascripts/bootstrap/modal.js +25 -28
- data/vendor/assets/javascripts/bootstrap/popover.js +14 -21
- data/vendor/assets/javascripts/bootstrap/scrollspy.js +16 -21
- data/vendor/assets/javascripts/bootstrap/tab.js +7 -17
- data/vendor/assets/javascripts/bootstrap/tooltip.js +52 -39
- data/vendor/assets/javascripts/bootstrap/transition.js +11 -19
- data/vendor/assets/stylesheets/bootstrap/_badges.scss +4 -0
- data/vendor/assets/stylesheets/bootstrap/_breadcrumbs.scss +4 -1
- data/vendor/assets/stylesheets/bootstrap/_button-groups.scss +8 -9
- data/vendor/assets/stylesheets/bootstrap/_buttons.scss +8 -8
- data/vendor/assets/stylesheets/bootstrap/_code.scss +10 -0
- data/vendor/assets/stylesheets/bootstrap/_dropdowns.scss +28 -3
- data/vendor/assets/stylesheets/bootstrap/_forms.scss +81 -38
- data/vendor/assets/stylesheets/bootstrap/_glyphicons.scss +1 -5
- data/vendor/assets/stylesheets/bootstrap/_grid.scss +26 -5
- data/vendor/assets/stylesheets/bootstrap/_input-groups.scss +39 -18
- data/vendor/assets/stylesheets/bootstrap/_jumbotron.scss +3 -5
- data/vendor/assets/stylesheets/bootstrap/_list-group.scss +25 -3
- data/vendor/assets/stylesheets/bootstrap/_mixins.scss +124 -41
- data/vendor/assets/stylesheets/bootstrap/_modals.scss +15 -6
- data/vendor/assets/stylesheets/bootstrap/_navbar.scss +21 -17
- data/vendor/assets/stylesheets/bootstrap/_navs.scss +1 -1
- data/vendor/assets/stylesheets/bootstrap/_normalize.scss +139 -122
- data/vendor/assets/stylesheets/bootstrap/_pager.scss +4 -4
- data/vendor/assets/stylesheets/bootstrap/_pagination.scss +6 -3
- data/vendor/assets/stylesheets/bootstrap/_panels.scss +63 -15
- data/vendor/assets/stylesheets/bootstrap/_print.scss +0 -4
- data/vendor/assets/stylesheets/bootstrap/_responsive-utilities.scss +6 -124
- data/vendor/assets/stylesheets/bootstrap/_scaffolding.scss +17 -2
- data/vendor/assets/stylesheets/bootstrap/_tables.scss +3 -1
- data/vendor/assets/stylesheets/bootstrap/_theme.scss +3 -3
- data/vendor/assets/stylesheets/bootstrap/_thumbnails.scss +4 -4
- data/vendor/assets/stylesheets/bootstrap/_tooltip.scss +1 -1
- data/vendor/assets/stylesheets/bootstrap/_type.scss +77 -62
- data/vendor/assets/stylesheets/bootstrap/_variables.scss +350 -163
- data/vendor/assets/stylesheets/bootstrap/_wells.scss +1 -1
- data/vendor/assets/stylesheets/bootstrap/bootstrap.scss +38 -38
- metadata +22 -4
@@ -1,25 +1,15 @@
|
|
1
1
|
/* ========================================================================
|
2
|
-
* Bootstrap: tooltip.js v3.0
|
2
|
+
* Bootstrap: tooltip.js v3.1.0
|
3
3
|
* http://getbootstrap.com/javascript/#tooltip
|
4
4
|
* Inspired by the original jQuery.tipsy by Jason Frame
|
5
5
|
* ========================================================================
|
6
|
-
* Copyright
|
7
|
-
*
|
8
|
-
* Licensed under the Apache License, Version 2.0 (the "License");
|
9
|
-
* you may not use this file except in compliance with the License.
|
10
|
-
* You may obtain a copy of the License at
|
11
|
-
*
|
12
|
-
* http://www.apache.org/licenses/LICENSE-2.0
|
13
|
-
*
|
14
|
-
* Unless required by applicable law or agreed to in writing, software
|
15
|
-
* distributed under the License is distributed on an "AS IS" BASIS,
|
16
|
-
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
17
|
-
* See the License for the specific language governing permissions and
|
18
|
-
* limitations under the License.
|
6
|
+
* Copyright 2011-2014 Twitter, Inc.
|
7
|
+
* Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
|
19
8
|
* ======================================================================== */
|
20
9
|
|
21
10
|
|
22
|
-
+function ($) {
|
11
|
+
+function ($) {
|
12
|
+
'use strict';
|
23
13
|
|
24
14
|
// TOOLTIP PUBLIC CLASS DEFINITION
|
25
15
|
// ===============================
|
@@ -36,15 +26,15 @@
|
|
36
26
|
}
|
37
27
|
|
38
28
|
Tooltip.DEFAULTS = {
|
39
|
-
animation: true
|
40
|
-
|
41
|
-
|
42
|
-
|
43
|
-
|
44
|
-
|
45
|
-
|
46
|
-
|
47
|
-
|
29
|
+
animation: true,
|
30
|
+
placement: 'top',
|
31
|
+
selector: false,
|
32
|
+
template: '<div class="tooltip"><div class="tooltip-arrow"></div><div class="tooltip-inner"></div></div>',
|
33
|
+
trigger: 'hover focus',
|
34
|
+
title: '',
|
35
|
+
delay: 0,
|
36
|
+
html: false,
|
37
|
+
container: false
|
48
38
|
}
|
49
39
|
|
50
40
|
Tooltip.prototype.init = function (type, element, options) {
|
@@ -61,8 +51,8 @@
|
|
61
51
|
if (trigger == 'click') {
|
62
52
|
this.$element.on('click.' + this.type, this.options.selector, $.proxy(this.toggle, this))
|
63
53
|
} else if (trigger != 'manual') {
|
64
|
-
var eventIn = trigger == 'hover' ? 'mouseenter' : '
|
65
|
-
var eventOut = trigger == 'hover' ? 'mouseleave' : '
|
54
|
+
var eventIn = trigger == 'hover' ? 'mouseenter' : 'focusin'
|
55
|
+
var eventOut = trigger == 'hover' ? 'mouseleave' : 'focusout'
|
66
56
|
|
67
57
|
this.$element.on(eventIn + '.' + this.type, this.options.selector, $.proxy(this.enter, this))
|
68
58
|
this.$element.on(eventOut + '.' + this.type, this.options.selector, $.proxy(this.leave, this))
|
@@ -83,8 +73,8 @@
|
|
83
73
|
|
84
74
|
if (options.delay && typeof options.delay == 'number') {
|
85
75
|
options.delay = {
|
86
|
-
show: options.delay
|
87
|
-
|
76
|
+
show: options.delay,
|
77
|
+
hide: options.delay
|
88
78
|
}
|
89
79
|
}
|
90
80
|
|
@@ -133,12 +123,13 @@
|
|
133
123
|
}
|
134
124
|
|
135
125
|
Tooltip.prototype.show = function () {
|
136
|
-
var e = $.Event('show.bs.'+ this.type)
|
126
|
+
var e = $.Event('show.bs.' + this.type)
|
137
127
|
|
138
128
|
if (this.hasContent() && this.enabled) {
|
139
129
|
this.$element.trigger(e)
|
140
130
|
|
141
131
|
if (e.isDefaultPrevented()) return
|
132
|
+
var that = this;
|
142
133
|
|
143
134
|
var $tip = this.tip()
|
144
135
|
|
@@ -188,11 +179,21 @@
|
|
188
179
|
var calculatedOffset = this.getCalculatedOffset(placement, pos, actualWidth, actualHeight)
|
189
180
|
|
190
181
|
this.applyPlacement(calculatedOffset, placement)
|
191
|
-
this
|
182
|
+
this.hoverState = null
|
183
|
+
|
184
|
+
var complete = function() {
|
185
|
+
that.$element.trigger('shown.bs.' + that.type)
|
186
|
+
}
|
187
|
+
|
188
|
+
$.support.transition && this.$tip.hasClass('fade') ?
|
189
|
+
$tip
|
190
|
+
.one($.support.transition.end, complete)
|
191
|
+
.emulateTransitionEnd(150) :
|
192
|
+
complete()
|
192
193
|
}
|
193
194
|
}
|
194
195
|
|
195
|
-
Tooltip.prototype.applyPlacement = function(offset, placement) {
|
196
|
+
Tooltip.prototype.applyPlacement = function (offset, placement) {
|
196
197
|
var replace
|
197
198
|
var $tip = this.tip()
|
198
199
|
var width = $tip[0].offsetWidth
|
@@ -209,9 +210,18 @@
|
|
209
210
|
offset.top = offset.top + marginTop
|
210
211
|
offset.left = offset.left + marginLeft
|
211
212
|
|
212
|
-
|
213
|
-
|
214
|
-
|
213
|
+
// $.fn.offset doesn't round pixel values
|
214
|
+
// so we use setOffset directly with our own function B-0
|
215
|
+
$.offset.setOffset($tip[0], $.extend({
|
216
|
+
using: function (props) {
|
217
|
+
$tip.css({
|
218
|
+
top: Math.round(props.top),
|
219
|
+
left: Math.round(props.left)
|
220
|
+
})
|
221
|
+
}
|
222
|
+
}, offset), 0)
|
223
|
+
|
224
|
+
$tip.addClass('in')
|
215
225
|
|
216
226
|
// check to see if placing tip in new offset caused the tip to resize itself
|
217
227
|
var actualWidth = $tip[0].offsetWidth
|
@@ -243,8 +253,8 @@
|
|
243
253
|
if (replace) $tip.offset(offset)
|
244
254
|
}
|
245
255
|
|
246
|
-
Tooltip.prototype.replaceArrow = function(delta, dimension, position) {
|
247
|
-
this.arrow().css(position, delta ? (50 * (1 - delta / dimension) +
|
256
|
+
Tooltip.prototype.replaceArrow = function (delta, dimension, position) {
|
257
|
+
this.arrow().css(position, delta ? (50 * (1 - delta / dimension) + '%') : '')
|
248
258
|
}
|
249
259
|
|
250
260
|
Tooltip.prototype.setContent = function () {
|
@@ -262,6 +272,7 @@
|
|
262
272
|
|
263
273
|
function complete() {
|
264
274
|
if (that.hoverState != 'in') $tip.detach()
|
275
|
+
that.$element.trigger('hidden.bs.' + that.type)
|
265
276
|
}
|
266
277
|
|
267
278
|
this.$element.trigger(e)
|
@@ -276,7 +287,7 @@
|
|
276
287
|
.emulateTransitionEnd(150) :
|
277
288
|
complete()
|
278
289
|
|
279
|
-
this
|
290
|
+
this.hoverState = null
|
280
291
|
|
281
292
|
return this
|
282
293
|
}
|
@@ -295,8 +306,8 @@
|
|
295
306
|
Tooltip.prototype.getPosition = function () {
|
296
307
|
var el = this.$element[0]
|
297
308
|
return $.extend({}, (typeof el.getBoundingClientRect == 'function') ? el.getBoundingClientRect() : {
|
298
|
-
width: el.offsetWidth
|
299
|
-
|
309
|
+
width: el.offsetWidth,
|
310
|
+
height: el.offsetHeight
|
300
311
|
}, this.$element.offset())
|
301
312
|
}
|
302
313
|
|
@@ -352,6 +363,7 @@
|
|
352
363
|
}
|
353
364
|
|
354
365
|
Tooltip.prototype.destroy = function () {
|
366
|
+
clearTimeout(this.timeout)
|
355
367
|
this.hide().$element.off('.' + this.type).removeData('bs.' + this.type)
|
356
368
|
}
|
357
369
|
|
@@ -367,6 +379,7 @@
|
|
367
379
|
var data = $this.data('bs.tooltip')
|
368
380
|
var options = typeof option == 'object' && option
|
369
381
|
|
382
|
+
if (!data && option == 'destroy') return
|
370
383
|
if (!data) $this.data('bs.tooltip', (data = new Tooltip(this, options)))
|
371
384
|
if (typeof option == 'string') data[option]()
|
372
385
|
})
|
@@ -1,24 +1,14 @@
|
|
1
1
|
/* ========================================================================
|
2
|
-
* Bootstrap: transition.js v3.0
|
2
|
+
* Bootstrap: transition.js v3.1.0
|
3
3
|
* http://getbootstrap.com/javascript/#transitions
|
4
4
|
* ========================================================================
|
5
|
-
* Copyright
|
6
|
-
*
|
7
|
-
* Licensed under the Apache License, Version 2.0 (the "License");
|
8
|
-
* you may not use this file except in compliance with the License.
|
9
|
-
* You may obtain a copy of the License at
|
10
|
-
*
|
11
|
-
* http://www.apache.org/licenses/LICENSE-2.0
|
12
|
-
*
|
13
|
-
* Unless required by applicable law or agreed to in writing, software
|
14
|
-
* distributed under the License is distributed on an "AS IS" BASIS,
|
15
|
-
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
16
|
-
* See the License for the specific language governing permissions and
|
17
|
-
* limitations under the License.
|
5
|
+
* Copyright 2011-2014 Twitter, Inc.
|
6
|
+
* Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
|
18
7
|
* ======================================================================== */
|
19
8
|
|
20
9
|
|
21
|
-
+function ($) {
|
10
|
+
+function ($) {
|
11
|
+
'use strict';
|
22
12
|
|
23
13
|
// CSS TRANSITION SUPPORT (Shoutout: http://www.modernizr.com/)
|
24
14
|
// ============================================================
|
@@ -27,10 +17,10 @@
|
|
27
17
|
var el = document.createElement('bootstrap')
|
28
18
|
|
29
19
|
var transEndEventNames = {
|
30
|
-
'WebkitTransition' : 'webkitTransitionEnd'
|
31
|
-
|
32
|
-
|
33
|
-
|
20
|
+
'WebkitTransition' : 'webkitTransitionEnd',
|
21
|
+
'MozTransition' : 'transitionend',
|
22
|
+
'OTransition' : 'oTransitionEnd otransitionend',
|
23
|
+
'transition' : 'transitionend'
|
34
24
|
}
|
35
25
|
|
36
26
|
for (var name in transEndEventNames) {
|
@@ -38,6 +28,8 @@
|
|
38
28
|
return { end: transEndEventNames[name] }
|
39
29
|
}
|
40
30
|
}
|
31
|
+
|
32
|
+
return false // explicit for ie8 ( ._.)
|
41
33
|
}
|
42
34
|
|
43
35
|
// http://blog.alexmaccaw.com/css-transitions
|
@@ -4,19 +4,22 @@
|
|
4
4
|
|
5
5
|
|
6
6
|
.breadcrumb {
|
7
|
-
padding:
|
7
|
+
padding: $breadcrumb-padding-vertical $breadcrumb-padding-horizontal;
|
8
8
|
margin-bottom: $line-height-computed;
|
9
9
|
list-style: none;
|
10
10
|
background-color: $breadcrumb-bg;
|
11
11
|
border-radius: $border-radius-base;
|
12
|
+
|
12
13
|
> li {
|
13
14
|
display: inline-block;
|
15
|
+
|
14
16
|
+ li:before {
|
15
17
|
content: "#{$breadcrumb-separator}\00a0"; // Unicode space added since inline-block means non-collapsing white-space
|
16
18
|
padding: 0 5px;
|
17
19
|
color: $breadcrumb-color;
|
18
20
|
}
|
19
21
|
}
|
22
|
+
|
20
23
|
> .active {
|
21
24
|
color: $breadcrumb-active-color;
|
22
25
|
}
|
@@ -37,18 +37,17 @@
|
|
37
37
|
|
38
38
|
// Optional: Group multiple button groups together for a toolbar
|
39
39
|
.btn-toolbar {
|
40
|
+
margin-left: -5px; // Offset the first child's margin
|
40
41
|
@include clearfix();
|
41
42
|
|
42
|
-
.btn-group
|
43
|
+
.btn-group,
|
44
|
+
.input-group {
|
43
45
|
float: left;
|
44
46
|
}
|
45
|
-
// Space out series of button groups
|
46
47
|
> .btn,
|
47
|
-
> .btn-group
|
48
|
-
|
49
|
-
|
50
|
-
margin-left: 5px;
|
51
|
-
}
|
48
|
+
> .btn-group,
|
49
|
+
> .input-group {
|
50
|
+
margin-left: 5px;
|
52
51
|
}
|
53
52
|
}
|
54
53
|
|
@@ -188,13 +187,13 @@
|
|
188
187
|
.btn-group-vertical > .btn-group:not(:first-child):not(:last-child) > .btn {
|
189
188
|
border-radius: 0;
|
190
189
|
}
|
191
|
-
.btn-group-vertical > .btn-group:first-child {
|
190
|
+
.btn-group-vertical > .btn-group:first-child:not(:last-child) {
|
192
191
|
> .btn:last-child,
|
193
192
|
> .dropdown-toggle {
|
194
193
|
@include border-bottom-radius(0);
|
195
194
|
}
|
196
195
|
}
|
197
|
-
.btn-group-vertical > .btn-group:last-child > .btn:first-child {
|
196
|
+
.btn-group-vertical > .btn-group:last-child:not(:first-child) > .btn:first-child {
|
198
197
|
@include border-top-radius(0);
|
199
198
|
}
|
200
199
|
|
@@ -56,14 +56,6 @@
|
|
56
56
|
.btn-primary {
|
57
57
|
@include button-variant($btn-primary-color, $btn-primary-bg, $btn-primary-border);
|
58
58
|
}
|
59
|
-
// Warning appears as orange
|
60
|
-
.btn-warning {
|
61
|
-
@include button-variant($btn-warning-color, $btn-warning-bg, $btn-warning-border);
|
62
|
-
}
|
63
|
-
// Danger and error appear as red
|
64
|
-
.btn-danger {
|
65
|
-
@include button-variant($btn-danger-color, $btn-danger-bg, $btn-danger-border);
|
66
|
-
}
|
67
59
|
// Success appears as green
|
68
60
|
.btn-success {
|
69
61
|
@include button-variant($btn-success-color, $btn-success-bg, $btn-success-border);
|
@@ -72,6 +64,14 @@
|
|
72
64
|
.btn-info {
|
73
65
|
@include button-variant($btn-info-color, $btn-info-bg, $btn-info-border);
|
74
66
|
}
|
67
|
+
// Warning appears as orange
|
68
|
+
.btn-warning {
|
69
|
+
@include button-variant($btn-warning-color, $btn-warning-bg, $btn-warning-border);
|
70
|
+
}
|
71
|
+
// Danger and error appear as red
|
72
|
+
.btn-danger {
|
73
|
+
@include button-variant($btn-danger-color, $btn-danger-bg, $btn-danger-border);
|
74
|
+
}
|
75
75
|
|
76
76
|
|
77
77
|
// Link buttons
|
@@ -21,6 +21,16 @@ code {
|
|
21
21
|
border-radius: $border-radius-base;
|
22
22
|
}
|
23
23
|
|
24
|
+
// User input typically entered via keyboard
|
25
|
+
kbd {
|
26
|
+
padding: 2px 4px;
|
27
|
+
font-size: 90%;
|
28
|
+
color: $kbd-color;
|
29
|
+
background-color: $kbd-bg;
|
30
|
+
border-radius: $border-radius-small;
|
31
|
+
box-shadow: inset 0 -1px 0 rgba(0,0,0,.25);
|
32
|
+
}
|
33
|
+
|
24
34
|
// Blocks of code
|
25
35
|
pre {
|
26
36
|
display: block;
|
@@ -46,6 +46,8 @@
|
|
46
46
|
background-clip: padding-box;
|
47
47
|
|
48
48
|
// Aligns the dropdown menu to right
|
49
|
+
//
|
50
|
+
// Deprecated as of 3.1.0 in favor of `.dropdown-menu-[dir]`
|
49
51
|
&.pull-right {
|
50
52
|
right: 0;
|
51
53
|
left: auto;
|
@@ -126,6 +128,25 @@
|
|
126
128
|
}
|
127
129
|
}
|
128
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
|
+
|
129
150
|
// Dropdown section headers
|
130
151
|
.dropdown-header {
|
131
152
|
display: block;
|
@@ -142,7 +163,7 @@
|
|
142
163
|
right: 0;
|
143
164
|
bottom: 0;
|
144
165
|
top: 0;
|
145
|
-
z-index: $zindex-dropdown - 10;
|
166
|
+
z-index: ($zindex-dropdown - 10);
|
146
167
|
}
|
147
168
|
|
148
169
|
// Right aligned dropdowns
|
@@ -180,8 +201,12 @@
|
|
180
201
|
@media (min-width: $grid-float-breakpoint) {
|
181
202
|
.navbar-right {
|
182
203
|
.dropdown-menu {
|
183
|
-
right: 0;
|
184
|
-
|
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;
|
185
210
|
}
|
186
211
|
}
|
187
212
|
}
|
@@ -11,6 +11,10 @@ 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 {
|
@@ -33,6 +37,10 @@ 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"] {
|
@@ -47,41 +55,30 @@ 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
79
|
@include tab-focus();
|
73
80
|
}
|
74
81
|
|
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
|
-
}
|
83
|
-
}
|
84
|
-
|
85
82
|
// Adjust output element
|
86
83
|
output {
|
87
84
|
display: block;
|
@@ -89,7 +86,6 @@ output {
|
|
89
86
|
font-size: $font-size-base;
|
90
87
|
line-height: $line-height-base;
|
91
88
|
color: $input-color;
|
92
|
-
vertical-align: middle;
|
93
89
|
}
|
94
90
|
|
95
91
|
|
@@ -123,7 +119,6 @@ output {
|
|
123
119
|
font-size: $font-size-base;
|
124
120
|
line-height: $line-height-base;
|
125
121
|
color: $input-color;
|
126
|
-
vertical-align: middle;
|
127
122
|
background-color: $input-bg;
|
128
123
|
background-image: none; // Reset unusual Firefox-on-Android default style; see https://github.com/necolas/normalize.css/issues/214
|
129
124
|
border: 1px solid $input-border;
|
@@ -135,9 +130,6 @@ output {
|
|
135
130
|
@include form-control-focus();
|
136
131
|
|
137
132
|
// Placeholder
|
138
|
-
//
|
139
|
-
// Placeholder text gets special styles because when browsers invalidate entire
|
140
|
-
// lines if it doesn't understand a selector/
|
141
133
|
@include placeholder();
|
142
134
|
|
143
135
|
// Disabled and read-only inputs
|
@@ -149,6 +141,7 @@ output {
|
|
149
141
|
fieldset[disabled] & {
|
150
142
|
cursor: not-allowed;
|
151
143
|
background-color: $input-bg-disabled;
|
144
|
+
opacity: 1; // iOS fix for unreadable disabled content
|
152
145
|
}
|
153
146
|
|
154
147
|
// [converter] extracted textarea& to textarea.form-control
|
@@ -159,6 +152,14 @@ textarea.form-control {
|
|
159
152
|
height: auto;
|
160
153
|
}
|
161
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;
|
161
|
+
}
|
162
|
+
|
162
163
|
|
163
164
|
// Form groups
|
164
165
|
//
|
@@ -181,10 +182,8 @@ textarea.form-control {
|
|
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,7 +231,11 @@ input[type="checkbox"],
|
|
232
231
|
}
|
233
232
|
}
|
234
233
|
|
234
|
+
|
235
235
|
// Form control sizing
|
236
|
+
//
|
237
|
+
// Build on `.form-control` with modifier classes to decrease or increase the
|
238
|
+
// height and font-size of form controls.
|
236
239
|
|
237
240
|
@include input-size('.input-sm', $input-height-small, $padding-small-vertical, $padding-small-horizontal, $font-size-small, $line-height-small, $border-radius-small);
|
238
241
|
|
@@ -243,18 +246,38 @@ input[type="checkbox"],
|
|
243
246
|
//
|
244
247
|
// Apply contextual and semantic states to individual form controls.
|
245
248
|
|
246
|
-
|
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
|
+
}
|
247
275
|
.has-warning {
|
248
276
|
@include form-control-validation($state-warning-text, $state-warning-text, $state-warning-bg);
|
249
277
|
}
|
250
|
-
// Error
|
251
278
|
.has-error {
|
252
279
|
@include form-control-validation($state-danger-text, $state-danger-text, $state-danger-bg);
|
253
280
|
}
|
254
|
-
// Success
|
255
|
-
.has-success {
|
256
|
-
@include form-control-validation($state-success-text, $state-success-text, $state-success-bg);
|
257
|
-
}
|
258
281
|
|
259
282
|
|
260
283
|
// Static form control text
|
@@ -295,9 +318,9 @@ input[type="checkbox"],
|
|
295
318
|
.form-inline {
|
296
319
|
|
297
320
|
// Kick in the inline
|
298
|
-
@media (min-width: $screen-sm) {
|
321
|
+
@media (min-width: $screen-sm-min) {
|
299
322
|
// Inline-block all the things for "inline"
|
300
|
-
.form-group
|
323
|
+
.form-group {
|
301
324
|
display: inline-block;
|
302
325
|
margin-bottom: 0;
|
303
326
|
vertical-align: middle;
|
@@ -306,11 +329,13 @@ input[type="checkbox"],
|
|
306
329
|
// In navbar-form, allow folks to *not* use `.form-group`
|
307
330
|
.form-control {
|
308
331
|
display: inline-block;
|
332
|
+
width: auto; // Prevent labels from stacking above inputs in `.form-group`
|
333
|
+
vertical-align: middle;
|
309
334
|
}
|
310
335
|
|
311
|
-
|
312
|
-
|
313
|
-
|
336
|
+
.control-label {
|
337
|
+
margin-bottom: 0;
|
338
|
+
vertical-align: middle;
|
314
339
|
}
|
315
340
|
|
316
341
|
// Remove default margin on radios/checkboxes that were used for stacking, and
|
@@ -322,12 +347,21 @@ input[type="checkbox"],
|
|
322
347
|
margin-top: 0;
|
323
348
|
margin-bottom: 0;
|
324
349
|
padding-left: 0;
|
350
|
+
vertical-align: middle;
|
325
351
|
}
|
326
352
|
.radio input[type="radio"],
|
327
353
|
.checkbox input[type="checkbox"] {
|
328
354
|
float: none;
|
329
355
|
margin-left: 0;
|
330
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
|
+
}
|
331
365
|
}
|
332
366
|
}
|
333
367
|
|
@@ -353,7 +387,7 @@ input[type="checkbox"],
|
|
353
387
|
// and other content below items
|
354
388
|
.radio,
|
355
389
|
.checkbox {
|
356
|
-
min-height: $line-height-computed + ($padding-base-vertical + 1);
|
390
|
+
min-height: ($line-height-computed + ($padding-base-vertical + 1));
|
357
391
|
}
|
358
392
|
|
359
393
|
// Make form groups behave like rows
|
@@ -371,4 +405,13 @@ input[type="checkbox"],
|
|
371
405
|
text-align: right;
|
372
406
|
}
|
373
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
|
+
}
|
374
417
|
}
|