bootstrap-generators 3.0.2.2 → 3.1.0
Sign up to get free protection for your applications and to get access to all the features.
- checksums.yaml +4 -4
- data/README.md +2 -2
- data/Rakefile +7 -6
- data/bootstrap-generators.gemspec +1 -1
- data/lib/bootstrap/generators/version.rb +1 -1
- data/lib/generators/bootstrap/install/templates/assets/stylesheets/bootstrap-variables.less +354 -164
- data/lib/generators/bootstrap/install/templates/assets/stylesheets/bootstrap-variables.scss +359 -165
- 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 +3 -3
- data/lib/generators/bootstrap/install/templates/form_builders/form_builder/_form.html.slim +3 -3
- data/lib/generators/bootstrap/install/templates/layouts/starter.html.erb +1 -0
- data/lib/generators/bootstrap/install/templates/layouts/starter.html.haml +1 -0
- data/lib/generators/bootstrap/install/templates/layouts/starter.html.slim +2 -0
- data/readme-template.md.erb +14 -0
- data/vendor/assets/fonts/{glyphicons-halflings-regular.eot → bootstrap/glyphicons-halflings-regular.eot} +0 -0
- data/vendor/assets/fonts/{glyphicons-halflings-regular.svg → bootstrap/glyphicons-halflings-regular.svg} +0 -0
- data/vendor/assets/fonts/{glyphicons-halflings-regular.ttf → bootstrap/glyphicons-halflings-regular.ttf} +0 -0
- data/vendor/assets/fonts/{glyphicons-halflings-regular.woff → bootstrap/glyphicons-halflings-regular.woff} +0 -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 +24 -26
- data/vendor/assets/javascripts/bootstrap/carousel.js +20 -32
- data/vendor/assets/javascripts/bootstrap/collapse.js +7 -16
- data/vendor/assets/javascripts/bootstrap/dropdown.js +23 -30
- 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 +17 -22
- 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.css +1209 -2476
- data/vendor/twitter/bootstrap/less/badges.less +10 -6
- data/vendor/twitter/bootstrap/less/breadcrumbs.less +4 -1
- data/vendor/twitter/bootstrap/less/button-groups.less +17 -44
- data/vendor/twitter/bootstrap/less/buttons.less +10 -13
- data/vendor/twitter/bootstrap/less/carousel.less +1 -0
- data/vendor/twitter/bootstrap/less/code.less +10 -0
- data/vendor/twitter/bootstrap/less/dropdowns.less +31 -10
- data/vendor/twitter/bootstrap/less/forms.less +89 -34
- data/vendor/twitter/bootstrap/less/glyphicons.less +5 -9
- data/vendor/twitter/bootstrap/less/grid.less +36 -29
- data/vendor/twitter/bootstrap/less/input-groups.less +40 -19
- data/vendor/twitter/bootstrap/less/jumbotron.less +11 -7
- data/vendor/twitter/bootstrap/less/labels.less +6 -0
- data/vendor/twitter/bootstrap/less/list-group.less +25 -3
- data/vendor/twitter/bootstrap/less/mixins.less +140 -72
- data/vendor/twitter/bootstrap/less/modals.less +18 -12
- data/vendor/twitter/bootstrap/less/navbar.less +65 -73
- data/vendor/twitter/bootstrap/less/navs.less +2 -22
- data/vendor/twitter/bootstrap/less/normalize.less +139 -122
- data/vendor/twitter/bootstrap/less/pager.less +5 -5
- data/vendor/twitter/bootstrap/less/pagination.less +6 -3
- data/vendor/twitter/bootstrap/less/panels.less +73 -15
- data/vendor/twitter/bootstrap/less/print.less +0 -4
- data/vendor/twitter/bootstrap/less/progress-bars.less +0 -12
- data/vendor/twitter/bootstrap/less/responsive-utilities.less +13 -129
- data/vendor/twitter/bootstrap/less/scaffolding.less +17 -2
- data/vendor/twitter/bootstrap/less/tables.less +19 -22
- data/vendor/twitter/bootstrap/less/theme.less +1 -1
- data/vendor/twitter/bootstrap/less/thumbnails.less +9 -3
- data/vendor/twitter/bootstrap/less/tooltip.less +1 -1
- data/vendor/twitter/bootstrap/less/type.less +123 -106
- data/vendor/twitter/bootstrap/less/variables.less +354 -164
- data/vendor/twitter/bootstrap/less/wells.less +1 -1
- data/vendor/twitter/bootstrap/sass/_badges.scss +10 -6
- data/vendor/twitter/bootstrap/sass/_breadcrumbs.scss +4 -1
- data/vendor/twitter/bootstrap/sass/_button-groups.scss +15 -42
- data/vendor/twitter/bootstrap/sass/_buttons.scss +10 -13
- data/vendor/twitter/bootstrap/sass/_carousel.scss +1 -0
- data/vendor/twitter/bootstrap/sass/_code.scss +10 -0
- data/vendor/twitter/bootstrap/sass/_dropdowns.scss +31 -11
- data/vendor/twitter/bootstrap/sass/_forms.scss +88 -34
- data/vendor/twitter/bootstrap/sass/_glyphicons.scss +5 -9
- data/vendor/twitter/bootstrap/sass/_grid.scss +36 -29
- data/vendor/twitter/bootstrap/sass/_input-groups.scss +40 -19
- data/vendor/twitter/bootstrap/sass/_jumbotron.scss +11 -7
- data/vendor/twitter/bootstrap/sass/_labels.scss +6 -0
- data/vendor/twitter/bootstrap/sass/_list-group.scss +25 -3
- data/vendor/twitter/bootstrap/sass/_mixins.scss +135 -65
- data/vendor/twitter/bootstrap/sass/_modals.scss +17 -11
- data/vendor/twitter/bootstrap/sass/_navbar.scss +62 -70
- data/vendor/twitter/bootstrap/sass/_navs.scss +1 -21
- data/vendor/twitter/bootstrap/sass/_normalize.scss +139 -122
- data/vendor/twitter/bootstrap/sass/_pager.scss +4 -4
- data/vendor/twitter/bootstrap/sass/_pagination.scss +6 -3
- data/vendor/twitter/bootstrap/sass/_panels.scss +72 -14
- data/vendor/twitter/bootstrap/sass/_print.scss +0 -4
- data/vendor/twitter/bootstrap/sass/_progress-bars.scss +0 -12
- data/vendor/twitter/bootstrap/sass/_responsive-utilities.scss +6 -124
- data/vendor/twitter/bootstrap/sass/_scaffolding.scss +17 -2
- data/vendor/twitter/bootstrap/sass/_tables.scss +7 -18
- data/vendor/twitter/bootstrap/sass/_theme.scss +1 -1
- data/vendor/twitter/bootstrap/sass/_thumbnails.scss +13 -7
- data/vendor/twitter/bootstrap/sass/_tooltip.scss +1 -1
- data/vendor/twitter/bootstrap/sass/_type.scss +122 -105
- data/vendor/twitter/bootstrap/sass/_variables.scss +359 -165
- data/vendor/twitter/bootstrap/sass/_wells.scss +1 -1
- metadata +7 -7
@@ -10,11 +10,11 @@
|
|
10
10
|
// Import the fonts
|
11
11
|
@font-face {
|
12
12
|
font-family: 'Glyphicons Halflings';
|
13
|
-
src: url('@{icon-font-path}@{icon-font-name}.eot');
|
14
|
-
src: url('@{icon-font-path}@{icon-font-name}.eot?#iefix') format('embedded-opentype'),
|
15
|
-
url('@{icon-font-path}@{icon-font-name}.woff') format('woff'),
|
16
|
-
url('@{icon-font-path}@{icon-font-name}.ttf') format('truetype'),
|
17
|
-
url('@{icon-font-path}@{icon-font-name}.svg
|
13
|
+
src: ~"url('@{icon-font-path}@{icon-font-name}.eot')";
|
14
|
+
src: ~"url('@{icon-font-path}@{icon-font-name}.eot?#iefix') format('embedded-opentype')",
|
15
|
+
~"url('@{icon-font-path}@{icon-font-name}.woff') format('woff')",
|
16
|
+
~"url('@{icon-font-path}@{icon-font-name}.ttf') format('truetype')",
|
17
|
+
~"url('@{icon-font-path}@{icon-font-name}.svg#@{icon-font-svg-id}') format('svg')";
|
18
18
|
}
|
19
19
|
|
20
20
|
// Catchall baseclass
|
@@ -28,10 +28,6 @@
|
|
28
28
|
line-height: 1;
|
29
29
|
-webkit-font-smoothing: antialiased;
|
30
30
|
-moz-osx-font-smoothing: grayscale;
|
31
|
-
|
32
|
-
&:empty {
|
33
|
-
width: 1em;
|
34
|
-
}
|
35
31
|
}
|
36
32
|
|
37
33
|
// Individual icons
|
@@ -2,27 +2,56 @@
|
|
2
2
|
// Grid system
|
3
3
|
// --------------------------------------------------
|
4
4
|
|
5
|
-
|
5
|
+
|
6
|
+
// Container widths
|
7
|
+
//
|
8
|
+
// Set the container width, and override it for fixed navbars in media queries.
|
9
|
+
|
6
10
|
.container {
|
7
11
|
.container-fixed();
|
12
|
+
|
13
|
+
@media (min-width: @screen-sm-min) {
|
14
|
+
width: @container-sm;
|
15
|
+
}
|
16
|
+
@media (min-width: @screen-md-min) {
|
17
|
+
width: @container-md;
|
18
|
+
}
|
19
|
+
@media (min-width: @screen-lg-min) {
|
20
|
+
width: @container-lg;
|
21
|
+
}
|
22
|
+
}
|
23
|
+
|
24
|
+
|
25
|
+
// Fluid container
|
26
|
+
//
|
27
|
+
// Utilizes the mixin meant for fixed width containers, but without any defined
|
28
|
+
// width for fluid, full width layouts.
|
29
|
+
|
30
|
+
.container-fluid {
|
31
|
+
.container-fixed();
|
8
32
|
}
|
9
33
|
|
10
|
-
|
34
|
+
|
35
|
+
// Row
|
36
|
+
//
|
37
|
+
// Rows contain and clear the floats of your columns.
|
38
|
+
|
11
39
|
.row {
|
12
40
|
.make-row();
|
13
41
|
}
|
14
42
|
|
43
|
+
|
44
|
+
// Columns
|
45
|
+
//
|
15
46
|
// Common styles for small and large grid columns
|
47
|
+
|
16
48
|
.make-grid-columns();
|
17
49
|
|
18
50
|
|
19
51
|
// Extra small grid
|
20
52
|
//
|
21
|
-
//
|
22
|
-
//
|
23
|
-
//
|
24
|
-
// Note that `.col-xs-12` doesn't get floated on purpose--there's no need since
|
25
|
-
// it's full-width.
|
53
|
+
// Columns, offsets, pushes, and pulls for extra small devices like
|
54
|
+
// smartphones.
|
26
55
|
|
27
56
|
.make-grid-columns-float(xs);
|
28
57
|
.make-grid(@grid-columns, xs, width);
|
@@ -35,15 +64,8 @@
|
|
35
64
|
//
|
36
65
|
// Columns, offsets, pushes, and pulls for the small device range, from phones
|
37
66
|
// to tablets.
|
38
|
-
//
|
39
|
-
// Note that `.col-sm-12` doesn't get floated on purpose--there's no need since
|
40
|
-
// it's full-width.
|
41
67
|
|
42
68
|
@media (min-width: @screen-sm-min) {
|
43
|
-
.container {
|
44
|
-
width: @container-sm;
|
45
|
-
}
|
46
|
-
|
47
69
|
.make-grid-columns-float(sm);
|
48
70
|
.make-grid(@grid-columns, sm, width);
|
49
71
|
.make-grid(@grid-columns, sm, pull);
|
@@ -55,15 +77,8 @@
|
|
55
77
|
// Medium grid
|
56
78
|
//
|
57
79
|
// Columns, offsets, pushes, and pulls for the desktop device range.
|
58
|
-
//
|
59
|
-
// Note that `.col-md-12` doesn't get floated on purpose--there's no need since
|
60
|
-
// it's full-width.
|
61
80
|
|
62
81
|
@media (min-width: @screen-md-min) {
|
63
|
-
.container {
|
64
|
-
width: @container-md;
|
65
|
-
}
|
66
|
-
|
67
82
|
.make-grid-columns-float(md);
|
68
83
|
.make-grid(@grid-columns, md, width);
|
69
84
|
.make-grid(@grid-columns, md, pull);
|
@@ -75,19 +90,11 @@
|
|
75
90
|
// Large grid
|
76
91
|
//
|
77
92
|
// Columns, offsets, pushes, and pulls for the large desktop device range.
|
78
|
-
//
|
79
|
-
// Note that `.col-lg-12` doesn't get floated on purpose--there's no need since
|
80
|
-
// it's full-width.
|
81
93
|
|
82
94
|
@media (min-width: @screen-lg-min) {
|
83
|
-
.container {
|
84
|
-
width: @container-lg;
|
85
|
-
}
|
86
|
-
|
87
95
|
.make-grid-columns-float(lg);
|
88
96
|
.make-grid(@grid-columns, lg, width);
|
89
97
|
.make-grid(@grid-columns, lg, pull);
|
90
98
|
.make-grid(@grid-columns, lg, push);
|
91
99
|
.make-grid(@grid-columns, lg, offset);
|
92
100
|
}
|
93
|
-
|
@@ -10,13 +10,18 @@
|
|
10
10
|
border-collapse: separate; // prevent input groups from inheriting border styles from table cells when placed within a table
|
11
11
|
|
12
12
|
// Undo padding and float of grid classes
|
13
|
-
|
13
|
+
&[class*="col-"] {
|
14
14
|
float: none;
|
15
15
|
padding-left: 0;
|
16
16
|
padding-right: 0;
|
17
17
|
}
|
18
18
|
|
19
19
|
.form-control {
|
20
|
+
// IE9 fubars the placeholder attribute in text inputs and the arrows on
|
21
|
+
// select elements in input groups. To fix it, we float the input. Details:
|
22
|
+
// https://github.com/twbs/bootstrap/issues/11561#issuecomment-28936855
|
23
|
+
float: left;
|
24
|
+
|
20
25
|
width: 100%;
|
21
26
|
margin-bottom: 0;
|
22
27
|
}
|
@@ -90,8 +95,10 @@
|
|
90
95
|
.input-group .form-control:first-child,
|
91
96
|
.input-group-addon:first-child,
|
92
97
|
.input-group-btn:first-child > .btn,
|
98
|
+
.input-group-btn:first-child > .btn-group > .btn,
|
93
99
|
.input-group-btn:first-child > .dropdown-toggle,
|
94
|
-
.input-group-btn:last-child > .btn:not(:last-child):not(.dropdown-toggle)
|
100
|
+
.input-group-btn:last-child > .btn:not(:last-child):not(.dropdown-toggle),
|
101
|
+
.input-group-btn:last-child > .btn-group:not(:last-child) > .btn {
|
95
102
|
.border-right-radius(0);
|
96
103
|
}
|
97
104
|
.input-group-addon:first-child {
|
@@ -100,8 +107,10 @@
|
|
100
107
|
.input-group .form-control:last-child,
|
101
108
|
.input-group-addon:last-child,
|
102
109
|
.input-group-btn:last-child > .btn,
|
110
|
+
.input-group-btn:last-child > .btn-group > .btn,
|
103
111
|
.input-group-btn:last-child > .dropdown-toggle,
|
104
|
-
.input-group-btn:first-child > .btn:not(:first-child)
|
112
|
+
.input-group-btn:first-child > .btn:not(:first-child),
|
113
|
+
.input-group-btn:first-child > .btn-group:not(:first-child) > .btn {
|
105
114
|
.border-left-radius(0);
|
106
115
|
}
|
107
116
|
.input-group-addon:last-child {
|
@@ -112,25 +121,37 @@
|
|
112
121
|
// -------------------------
|
113
122
|
.input-group-btn {
|
114
123
|
position: relative;
|
124
|
+
// Jankily prevent input button groups from wrapping with `white-space` and
|
125
|
+
// `font-size` in combination with `inline-block` on buttons.
|
126
|
+
font-size: 0;
|
115
127
|
white-space: nowrap;
|
116
128
|
|
117
|
-
// Negative margin
|
118
|
-
|
119
|
-
|
129
|
+
// Negative margin for spacing, position for bringing hovered/focused/actived
|
130
|
+
// element above the siblings.
|
131
|
+
> .btn {
|
132
|
+
position: relative;
|
133
|
+
+ .btn {
|
134
|
+
margin-left: -1px;
|
135
|
+
}
|
136
|
+
// Bring the "active" button to the front
|
137
|
+
&:hover,
|
138
|
+
&:focus,
|
139
|
+
&:active {
|
140
|
+
z-index: 2;
|
141
|
+
}
|
120
142
|
}
|
121
|
-
|
122
|
-
|
123
|
-
|
124
|
-
|
125
|
-
|
126
|
-
|
127
|
-
|
128
|
-
+ .btn {
|
129
|
-
margin-left: -4px;
|
143
|
+
|
144
|
+
// Negative margin to only have a 1px border between the two
|
145
|
+
&:first-child {
|
146
|
+
> .btn,
|
147
|
+
> .btn-group {
|
148
|
+
margin-right: -1px;
|
149
|
+
}
|
130
150
|
}
|
131
|
-
|
132
|
-
|
133
|
-
|
134
|
-
|
151
|
+
&:last-child {
|
152
|
+
> .btn,
|
153
|
+
> .btn-group {
|
154
|
+
margin-left: -1px;
|
155
|
+
}
|
135
156
|
}
|
136
157
|
}
|
@@ -6,24 +6,27 @@
|
|
6
6
|
.jumbotron {
|
7
7
|
padding: @jumbotron-padding;
|
8
8
|
margin-bottom: @jumbotron-padding;
|
9
|
-
font-size: @jumbotron-font-size;
|
10
|
-
font-weight: 200;
|
11
|
-
line-height: (@line-height-base * 1.5);
|
12
9
|
color: @jumbotron-color;
|
13
10
|
background-color: @jumbotron-bg;
|
14
11
|
|
15
|
-
h1
|
16
|
-
|
12
|
+
h1,
|
13
|
+
.h1 {
|
17
14
|
color: @jumbotron-heading-color;
|
18
15
|
}
|
19
16
|
p {
|
20
|
-
|
17
|
+
margin-bottom: (@jumbotron-padding / 2);
|
18
|
+
font-size: @jumbotron-font-size;
|
19
|
+
font-weight: 200;
|
21
20
|
}
|
22
21
|
|
23
22
|
.container & {
|
24
23
|
border-radius: @border-radius-large; // Only round corners at higher resolutions if contained in a container
|
25
24
|
}
|
26
25
|
|
26
|
+
.container {
|
27
|
+
max-width: 100%;
|
28
|
+
}
|
29
|
+
|
27
30
|
@media screen and (min-width: @screen-sm-min) {
|
28
31
|
padding-top: (@jumbotron-padding * 1.6);
|
29
32
|
padding-bottom: (@jumbotron-padding * 1.6);
|
@@ -33,7 +36,8 @@
|
|
33
36
|
padding-right: (@jumbotron-padding * 2);
|
34
37
|
}
|
35
38
|
|
36
|
-
h1
|
39
|
+
h1,
|
40
|
+
.h1 {
|
37
41
|
font-size: (@font-size-base * 4.5);
|
38
42
|
}
|
39
43
|
}
|
@@ -2,17 +2,21 @@
|
|
2
2
|
// List groups
|
3
3
|
// --------------------------------------------------
|
4
4
|
|
5
|
+
|
5
6
|
// Base class
|
6
7
|
//
|
7
8
|
// Easily usable on <ul>, <ol>, or <div>.
|
9
|
+
|
8
10
|
.list-group {
|
9
11
|
// No need to set list-style: none; since .list-group-item is block level
|
10
12
|
margin-bottom: 20px;
|
11
13
|
padding-left: 0; // reset padding because ul and ol
|
12
14
|
}
|
13
15
|
|
16
|
+
|
14
17
|
// Individual list items
|
15
|
-
//
|
18
|
+
//
|
19
|
+
// Use on `li`s or `div`s within the `.list-group` parent.
|
16
20
|
|
17
21
|
.list-group-item {
|
18
22
|
position: relative;
|
@@ -41,7 +45,12 @@
|
|
41
45
|
}
|
42
46
|
}
|
43
47
|
|
48
|
+
|
44
49
|
// Linked list items
|
50
|
+
//
|
51
|
+
// Use anchor elements instead of `li`s or `div`s to create linked list items.
|
52
|
+
// Includes an extra `.active` modifier class for showing selected items.
|
53
|
+
|
45
54
|
a.list-group-item {
|
46
55
|
color: @list-group-link-color;
|
47
56
|
|
@@ -70,13 +79,26 @@ a.list-group-item {
|
|
70
79
|
color: inherit;
|
71
80
|
}
|
72
81
|
.list-group-item-text {
|
73
|
-
color:
|
82
|
+
color: @list-group-active-text-color;
|
74
83
|
}
|
75
84
|
}
|
76
85
|
}
|
77
86
|
|
87
|
+
|
88
|
+
// Contextual variants
|
89
|
+
//
|
90
|
+
// Add modifier classes to change text and background color on individual items.
|
91
|
+
// Organizationally, this must come after the `:hover` states.
|
92
|
+
|
93
|
+
.list-group-item-variant(success; @state-success-bg; @state-success-text);
|
94
|
+
.list-group-item-variant(info; @state-info-bg; @state-info-text);
|
95
|
+
.list-group-item-variant(warning; @state-warning-bg; @state-warning-text);
|
96
|
+
.list-group-item-variant(danger; @state-danger-bg; @state-danger-text);
|
97
|
+
|
98
|
+
|
78
99
|
// Custom content options
|
79
|
-
//
|
100
|
+
//
|
101
|
+
// Extra classes for creating well-formatted content within `.list-group-item`s.
|
80
102
|
|
81
103
|
.list-group-item-heading {
|
82
104
|
margin-top: 0;
|
@@ -19,8 +19,8 @@
|
|
19
19
|
.clearfix() {
|
20
20
|
&:before,
|
21
21
|
&:after {
|
22
|
-
content: " ";
|
23
|
-
display: table;
|
22
|
+
content: " "; // 1
|
23
|
+
display: table; // 2
|
24
24
|
}
|
25
25
|
&:after {
|
26
26
|
clear: both;
|
@@ -30,7 +30,7 @@
|
|
30
30
|
// WebKit-style focus
|
31
31
|
.tab-focus() {
|
32
32
|
// Default
|
33
|
-
outline: thin dotted
|
33
|
+
outline: thin dotted;
|
34
34
|
// WebKit
|
35
35
|
outline: 5px auto -webkit-focus-ring-color;
|
36
36
|
outline-offset: -2px;
|
@@ -55,7 +55,8 @@
|
|
55
55
|
// Placeholder text
|
56
56
|
.placeholder(@color: @input-color-placeholder) {
|
57
57
|
&:-moz-placeholder { color: @color; } // Firefox 4-18
|
58
|
-
&::-moz-placeholder { color: @color;
|
58
|
+
&::-moz-placeholder { color: @color; // Firefox 19+
|
59
|
+
opacity: 1; } // See https://github.com/twbs/bootstrap/pull/11526
|
59
60
|
&:-ms-input-placeholder { color: @color; } // Internet Explorer 10+
|
60
61
|
&::-webkit-input-placeholder { color: @color; } // Safari and Chrome
|
61
62
|
}
|
@@ -87,11 +88,7 @@
|
|
87
88
|
}
|
88
89
|
// New mixin to use as of v3.0.1
|
89
90
|
.text-hide() {
|
90
|
-
|
91
|
-
color: transparent;
|
92
|
-
text-shadow: none;
|
93
|
-
background-color: transparent;
|
94
|
-
border: 0;
|
91
|
+
.hide-text();
|
95
92
|
}
|
96
93
|
|
97
94
|
|
@@ -118,6 +115,10 @@
|
|
118
115
|
}
|
119
116
|
|
120
117
|
// Drop shadows
|
118
|
+
//
|
119
|
+
// Note: Deprecated `.box-shadow()` as of v3.1.0 since all of Bootstrap's
|
120
|
+
// supported browsers that have box shadow capabilities now support the
|
121
|
+
// standard `box-shadow` property.
|
121
122
|
.box-shadow(@shadow) {
|
122
123
|
-webkit-box-shadow: @shadow; // iOS <4.3 & Android <4.1
|
123
124
|
box-shadow: @shadow;
|
@@ -150,17 +151,17 @@
|
|
150
151
|
// Transformations
|
151
152
|
.rotate(@degrees) {
|
152
153
|
-webkit-transform: rotate(@degrees);
|
153
|
-
-ms-transform: rotate(@degrees); // IE9
|
154
|
+
-ms-transform: rotate(@degrees); // IE9 only
|
154
155
|
transform: rotate(@degrees);
|
155
156
|
}
|
156
|
-
.scale(@ratio) {
|
157
|
-
-webkit-transform: scale(@ratio);
|
158
|
-
-ms-transform: scale(@ratio); // IE9
|
159
|
-
transform: scale(@ratio);
|
157
|
+
.scale(@ratio; @ratio-y...) {
|
158
|
+
-webkit-transform: scale(@ratio, @ratio-y);
|
159
|
+
-ms-transform: scale(@ratio, @ratio-y); // IE9 only
|
160
|
+
transform: scale(@ratio, @ratio-y);
|
160
161
|
}
|
161
162
|
.translate(@x; @y) {
|
162
163
|
-webkit-transform: translate(@x, @y);
|
163
|
-
-ms-transform: translate(@x, @y); // IE9
|
164
|
+
-ms-transform: translate(@x, @y); // IE9 only
|
164
165
|
transform: translate(@x, @y);
|
165
166
|
}
|
166
167
|
.skew(@x; @y) {
|
@@ -175,12 +176,12 @@
|
|
175
176
|
|
176
177
|
.rotateX(@degrees) {
|
177
178
|
-webkit-transform: rotateX(@degrees);
|
178
|
-
-ms-transform: rotateX(@degrees); // IE9
|
179
|
+
-ms-transform: rotateX(@degrees); // IE9 only
|
179
180
|
transform: rotateX(@degrees);
|
180
181
|
}
|
181
182
|
.rotateY(@degrees) {
|
182
183
|
-webkit-transform: rotateY(@degrees);
|
183
|
-
-ms-transform: rotateY(@degrees); // IE9
|
184
|
+
-ms-transform: rotateY(@degrees); // IE9 only
|
184
185
|
transform: rotateY(@degrees);
|
185
186
|
}
|
186
187
|
.perspective(@perspective) {
|
@@ -196,6 +197,7 @@
|
|
196
197
|
.transform-origin(@origin) {
|
197
198
|
-webkit-transform-origin: @origin;
|
198
199
|
-moz-transform-origin: @origin;
|
200
|
+
-ms-transform-origin: @origin; // IE9 only
|
199
201
|
transform-origin: @origin;
|
200
202
|
}
|
201
203
|
|
@@ -204,6 +206,30 @@
|
|
204
206
|
-webkit-animation: @animation;
|
205
207
|
animation: @animation;
|
206
208
|
}
|
209
|
+
.animation-name(@name) {
|
210
|
+
-webkit-animation-name: @name;
|
211
|
+
animation-name: @name;
|
212
|
+
}
|
213
|
+
.animation-duration(@duration) {
|
214
|
+
-webkit-animation-duration: @duration;
|
215
|
+
animation-duration: @duration;
|
216
|
+
}
|
217
|
+
.animation-timing-function(@timing-function) {
|
218
|
+
-webkit-animation-timing-function: @timing-function;
|
219
|
+
animation-timing-function: @timing-function;
|
220
|
+
}
|
221
|
+
.animation-delay(@delay) {
|
222
|
+
-webkit-animation-delay: @delay;
|
223
|
+
animation-delay: @delay;
|
224
|
+
}
|
225
|
+
.animation-iteration-count(@iteration-count) {
|
226
|
+
-webkit-animation-iteration-count: @iteration-count;
|
227
|
+
animation-iteration-count: @iteration-count;
|
228
|
+
}
|
229
|
+
.animation-direction(@direction) {
|
230
|
+
-webkit-animation-direction: @direction;
|
231
|
+
animation-direction: @direction;
|
232
|
+
}
|
207
233
|
|
208
234
|
// Backface visibility
|
209
235
|
// Prevent browsers from flickering when using CSS 3D transforms.
|
@@ -277,10 +303,8 @@
|
|
277
303
|
// Creates two color stops, start and end, by specifying a color and position for each color stop.
|
278
304
|
// Color stops are not available in IE9 and below.
|
279
305
|
.horizontal(@start-color: #555; @end-color: #333; @start-percent: 0%; @end-percent: 100%) {
|
280
|
-
background-image: -webkit-gradient(
|
281
|
-
background-image:
|
282
|
-
background-image: -moz-linear-gradient(left, @start-color @start-percent, @end-color @end-percent); // FF 3.6+
|
283
|
-
background-image: linear-gradient(to right, @start-color @start-percent, @end-color @end-percent); // Standard, IE10
|
306
|
+
background-image: -webkit-linear-gradient(left, color-stop(@start-color @start-percent), color-stop(@end-color @end-percent)); // Safari 5.1-6, Chrome 10+
|
307
|
+
background-image: linear-gradient(to right, @start-color @start-percent, @end-color @end-percent); // Standard, IE10, Firefox 16+, Opera 12.10+, Safari 7+, Chrome 26+
|
284
308
|
background-repeat: repeat-x;
|
285
309
|
filter: e(%("progid:DXImageTransform.Microsoft.gradient(startColorstr='%d', endColorstr='%d', GradientType=1)",argb(@start-color),argb(@end-color))); // IE9 and down
|
286
310
|
}
|
@@ -290,47 +314,36 @@
|
|
290
314
|
// Creates two color stops, start and end, by specifying a color and position for each color stop.
|
291
315
|
// Color stops are not available in IE9 and below.
|
292
316
|
.vertical(@start-color: #555; @end-color: #333; @start-percent: 0%; @end-percent: 100%) {
|
293
|
-
background-image: -webkit-gradient(
|
294
|
-
background-image:
|
295
|
-
background-image: -moz-linear-gradient(top, @start-color @start-percent, @end-color @end-percent); // FF 3.6+
|
296
|
-
background-image: linear-gradient(to bottom, @start-color @start-percent, @end-color @end-percent); // Standard, IE10
|
317
|
+
background-image: -webkit-linear-gradient(top, @start-color @start-percent, @end-color @end-percent); // Safari 5.1-6, Chrome 10+
|
318
|
+
background-image: linear-gradient(to bottom, @start-color @start-percent, @end-color @end-percent); // Standard, IE10, Firefox 16+, Opera 12.10+, Safari 7+, Chrome 26+
|
297
319
|
background-repeat: repeat-x;
|
298
320
|
filter: e(%("progid:DXImageTransform.Microsoft.gradient(startColorstr='%d', endColorstr='%d', GradientType=0)",argb(@start-color),argb(@end-color))); // IE9 and down
|
299
321
|
}
|
300
322
|
|
301
323
|
.directional(@start-color: #555; @end-color: #333; @deg: 45deg) {
|
302
324
|
background-repeat: repeat-x;
|
303
|
-
background-image: -webkit-linear-gradient(@deg, @start-color, @end-color); // Safari 5.1
|
304
|
-
background-image:
|
305
|
-
background-image: linear-gradient(@deg, @start-color, @end-color); // Standard, IE10
|
325
|
+
background-image: -webkit-linear-gradient(@deg, @start-color, @end-color); // Safari 5.1-6, Chrome 10+
|
326
|
+
background-image: linear-gradient(@deg, @start-color, @end-color); // Standard, IE10, Firefox 16+, Opera 12.10+, Safari 7+, Chrome 26+
|
306
327
|
}
|
307
328
|
.horizontal-three-colors(@start-color: #00b3ee; @mid-color: #7a43b6; @color-stop: 50%; @end-color: #c3325f) {
|
308
|
-
background-image: -webkit-gradient(left, linear, 0 0, 0 100%, from(@start-color), color-stop(@color-stop, @mid-color), to(@end-color));
|
309
329
|
background-image: -webkit-linear-gradient(left, @start-color, @mid-color @color-stop, @end-color);
|
310
|
-
background-image: -moz-linear-gradient(left, @start-color, @mid-color @color-stop, @end-color);
|
311
330
|
background-image: linear-gradient(to right, @start-color, @mid-color @color-stop, @end-color);
|
312
331
|
background-repeat: no-repeat;
|
313
332
|
filter: e(%("progid:DXImageTransform.Microsoft.gradient(startColorstr='%d', endColorstr='%d', GradientType=1)",argb(@start-color),argb(@end-color))); // IE9 and down, gets no color-stop at all for proper fallback
|
314
333
|
}
|
315
334
|
.vertical-three-colors(@start-color: #00b3ee; @mid-color: #7a43b6; @color-stop: 50%; @end-color: #c3325f) {
|
316
|
-
background-image: -webkit-gradient(linear, 0 0, 0 100%, from(@start-color), color-stop(@color-stop, @mid-color), to(@end-color));
|
317
335
|
background-image: -webkit-linear-gradient(@start-color, @mid-color @color-stop, @end-color);
|
318
|
-
background-image: -moz-linear-gradient(top, @start-color, @mid-color @color-stop, @end-color);
|
319
336
|
background-image: linear-gradient(@start-color, @mid-color @color-stop, @end-color);
|
320
337
|
background-repeat: no-repeat;
|
321
338
|
filter: e(%("progid:DXImageTransform.Microsoft.gradient(startColorstr='%d', endColorstr='%d', GradientType=0)",argb(@start-color),argb(@end-color))); // IE9 and down, gets no color-stop at all for proper fallback
|
322
339
|
}
|
323
340
|
.radial(@inner-color: #555; @outer-color: #333) {
|
324
|
-
background-image: -webkit-gradient(radial, center center, 0, center center, 460, from(@inner-color), to(@outer-color));
|
325
341
|
background-image: -webkit-radial-gradient(circle, @inner-color, @outer-color);
|
326
|
-
background-image: -moz-radial-gradient(circle, @inner-color, @outer-color);
|
327
342
|
background-image: radial-gradient(circle, @inner-color, @outer-color);
|
328
343
|
background-repeat: no-repeat;
|
329
344
|
}
|
330
345
|
.striped(@color: rgba(255,255,255,.15); @angle: 45deg) {
|
331
|
-
background-image: -webkit-gradient(linear, 0 100%, 100% 0, color-stop(.25, @color), color-stop(.25, transparent), color-stop(.5, transparent), color-stop(.5, @color), color-stop(.75, @color), color-stop(.75, transparent), to(transparent));
|
332
346
|
background-image: -webkit-linear-gradient(@angle, @color 25%, transparent 25%, transparent 50%, @color 50%, @color 75%, transparent 75%, transparent);
|
333
|
-
background-image: -moz-linear-gradient(@angle, @color 25%, transparent 25%, transparent 50%, @color 50%, @color 75%, transparent 75%, transparent);
|
334
347
|
background-image: linear-gradient(@angle, @color 25%, transparent 25%, transparent 50%, @color 50%, @color 75%, transparent 75%, transparent);
|
335
348
|
}
|
336
349
|
}
|
@@ -369,7 +382,7 @@
|
|
369
382
|
//
|
370
383
|
// Keep images from scaling beyond the width of their parents.
|
371
384
|
|
372
|
-
.img-responsive(@display: block
|
385
|
+
.img-responsive(@display: block) {
|
373
386
|
display: @display;
|
374
387
|
max-width: 100%; // Part 1: Set a maximum relative to the parent
|
375
388
|
height: auto; // Part 2: Scale the height according to the width, otherwise you get stretching
|
@@ -391,7 +404,7 @@
|
|
391
404
|
|
392
405
|
// Panels
|
393
406
|
// -------------------------
|
394
|
-
.panel-variant(@border; @heading-text-color; @heading-bg-color; @heading-border
|
407
|
+
.panel-variant(@border; @heading-text-color; @heading-bg-color; @heading-border) {
|
395
408
|
border-color: @border;
|
396
409
|
|
397
410
|
& > .panel-heading {
|
@@ -402,9 +415,6 @@
|
|
402
415
|
+ .panel-collapse .panel-body {
|
403
416
|
border-top-color: @border;
|
404
417
|
}
|
405
|
-
& > .dropdown .caret {
|
406
|
-
border-color: @heading-text-color transparent;
|
407
|
-
}
|
408
418
|
}
|
409
419
|
& > .panel-footer {
|
410
420
|
+ .panel-collapse .panel-body {
|
@@ -430,7 +440,7 @@
|
|
430
440
|
|
431
441
|
// Tables
|
432
442
|
// -------------------------
|
433
|
-
.table-row-variant(@state; @background
|
443
|
+
.table-row-variant(@state; @background) {
|
434
444
|
// Exact selectors below required to override `.table-striped` and prevent
|
435
445
|
// inheritance to nested tables.
|
436
446
|
.table > thead > tr,
|
@@ -456,6 +466,34 @@
|
|
456
466
|
}
|
457
467
|
}
|
458
468
|
|
469
|
+
// List Groups
|
470
|
+
// -------------------------
|
471
|
+
.list-group-item-variant(@state; @background; @color) {
|
472
|
+
.list-group-item-@{state} {
|
473
|
+
color: @color;
|
474
|
+
background-color: @background;
|
475
|
+
|
476
|
+
a& {
|
477
|
+
color: @color;
|
478
|
+
|
479
|
+
.list-group-item-heading { color: inherit; }
|
480
|
+
|
481
|
+
&:hover,
|
482
|
+
&:focus {
|
483
|
+
color: @color;
|
484
|
+
background-color: darken(@background, 5%);
|
485
|
+
}
|
486
|
+
&.active,
|
487
|
+
&.active:hover,
|
488
|
+
&.active:focus {
|
489
|
+
color: #fff;
|
490
|
+
background-color: @color;
|
491
|
+
border-color: @color;
|
492
|
+
}
|
493
|
+
}
|
494
|
+
}
|
495
|
+
}
|
496
|
+
|
459
497
|
// Button variants
|
460
498
|
// -------------------------
|
461
499
|
// Easily pump out default styles, as well as :hover, :focus, :active,
|
@@ -491,6 +529,11 @@
|
|
491
529
|
border-color: @border;
|
492
530
|
}
|
493
531
|
}
|
532
|
+
|
533
|
+
.badge {
|
534
|
+
color: @background;
|
535
|
+
background-color: @color;
|
536
|
+
}
|
494
537
|
}
|
495
538
|
|
496
539
|
// Button sizes
|
@@ -538,6 +581,24 @@
|
|
538
581
|
}
|
539
582
|
}
|
540
583
|
|
584
|
+
// Contextual backgrounds
|
585
|
+
// -------------------------
|
586
|
+
.bg-variant(@color) {
|
587
|
+
background-color: @color;
|
588
|
+
a&:hover {
|
589
|
+
background-color: darken(@color, 10%);
|
590
|
+
}
|
591
|
+
}
|
592
|
+
|
593
|
+
// Typography
|
594
|
+
// -------------------------
|
595
|
+
.text-emphasis-variant(@color) {
|
596
|
+
color: @color;
|
597
|
+
a&:hover {
|
598
|
+
color: darken(@color, 10%);
|
599
|
+
}
|
600
|
+
}
|
601
|
+
|
541
602
|
// Navbar vertical align
|
542
603
|
// -------------------------
|
543
604
|
// Vertically center elements in the navbar.
|
@@ -561,9 +622,10 @@
|
|
561
622
|
// More easily include all the states for responsive-utilities.less.
|
562
623
|
.responsive-visibility() {
|
563
624
|
display: block !important;
|
564
|
-
|
625
|
+
table& { display: table; }
|
626
|
+
tr& { display: table-row !important; }
|
565
627
|
th&,
|
566
|
-
td&
|
628
|
+
td& { display: table-cell !important; }
|
567
629
|
}
|
568
630
|
|
569
631
|
.responsive-invisibility() {
|
@@ -583,14 +645,14 @@
|
|
583
645
|
margin-left: auto;
|
584
646
|
padding-left: (@grid-gutter-width / 2);
|
585
647
|
padding-right: (@grid-gutter-width / 2);
|
586
|
-
.clearfix
|
648
|
+
&:extend(.clearfix all);
|
587
649
|
}
|
588
650
|
|
589
651
|
// Creates a wrapper for a series of columns
|
590
652
|
.make-row(@gutter: @grid-gutter-width) {
|
591
653
|
margin-left: (@gutter / -2);
|
592
654
|
margin-right: (@gutter / -2);
|
593
|
-
.clearfix
|
655
|
+
&:extend(.clearfix all);
|
594
656
|
}
|
595
657
|
|
596
658
|
// Generate the extra small columns
|
@@ -598,30 +660,39 @@
|
|
598
660
|
position: relative;
|
599
661
|
float: left;
|
600
662
|
width: percentage((@columns / @grid-columns));
|
601
|
-
// Prevent columns from collapsing when empty
|
602
663
|
min-height: 1px;
|
603
|
-
// Inner gutter via padding
|
604
664
|
padding-left: (@gutter / 2);
|
605
665
|
padding-right: (@gutter / 2);
|
606
666
|
}
|
667
|
+
.make-xs-column-offset(@columns) {
|
668
|
+
@media (min-width: @screen-xs-min) {
|
669
|
+
margin-left: percentage((@columns / @grid-columns));
|
670
|
+
}
|
671
|
+
}
|
672
|
+
.make-xs-column-push(@columns) {
|
673
|
+
@media (min-width: @screen-xs-min) {
|
674
|
+
left: percentage((@columns / @grid-columns));
|
675
|
+
}
|
676
|
+
}
|
677
|
+
.make-xs-column-pull(@columns) {
|
678
|
+
@media (min-width: @screen-xs-min) {
|
679
|
+
right: percentage((@columns / @grid-columns));
|
680
|
+
}
|
681
|
+
}
|
682
|
+
|
607
683
|
|
608
684
|
// Generate the small columns
|
609
685
|
.make-sm-column(@columns; @gutter: @grid-gutter-width) {
|
610
686
|
position: relative;
|
611
|
-
// Prevent columns from collapsing when empty
|
612
687
|
min-height: 1px;
|
613
|
-
// Inner gutter via padding
|
614
688
|
padding-left: (@gutter / 2);
|
615
689
|
padding-right: (@gutter / 2);
|
616
690
|
|
617
|
-
// Calculate width based on number of columns available
|
618
691
|
@media (min-width: @screen-sm-min) {
|
619
692
|
float: left;
|
620
693
|
width: percentage((@columns / @grid-columns));
|
621
694
|
}
|
622
695
|
}
|
623
|
-
|
624
|
-
// Generate the small column offsets
|
625
696
|
.make-sm-column-offset(@columns) {
|
626
697
|
@media (min-width: @screen-sm-min) {
|
627
698
|
margin-left: percentage((@columns / @grid-columns));
|
@@ -638,30 +709,26 @@
|
|
638
709
|
}
|
639
710
|
}
|
640
711
|
|
712
|
+
|
641
713
|
// Generate the medium columns
|
642
714
|
.make-md-column(@columns; @gutter: @grid-gutter-width) {
|
643
715
|
position: relative;
|
644
|
-
// Prevent columns from collapsing when empty
|
645
716
|
min-height: 1px;
|
646
|
-
// Inner gutter via padding
|
647
717
|
padding-left: (@gutter / 2);
|
648
718
|
padding-right: (@gutter / 2);
|
649
719
|
|
650
|
-
// Calculate width based on number of columns available
|
651
720
|
@media (min-width: @screen-md-min) {
|
652
721
|
float: left;
|
653
722
|
width: percentage((@columns / @grid-columns));
|
654
723
|
}
|
655
724
|
}
|
656
|
-
|
657
|
-
// Generate the medium column offsets
|
658
725
|
.make-md-column-offset(@columns) {
|
659
726
|
@media (min-width: @screen-md-min) {
|
660
727
|
margin-left: percentage((@columns / @grid-columns));
|
661
728
|
}
|
662
729
|
}
|
663
730
|
.make-md-column-push(@columns) {
|
664
|
-
@media (min-width: @screen-md) {
|
731
|
+
@media (min-width: @screen-md-min) {
|
665
732
|
left: percentage((@columns / @grid-columns));
|
666
733
|
}
|
667
734
|
}
|
@@ -671,23 +738,19 @@
|
|
671
738
|
}
|
672
739
|
}
|
673
740
|
|
741
|
+
|
674
742
|
// Generate the large columns
|
675
743
|
.make-lg-column(@columns; @gutter: @grid-gutter-width) {
|
676
744
|
position: relative;
|
677
|
-
// Prevent columns from collapsing when empty
|
678
745
|
min-height: 1px;
|
679
|
-
// Inner gutter via padding
|
680
746
|
padding-left: (@gutter / 2);
|
681
747
|
padding-right: (@gutter / 2);
|
682
748
|
|
683
|
-
// Calculate width based on number of columns available
|
684
749
|
@media (min-width: @screen-lg-min) {
|
685
750
|
float: left;
|
686
751
|
width: percentage((@columns / @grid-columns));
|
687
752
|
}
|
688
753
|
}
|
689
|
-
|
690
|
-
// Generate the large column offsets
|
691
754
|
.make-lg-column-offset(@columns) {
|
692
755
|
@media (min-width: @screen-lg-min) {
|
693
756
|
margin-left: percentage((@columns / @grid-columns));
|
@@ -714,11 +777,11 @@
|
|
714
777
|
// Common styles for all sizes of grid columns, widths 1-12
|
715
778
|
.col(@index) when (@index = 1) { // initial
|
716
779
|
@item: ~".col-xs-@{index}, .col-sm-@{index}, .col-md-@{index}, .col-lg-@{index}";
|
717
|
-
.col(@index + 1, @item);
|
780
|
+
.col((@index + 1), @item);
|
718
781
|
}
|
719
782
|
.col(@index, @list) when (@index =< @grid-columns) { // general; "=<" isn't a typo
|
720
783
|
@item: ~".col-xs-@{index}, .col-sm-@{index}, .col-md-@{index}, .col-lg-@{index}";
|
721
|
-
.col(@index + 1, ~"@{list}, @{item}");
|
784
|
+
.col((@index + 1), ~"@{list}, @{item}");
|
722
785
|
}
|
723
786
|
.col(@index, @list) when (@index > @grid-columns) { // terminal
|
724
787
|
@{list} {
|
@@ -736,13 +799,13 @@
|
|
736
799
|
.make-grid-columns-float(@class) {
|
737
800
|
.col(@index) when (@index = 1) { // initial
|
738
801
|
@item: ~".col-@{class}-@{index}";
|
739
|
-
.col(@index + 1, @item);
|
802
|
+
.col((@index + 1), @item);
|
740
803
|
}
|
741
|
-
.col(@index, @list) when (@index
|
804
|
+
.col(@index, @list) when (@index =< @grid-columns) { // general
|
742
805
|
@item: ~".col-@{class}-@{index}";
|
743
|
-
.col(@index + 1, ~"@{list}, @{item}");
|
806
|
+
.col((@index + 1), ~"@{list}, @{item}");
|
744
807
|
}
|
745
|
-
.col(@index, @list) when (@index
|
808
|
+
.col(@index, @list) when (@index > @grid-columns) { // terminal
|
746
809
|
@{list} {
|
747
810
|
float: left;
|
748
811
|
}
|
@@ -775,7 +838,7 @@
|
|
775
838
|
.make-grid(@index, @class, @type) when (@index >= 0) {
|
776
839
|
.calc-grid(@index, @class, @type);
|
777
840
|
// next iteration
|
778
|
-
.make-grid(@index - 1, @class, @type);
|
841
|
+
.make-grid((@index - 1), @class, @type);
|
779
842
|
}
|
780
843
|
|
781
844
|
|
@@ -810,6 +873,10 @@
|
|
810
873
|
border-color: @border-color;
|
811
874
|
background-color: @background-color;
|
812
875
|
}
|
876
|
+
// Optional feedback icon
|
877
|
+
.form-control-feedback {
|
878
|
+
color: @text-color;
|
879
|
+
}
|
813
880
|
}
|
814
881
|
|
815
882
|
// Form control focus state
|
@@ -852,7 +919,8 @@
|
|
852
919
|
line-height: @input-height;
|
853
920
|
}
|
854
921
|
|
855
|
-
textarea
|
922
|
+
textarea&,
|
923
|
+
select[multiple]& {
|
856
924
|
height: auto;
|
857
925
|
}
|
858
926
|
}
|