bootplus-rails 0.0.1 → 0.0.1.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- data/lib/bootplus/rails/version.rb +1 -1
- data/vendor/assets/javascripts/bootstrap-affix.js +117 -0
- data/vendor/assets/javascripts/bootstrap-alert.js +99 -0
- data/vendor/assets/javascripts/bootstrap-button.js +105 -0
- data/vendor/assets/javascripts/bootstrap-carousel.js +207 -0
- data/vendor/assets/javascripts/bootstrap-collapse.js +167 -0
- data/vendor/assets/javascripts/bootstrap-dropdown.js +169 -0
- data/vendor/assets/javascripts/bootstrap-modal.js +247 -0
- data/vendor/assets/javascripts/bootstrap-popover.js +114 -0
- data/vendor/assets/javascripts/bootstrap-scrollspy.js +162 -0
- data/vendor/assets/javascripts/bootstrap-tab.js +144 -0
- data/vendor/assets/javascripts/bootstrap-tooltip.js +361 -0
- data/vendor/assets/javascripts/bootstrap-transition.js +60 -0
- data/vendor/assets/javascripts/bootstrap-typeahead.js +335 -0
- data/vendor/assets/stylesheets/accordion.less +34 -0
- data/vendor/assets/stylesheets/alerts.less +79 -0
- data/vendor/assets/stylesheets/bootplus/accordion.less +24 -0
- data/vendor/assets/stylesheets/bootplus/alerts.less +13 -0
- data/vendor/assets/stylesheets/bootplus/bootplus.less +92 -0
- data/vendor/assets/stylesheets/bootplus/button-groups.less +23 -0
- data/vendor/assets/stylesheets/bootplus/buttons.less +272 -0
- data/vendor/assets/stylesheets/bootplus/cards.less +243 -0
- data/vendor/assets/stylesheets/bootplus/dropdowns.less +124 -0
- data/vendor/assets/stylesheets/bootplus/forms.less +119 -0
- data/vendor/assets/stylesheets/bootplus/hero-unit.less +9 -0
- data/vendor/assets/stylesheets/bootplus/icons.less +22 -0
- data/vendor/assets/stylesheets/bootplus/labels-badges.less +22 -0
- data/vendor/assets/stylesheets/bootplus/media.less +19 -0
- data/vendor/assets/stylesheets/bootplus/mixins.less +12 -0
- data/vendor/assets/stylesheets/bootplus/modals.less +59 -0
- data/vendor/assets/stylesheets/bootplus/navbar.less +131 -0
- data/vendor/assets/stylesheets/bootplus/navs.less +180 -0
- data/vendor/assets/stylesheets/bootplus/popovers.less +18 -0
- data/vendor/assets/stylesheets/bootplus/progress-bars.less +64 -0
- data/vendor/assets/stylesheets/bootplus/responsive-navbar.less +23 -0
- data/vendor/assets/stylesheets/bootplus/responsive.less +49 -0
- data/vendor/assets/stylesheets/bootplus/tooltip.less +14 -0
- data/vendor/assets/stylesheets/bootplus/variables.less +316 -0
- data/vendor/assets/stylesheets/bootplus/wells.less +25 -0
- data/vendor/assets/stylesheets/bootstrap.less +63 -0
- data/vendor/assets/stylesheets/breadcrumbs.less +24 -0
- data/vendor/assets/stylesheets/button-groups.less +229 -0
- data/vendor/assets/stylesheets/buttons.less +241 -0
- data/vendor/assets/stylesheets/carousel.less +158 -0
- data/vendor/assets/stylesheets/close.less +32 -0
- data/vendor/assets/stylesheets/code.less +61 -0
- data/vendor/assets/stylesheets/component-animations.less +22 -0
- data/vendor/assets/stylesheets/dropdowns.less +248 -0
- data/vendor/assets/stylesheets/forms.less +690 -0
- data/vendor/assets/stylesheets/grid.less +21 -0
- data/vendor/assets/stylesheets/hero-unit.less +25 -0
- data/vendor/assets/stylesheets/labels-badges.less +84 -0
- data/vendor/assets/stylesheets/layouts.less +16 -0
- data/vendor/assets/stylesheets/media.less +55 -0
- data/vendor/assets/stylesheets/mixins.less +702 -0
- data/vendor/assets/stylesheets/modals.less +95 -0
- data/vendor/assets/stylesheets/navbar.less +497 -0
- data/vendor/assets/stylesheets/navs.less +409 -0
- data/vendor/assets/stylesheets/pager.less +43 -0
- data/vendor/assets/stylesheets/pagination.less +123 -0
- data/vendor/assets/stylesheets/popovers.less +133 -0
- data/vendor/assets/stylesheets/progress-bars.less +122 -0
- data/vendor/assets/stylesheets/reset.less +216 -0
- data/vendor/assets/stylesheets/responsive-1200px-min.less +28 -0
- data/vendor/assets/stylesheets/responsive-767px-max.less +193 -0
- data/vendor/assets/stylesheets/responsive-768px-979px.less +19 -0
- data/vendor/assets/stylesheets/responsive-navbar.less +189 -0
- data/vendor/assets/stylesheets/responsive-utilities.less +59 -0
- data/vendor/assets/stylesheets/responsive.less +48 -0
- data/vendor/assets/stylesheets/scaffolding.less +53 -0
- data/vendor/assets/stylesheets/sprites.less +197 -0
- data/vendor/assets/stylesheets/tables.less +244 -0
- data/vendor/assets/stylesheets/thumbnails.less +53 -0
- data/vendor/assets/stylesheets/tooltip.less +70 -0
- data/vendor/assets/stylesheets/type.less +247 -0
- data/vendor/assets/stylesheets/utilities.less +30 -0
- data/vendor/assets/stylesheets/variables.less +301 -0
- data/vendor/assets/stylesheets/wells.less +29 -0
- metadata +78 -1
@@ -0,0 +1,21 @@
|
|
1
|
+
//
|
2
|
+
// Grid system
|
3
|
+
// --------------------------------------------------
|
4
|
+
|
5
|
+
|
6
|
+
// Fixed (940px)
|
7
|
+
#grid > .core(@gridColumnWidth, @gridGutterWidth);
|
8
|
+
|
9
|
+
// Fluid (940px)
|
10
|
+
#grid > .fluid(@fluidGridColumnWidth, @fluidGridGutterWidth);
|
11
|
+
|
12
|
+
// Reset utility classes due to specificity
|
13
|
+
[class*="span"].hide,
|
14
|
+
.row-fluid [class*="span"].hide {
|
15
|
+
display: none;
|
16
|
+
}
|
17
|
+
|
18
|
+
[class*="span"].pull-right,
|
19
|
+
.row-fluid [class*="span"].pull-right {
|
20
|
+
float: right;
|
21
|
+
}
|
@@ -0,0 +1,25 @@
|
|
1
|
+
//
|
2
|
+
// Hero unit
|
3
|
+
// --------------------------------------------------
|
4
|
+
|
5
|
+
|
6
|
+
.hero-unit {
|
7
|
+
padding: 60px;
|
8
|
+
margin-bottom: 30px;
|
9
|
+
font-size: 18px;
|
10
|
+
font-weight: 200;
|
11
|
+
line-height: @baseLineHeight * 1.5;
|
12
|
+
color: @heroUnitLeadColor;
|
13
|
+
background-color: @heroUnitBackground;
|
14
|
+
.border-radius(6px);
|
15
|
+
h1 {
|
16
|
+
margin-bottom: 0;
|
17
|
+
font-size: 60px;
|
18
|
+
line-height: 1;
|
19
|
+
color: @heroUnitHeadingColor;
|
20
|
+
letter-spacing: -1px;
|
21
|
+
}
|
22
|
+
li {
|
23
|
+
line-height: @baseLineHeight * 1.5; // Reset since we specify in type.less
|
24
|
+
}
|
25
|
+
}
|
@@ -0,0 +1,84 @@
|
|
1
|
+
//
|
2
|
+
// Labels and badges
|
3
|
+
// --------------------------------------------------
|
4
|
+
|
5
|
+
|
6
|
+
// Base classes
|
7
|
+
.label,
|
8
|
+
.badge {
|
9
|
+
display: inline-block;
|
10
|
+
padding: 2px 4px;
|
11
|
+
font-size: @baseFontSize * .846;
|
12
|
+
font-weight: bold;
|
13
|
+
line-height: 14px; // ensure proper line-height if floated
|
14
|
+
color: @white;
|
15
|
+
vertical-align: baseline;
|
16
|
+
white-space: nowrap;
|
17
|
+
text-shadow: 0 -1px 0 rgba(0,0,0,.25);
|
18
|
+
background-color: @grayLight;
|
19
|
+
}
|
20
|
+
// Set unique padding and border-radii
|
21
|
+
.label {
|
22
|
+
.border-radius(3px);
|
23
|
+
}
|
24
|
+
.badge {
|
25
|
+
padding-left: 9px;
|
26
|
+
padding-right: 9px;
|
27
|
+
.border-radius(9px);
|
28
|
+
}
|
29
|
+
|
30
|
+
// Empty labels/badges collapse
|
31
|
+
.label,
|
32
|
+
.badge {
|
33
|
+
&:empty {
|
34
|
+
display: none;
|
35
|
+
}
|
36
|
+
}
|
37
|
+
|
38
|
+
// Hover/focus state, but only for links
|
39
|
+
a {
|
40
|
+
&.label:hover,
|
41
|
+
&.label:focus,
|
42
|
+
&.badge:hover,
|
43
|
+
&.badge:focus {
|
44
|
+
color: @white;
|
45
|
+
text-decoration: none;
|
46
|
+
cursor: pointer;
|
47
|
+
}
|
48
|
+
}
|
49
|
+
|
50
|
+
// Colors
|
51
|
+
// Only give background-color difference to links (and to simplify, we don't qualifty with `a` but [href] attribute)
|
52
|
+
.label,
|
53
|
+
.badge {
|
54
|
+
// Important (red)
|
55
|
+
&-important { background-color: @errorText; }
|
56
|
+
&-important[href] { background-color: darken(@errorText, 10%); }
|
57
|
+
// Warnings (orange)
|
58
|
+
&-warning { background-color: @orange; }
|
59
|
+
&-warning[href] { background-color: darken(@orange, 10%); }
|
60
|
+
// Success (green)
|
61
|
+
&-success { background-color: @successText; }
|
62
|
+
&-success[href] { background-color: darken(@successText, 10%); }
|
63
|
+
// Info (turquoise)
|
64
|
+
&-info { background-color: @infoText; }
|
65
|
+
&-info[href] { background-color: darken(@infoText, 10%); }
|
66
|
+
// Inverse (black)
|
67
|
+
&-inverse { background-color: @grayDark; }
|
68
|
+
&-inverse[href] { background-color: darken(@grayDark, 10%); }
|
69
|
+
}
|
70
|
+
|
71
|
+
// Quick fix for labels/badges in buttons
|
72
|
+
.btn {
|
73
|
+
.label,
|
74
|
+
.badge {
|
75
|
+
position: relative;
|
76
|
+
top: -1px;
|
77
|
+
}
|
78
|
+
}
|
79
|
+
.btn-mini {
|
80
|
+
.label,
|
81
|
+
.badge {
|
82
|
+
top: 0;
|
83
|
+
}
|
84
|
+
}
|
@@ -0,0 +1,16 @@
|
|
1
|
+
//
|
2
|
+
// Layouts
|
3
|
+
// --------------------------------------------------
|
4
|
+
|
5
|
+
|
6
|
+
// Container (centered, fixed-width layouts)
|
7
|
+
.container {
|
8
|
+
.container-fixed();
|
9
|
+
}
|
10
|
+
|
11
|
+
// Fluid layouts (left aligned, with sidebar, min- & max-width content)
|
12
|
+
.container-fluid {
|
13
|
+
padding-right: @gridGutterWidth;
|
14
|
+
padding-left: @gridGutterWidth;
|
15
|
+
.clearfix();
|
16
|
+
}
|
@@ -0,0 +1,55 @@
|
|
1
|
+
// Media objects
|
2
|
+
// Source: http://stubbornella.org/content/?p=497
|
3
|
+
// --------------------------------------------------
|
4
|
+
|
5
|
+
|
6
|
+
// Common styles
|
7
|
+
// -------------------------
|
8
|
+
|
9
|
+
// Clear the floats
|
10
|
+
.media,
|
11
|
+
.media-body {
|
12
|
+
overflow: hidden;
|
13
|
+
*overflow: visible;
|
14
|
+
zoom: 1;
|
15
|
+
}
|
16
|
+
|
17
|
+
// Proper spacing between instances of .media
|
18
|
+
.media,
|
19
|
+
.media .media {
|
20
|
+
margin-top: 15px;
|
21
|
+
}
|
22
|
+
.media:first-child {
|
23
|
+
margin-top: 0;
|
24
|
+
}
|
25
|
+
|
26
|
+
// For images and videos, set to block
|
27
|
+
.media-object {
|
28
|
+
display: block;
|
29
|
+
}
|
30
|
+
|
31
|
+
// Reset margins on headings for tighter default spacing
|
32
|
+
.media-heading {
|
33
|
+
margin: 0 0 5px;
|
34
|
+
}
|
35
|
+
|
36
|
+
|
37
|
+
// Media image alignment
|
38
|
+
// -------------------------
|
39
|
+
|
40
|
+
.media > .pull-left {
|
41
|
+
margin-right: 10px;
|
42
|
+
}
|
43
|
+
.media > .pull-right {
|
44
|
+
margin-left: 10px;
|
45
|
+
}
|
46
|
+
|
47
|
+
|
48
|
+
// Media list variation
|
49
|
+
// -------------------------
|
50
|
+
|
51
|
+
// Undo default ul/ol styles
|
52
|
+
.media-list {
|
53
|
+
margin-left: 0;
|
54
|
+
list-style: none;
|
55
|
+
}
|
@@ -0,0 +1,702 @@
|
|
1
|
+
//
|
2
|
+
// Mixins
|
3
|
+
// --------------------------------------------------
|
4
|
+
|
5
|
+
|
6
|
+
// UTILITY MIXINS
|
7
|
+
// --------------------------------------------------
|
8
|
+
|
9
|
+
// Clearfix
|
10
|
+
// --------
|
11
|
+
// For clearing floats like a boss h5bp.com/q
|
12
|
+
.clearfix {
|
13
|
+
*zoom: 1;
|
14
|
+
&:before,
|
15
|
+
&:after {
|
16
|
+
display: table;
|
17
|
+
content: "";
|
18
|
+
// Fixes Opera/contenteditable bug:
|
19
|
+
// http://nicolasgallagher.com/micro-clearfix-hack/#comment-36952
|
20
|
+
line-height: 0;
|
21
|
+
}
|
22
|
+
&:after {
|
23
|
+
clear: both;
|
24
|
+
}
|
25
|
+
}
|
26
|
+
|
27
|
+
// Webkit-style focus
|
28
|
+
// ------------------
|
29
|
+
.tab-focus() {
|
30
|
+
// Default
|
31
|
+
outline: thin dotted #333;
|
32
|
+
// Webkit
|
33
|
+
outline: 5px auto -webkit-focus-ring-color;
|
34
|
+
outline-offset: -2px;
|
35
|
+
}
|
36
|
+
|
37
|
+
// Center-align a block level element
|
38
|
+
// ----------------------------------
|
39
|
+
.center-block() {
|
40
|
+
display: block;
|
41
|
+
margin-left: auto;
|
42
|
+
margin-right: auto;
|
43
|
+
}
|
44
|
+
|
45
|
+
// IE7 inline-block
|
46
|
+
// ----------------
|
47
|
+
.ie7-inline-block() {
|
48
|
+
*display: inline; /* IE7 inline-block hack */
|
49
|
+
*zoom: 1;
|
50
|
+
}
|
51
|
+
|
52
|
+
// IE7 likes to collapse whitespace on either side of the inline-block elements.
|
53
|
+
// Ems because we're attempting to match the width of a space character. Left
|
54
|
+
// version is for form buttons, which typically come after other elements, and
|
55
|
+
// right version is for icons, which come before. Applying both is ok, but it will
|
56
|
+
// mean that space between those elements will be .6em (~2 space characters) in IE7,
|
57
|
+
// instead of the 1 space in other browsers.
|
58
|
+
.ie7-restore-left-whitespace() {
|
59
|
+
*margin-left: .3em;
|
60
|
+
|
61
|
+
&:first-child {
|
62
|
+
*margin-left: 0;
|
63
|
+
}
|
64
|
+
}
|
65
|
+
|
66
|
+
.ie7-restore-right-whitespace() {
|
67
|
+
*margin-right: .3em;
|
68
|
+
}
|
69
|
+
|
70
|
+
// Sizing shortcuts
|
71
|
+
// -------------------------
|
72
|
+
.size(@height, @width) {
|
73
|
+
width: @width;
|
74
|
+
height: @height;
|
75
|
+
}
|
76
|
+
.square(@size) {
|
77
|
+
.size(@size, @size);
|
78
|
+
}
|
79
|
+
|
80
|
+
// Placeholder text
|
81
|
+
// -------------------------
|
82
|
+
.placeholder(@color: @placeholderText) {
|
83
|
+
&:-moz-placeholder {
|
84
|
+
color: @color;
|
85
|
+
}
|
86
|
+
&:-ms-input-placeholder {
|
87
|
+
color: @color;
|
88
|
+
}
|
89
|
+
&::-webkit-input-placeholder {
|
90
|
+
color: @color;
|
91
|
+
}
|
92
|
+
}
|
93
|
+
|
94
|
+
// Text overflow
|
95
|
+
// -------------------------
|
96
|
+
// Requires inline-block or block for proper styling
|
97
|
+
.text-overflow() {
|
98
|
+
overflow: hidden;
|
99
|
+
text-overflow: ellipsis;
|
100
|
+
white-space: nowrap;
|
101
|
+
}
|
102
|
+
|
103
|
+
// CSS image replacement
|
104
|
+
// -------------------------
|
105
|
+
// Source: https://github.com/h5bp/html5-boilerplate/commit/aa0396eae757
|
106
|
+
.hide-text {
|
107
|
+
font: 0/0 a;
|
108
|
+
color: transparent;
|
109
|
+
text-shadow: none;
|
110
|
+
background-color: transparent;
|
111
|
+
border: 0;
|
112
|
+
}
|
113
|
+
|
114
|
+
|
115
|
+
// FONTS
|
116
|
+
// --------------------------------------------------
|
117
|
+
|
118
|
+
#font {
|
119
|
+
#family {
|
120
|
+
.serif() {
|
121
|
+
font-family: @serifFontFamily;
|
122
|
+
}
|
123
|
+
.sans-serif() {
|
124
|
+
font-family: @sansFontFamily;
|
125
|
+
}
|
126
|
+
.monospace() {
|
127
|
+
font-family: @monoFontFamily;
|
128
|
+
}
|
129
|
+
}
|
130
|
+
.shorthand(@size: @baseFontSize, @weight: normal, @lineHeight: @baseLineHeight) {
|
131
|
+
font-size: @size;
|
132
|
+
font-weight: @weight;
|
133
|
+
line-height: @lineHeight;
|
134
|
+
}
|
135
|
+
.serif(@size: @baseFontSize, @weight: normal, @lineHeight: @baseLineHeight) {
|
136
|
+
#font > #family > .serif;
|
137
|
+
#font > .shorthand(@size, @weight, @lineHeight);
|
138
|
+
}
|
139
|
+
.sans-serif(@size: @baseFontSize, @weight: normal, @lineHeight: @baseLineHeight) {
|
140
|
+
#font > #family > .sans-serif;
|
141
|
+
#font > .shorthand(@size, @weight, @lineHeight);
|
142
|
+
}
|
143
|
+
.monospace(@size: @baseFontSize, @weight: normal, @lineHeight: @baseLineHeight) {
|
144
|
+
#font > #family > .monospace;
|
145
|
+
#font > .shorthand(@size, @weight, @lineHeight);
|
146
|
+
}
|
147
|
+
}
|
148
|
+
|
149
|
+
|
150
|
+
// FORMS
|
151
|
+
// --------------------------------------------------
|
152
|
+
|
153
|
+
// Block level inputs
|
154
|
+
.input-block-level {
|
155
|
+
display: block;
|
156
|
+
width: 100%;
|
157
|
+
min-height: @inputHeight; // Make inputs at least the height of their button counterpart (base line-height + padding + border)
|
158
|
+
.box-sizing(border-box); // Makes inputs behave like true block-level elements
|
159
|
+
}
|
160
|
+
|
161
|
+
|
162
|
+
|
163
|
+
// Mixin for form field states
|
164
|
+
.formFieldState(@textColor: #555, @borderColor: #ccc, @backgroundColor: #f5f5f5) {
|
165
|
+
// Set the text color
|
166
|
+
.control-label,
|
167
|
+
.help-block,
|
168
|
+
.help-inline {
|
169
|
+
color: @textColor;
|
170
|
+
}
|
171
|
+
// Style inputs accordingly
|
172
|
+
.checkbox,
|
173
|
+
.radio,
|
174
|
+
input,
|
175
|
+
select,
|
176
|
+
textarea {
|
177
|
+
color: @textColor;
|
178
|
+
}
|
179
|
+
input,
|
180
|
+
select,
|
181
|
+
textarea {
|
182
|
+
border-color: @borderColor;
|
183
|
+
.box-shadow(inset 0 1px 1px rgba(0,0,0,.075)); // Redeclare so transitions work
|
184
|
+
&:focus {
|
185
|
+
border-color: darken(@borderColor, 10%);
|
186
|
+
@shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 6px lighten(@borderColor, 20%);
|
187
|
+
.box-shadow(@shadow);
|
188
|
+
}
|
189
|
+
}
|
190
|
+
// Give a small background color for input-prepend/-append
|
191
|
+
.input-prepend .add-on,
|
192
|
+
.input-append .add-on {
|
193
|
+
color: @textColor;
|
194
|
+
background-color: @backgroundColor;
|
195
|
+
border-color: @textColor;
|
196
|
+
}
|
197
|
+
}
|
198
|
+
|
199
|
+
|
200
|
+
|
201
|
+
// CSS3 PROPERTIES
|
202
|
+
// --------------------------------------------------
|
203
|
+
|
204
|
+
// Border Radius
|
205
|
+
.border-radius(@radius) {
|
206
|
+
-webkit-border-radius: @radius;
|
207
|
+
-moz-border-radius: @radius;
|
208
|
+
border-radius: @radius;
|
209
|
+
}
|
210
|
+
|
211
|
+
// Single Corner Border Radius
|
212
|
+
.border-top-left-radius(@radius) {
|
213
|
+
-webkit-border-top-left-radius: @radius;
|
214
|
+
-moz-border-radius-topleft: @radius;
|
215
|
+
border-top-left-radius: @radius;
|
216
|
+
}
|
217
|
+
.border-top-right-radius(@radius) {
|
218
|
+
-webkit-border-top-right-radius: @radius;
|
219
|
+
-moz-border-radius-topright: @radius;
|
220
|
+
border-top-right-radius: @radius;
|
221
|
+
}
|
222
|
+
.border-bottom-right-radius(@radius) {
|
223
|
+
-webkit-border-bottom-right-radius: @radius;
|
224
|
+
-moz-border-radius-bottomright: @radius;
|
225
|
+
border-bottom-right-radius: @radius;
|
226
|
+
}
|
227
|
+
.border-bottom-left-radius(@radius) {
|
228
|
+
-webkit-border-bottom-left-radius: @radius;
|
229
|
+
-moz-border-radius-bottomleft: @radius;
|
230
|
+
border-bottom-left-radius: @radius;
|
231
|
+
}
|
232
|
+
|
233
|
+
// Single Side Border Radius
|
234
|
+
.border-top-radius(@radius) {
|
235
|
+
.border-top-right-radius(@radius);
|
236
|
+
.border-top-left-radius(@radius);
|
237
|
+
}
|
238
|
+
.border-right-radius(@radius) {
|
239
|
+
.border-top-right-radius(@radius);
|
240
|
+
.border-bottom-right-radius(@radius);
|
241
|
+
}
|
242
|
+
.border-bottom-radius(@radius) {
|
243
|
+
.border-bottom-right-radius(@radius);
|
244
|
+
.border-bottom-left-radius(@radius);
|
245
|
+
}
|
246
|
+
.border-left-radius(@radius) {
|
247
|
+
.border-top-left-radius(@radius);
|
248
|
+
.border-bottom-left-radius(@radius);
|
249
|
+
}
|
250
|
+
|
251
|
+
// Drop shadows
|
252
|
+
.box-shadow(@shadow) {
|
253
|
+
-webkit-box-shadow: @shadow;
|
254
|
+
-moz-box-shadow: @shadow;
|
255
|
+
box-shadow: @shadow;
|
256
|
+
}
|
257
|
+
|
258
|
+
// Transitions
|
259
|
+
.transition(@transition) {
|
260
|
+
-webkit-transition: @transition;
|
261
|
+
-moz-transition: @transition;
|
262
|
+
-o-transition: @transition;
|
263
|
+
transition: @transition;
|
264
|
+
}
|
265
|
+
.transition-delay(@transition-delay) {
|
266
|
+
-webkit-transition-delay: @transition-delay;
|
267
|
+
-moz-transition-delay: @transition-delay;
|
268
|
+
-o-transition-delay: @transition-delay;
|
269
|
+
transition-delay: @transition-delay;
|
270
|
+
}
|
271
|
+
.transition-duration(@transition-duration) {
|
272
|
+
-webkit-transition-duration: @transition-duration;
|
273
|
+
-moz-transition-duration: @transition-duration;
|
274
|
+
-o-transition-duration: @transition-duration;
|
275
|
+
transition-duration: @transition-duration;
|
276
|
+
}
|
277
|
+
|
278
|
+
// Transformations
|
279
|
+
.rotate(@degrees) {
|
280
|
+
-webkit-transform: rotate(@degrees);
|
281
|
+
-moz-transform: rotate(@degrees);
|
282
|
+
-ms-transform: rotate(@degrees);
|
283
|
+
-o-transform: rotate(@degrees);
|
284
|
+
transform: rotate(@degrees);
|
285
|
+
}
|
286
|
+
.scale(@ratio) {
|
287
|
+
-webkit-transform: scale(@ratio);
|
288
|
+
-moz-transform: scale(@ratio);
|
289
|
+
-ms-transform: scale(@ratio);
|
290
|
+
-o-transform: scale(@ratio);
|
291
|
+
transform: scale(@ratio);
|
292
|
+
}
|
293
|
+
.translate(@x, @y) {
|
294
|
+
-webkit-transform: translate(@x, @y);
|
295
|
+
-moz-transform: translate(@x, @y);
|
296
|
+
-ms-transform: translate(@x, @y);
|
297
|
+
-o-transform: translate(@x, @y);
|
298
|
+
transform: translate(@x, @y);
|
299
|
+
}
|
300
|
+
.skew(@x, @y) {
|
301
|
+
-webkit-transform: skew(@x, @y);
|
302
|
+
-moz-transform: skew(@x, @y);
|
303
|
+
-ms-transform: skewX(@x) skewY(@y); // See https://github.com/twitter/bootstrap/issues/4885
|
304
|
+
-o-transform: skew(@x, @y);
|
305
|
+
transform: skew(@x, @y);
|
306
|
+
-webkit-backface-visibility: hidden; // See https://github.com/twitter/bootstrap/issues/5319
|
307
|
+
}
|
308
|
+
.translate3d(@x, @y, @z) {
|
309
|
+
-webkit-transform: translate3d(@x, @y, @z);
|
310
|
+
-moz-transform: translate3d(@x, @y, @z);
|
311
|
+
-o-transform: translate3d(@x, @y, @z);
|
312
|
+
transform: translate3d(@x, @y, @z);
|
313
|
+
}
|
314
|
+
|
315
|
+
// Backface visibility
|
316
|
+
// Prevent browsers from flickering when using CSS 3D transforms.
|
317
|
+
// Default value is `visible`, but can be changed to `hidden
|
318
|
+
// See git pull https://github.com/dannykeane/bootstrap.git backface-visibility for examples
|
319
|
+
.backface-visibility(@visibility){
|
320
|
+
-webkit-backface-visibility: @visibility;
|
321
|
+
-moz-backface-visibility: @visibility;
|
322
|
+
backface-visibility: @visibility;
|
323
|
+
}
|
324
|
+
|
325
|
+
// Background clipping
|
326
|
+
// Heads up: FF 3.6 and under need "padding" instead of "padding-box"
|
327
|
+
.background-clip(@clip) {
|
328
|
+
-webkit-background-clip: @clip;
|
329
|
+
-moz-background-clip: @clip;
|
330
|
+
background-clip: @clip;
|
331
|
+
}
|
332
|
+
|
333
|
+
// Background sizing
|
334
|
+
.background-size(@size) {
|
335
|
+
-webkit-background-size: @size;
|
336
|
+
-moz-background-size: @size;
|
337
|
+
-o-background-size: @size;
|
338
|
+
background-size: @size;
|
339
|
+
}
|
340
|
+
|
341
|
+
|
342
|
+
// Box sizing
|
343
|
+
.box-sizing(@boxmodel) {
|
344
|
+
-webkit-box-sizing: @boxmodel;
|
345
|
+
-moz-box-sizing: @boxmodel;
|
346
|
+
box-sizing: @boxmodel;
|
347
|
+
}
|
348
|
+
|
349
|
+
// User select
|
350
|
+
// For selecting text on the page
|
351
|
+
.user-select(@select) {
|
352
|
+
-webkit-user-select: @select;
|
353
|
+
-moz-user-select: @select;
|
354
|
+
-ms-user-select: @select;
|
355
|
+
-o-user-select: @select;
|
356
|
+
user-select: @select;
|
357
|
+
}
|
358
|
+
|
359
|
+
// Resize anything
|
360
|
+
.resizable(@direction) {
|
361
|
+
resize: @direction; // Options: horizontal, vertical, both
|
362
|
+
overflow: auto; // Safari fix
|
363
|
+
}
|
364
|
+
|
365
|
+
// CSS3 Content Columns
|
366
|
+
.content-columns(@columnCount, @columnGap: @gridGutterWidth) {
|
367
|
+
-webkit-column-count: @columnCount;
|
368
|
+
-moz-column-count: @columnCount;
|
369
|
+
column-count: @columnCount;
|
370
|
+
-webkit-column-gap: @columnGap;
|
371
|
+
-moz-column-gap: @columnGap;
|
372
|
+
column-gap: @columnGap;
|
373
|
+
}
|
374
|
+
|
375
|
+
// Optional hyphenation
|
376
|
+
.hyphens(@mode: auto) {
|
377
|
+
word-wrap: break-word;
|
378
|
+
-webkit-hyphens: @mode;
|
379
|
+
-moz-hyphens: @mode;
|
380
|
+
-ms-hyphens: @mode;
|
381
|
+
-o-hyphens: @mode;
|
382
|
+
hyphens: @mode;
|
383
|
+
}
|
384
|
+
|
385
|
+
// Opacity
|
386
|
+
.opacity(@opacity) {
|
387
|
+
opacity: @opacity / 100;
|
388
|
+
filter: ~"alpha(opacity=@{opacity})";
|
389
|
+
}
|
390
|
+
|
391
|
+
|
392
|
+
|
393
|
+
// BACKGROUNDS
|
394
|
+
// --------------------------------------------------
|
395
|
+
|
396
|
+
// Add an alphatransparency value to any background or border color (via Elyse Holladay)
|
397
|
+
#translucent {
|
398
|
+
.background(@color: @white, @alpha: 1) {
|
399
|
+
background-color: hsla(hue(@color), saturation(@color), lightness(@color), @alpha);
|
400
|
+
}
|
401
|
+
.border(@color: @white, @alpha: 1) {
|
402
|
+
border-color: hsla(hue(@color), saturation(@color), lightness(@color), @alpha);
|
403
|
+
.background-clip(padding-box);
|
404
|
+
}
|
405
|
+
}
|
406
|
+
|
407
|
+
// Gradient Bar Colors for buttons and alerts
|
408
|
+
.gradientBar(@primaryColor, @secondaryColor, @textColor: #fff, @textShadow: 0 -1px 0 rgba(0,0,0,.25)) {
|
409
|
+
color: @textColor;
|
410
|
+
text-shadow: @textShadow;
|
411
|
+
#gradient > .vertical(@primaryColor, @secondaryColor);
|
412
|
+
border-color: @secondaryColor @secondaryColor darken(@secondaryColor, 15%);
|
413
|
+
border-color: rgba(0,0,0,.1) rgba(0,0,0,.1) fadein(rgba(0,0,0,.1), 15%);
|
414
|
+
}
|
415
|
+
|
416
|
+
// Gradients
|
417
|
+
#gradient {
|
418
|
+
.horizontal(@startColor: #555, @endColor: #333) {
|
419
|
+
background-color: @endColor;
|
420
|
+
background-image: -moz-linear-gradient(left, @startColor, @endColor); // FF 3.6+
|
421
|
+
background-image: -webkit-gradient(linear, 0 0, 100% 0, from(@startColor), to(@endColor)); // Safari 4+, Chrome 2+
|
422
|
+
background-image: -webkit-linear-gradient(left, @startColor, @endColor); // Safari 5.1+, Chrome 10+
|
423
|
+
background-image: -o-linear-gradient(left, @startColor, @endColor); // Opera 11.10
|
424
|
+
background-image: linear-gradient(to right, @startColor, @endColor); // Standard, IE10
|
425
|
+
background-repeat: repeat-x;
|
426
|
+
filter: e(%("progid:DXImageTransform.Microsoft.gradient(startColorstr='%d', endColorstr='%d', GradientType=1)",argb(@startColor),argb(@endColor))); // IE9 and down
|
427
|
+
}
|
428
|
+
.vertical(@startColor: #555, @endColor: #333) {
|
429
|
+
background-color: mix(@startColor, @endColor, 60%);
|
430
|
+
background-image: -moz-linear-gradient(top, @startColor, @endColor); // FF 3.6+
|
431
|
+
background-image: -webkit-gradient(linear, 0 0, 0 100%, from(@startColor), to(@endColor)); // Safari 4+, Chrome 2+
|
432
|
+
background-image: -webkit-linear-gradient(top, @startColor, @endColor); // Safari 5.1+, Chrome 10+
|
433
|
+
background-image: -o-linear-gradient(top, @startColor, @endColor); // Opera 11.10
|
434
|
+
background-image: linear-gradient(to bottom, @startColor, @endColor); // Standard, IE10
|
435
|
+
background-repeat: repeat-x;
|
436
|
+
filter: e(%("progid:DXImageTransform.Microsoft.gradient(startColorstr='%d', endColorstr='%d', GradientType=0)",argb(@startColor),argb(@endColor))); // IE9 and down
|
437
|
+
}
|
438
|
+
.directional(@startColor: #555, @endColor: #333, @deg: 45deg) {
|
439
|
+
background-color: @endColor;
|
440
|
+
background-repeat: repeat-x;
|
441
|
+
background-image: -moz-linear-gradient(@deg, @startColor, @endColor); // FF 3.6+
|
442
|
+
background-image: -webkit-linear-gradient(@deg, @startColor, @endColor); // Safari 5.1+, Chrome 10+
|
443
|
+
background-image: -o-linear-gradient(@deg, @startColor, @endColor); // Opera 11.10
|
444
|
+
background-image: linear-gradient(@deg, @startColor, @endColor); // Standard, IE10
|
445
|
+
}
|
446
|
+
.horizontal-three-colors(@startColor: #00b3ee, @midColor: #7a43b6, @colorStop: 50%, @endColor: #c3325f) {
|
447
|
+
background-color: mix(@midColor, @endColor, 80%);
|
448
|
+
background-image: -webkit-gradient(left, linear, 0 0, 0 100%, from(@startColor), color-stop(@colorStop, @midColor), to(@endColor));
|
449
|
+
background-image: -webkit-linear-gradient(left, @startColor, @midColor @colorStop, @endColor);
|
450
|
+
background-image: -moz-linear-gradient(left, @startColor, @midColor @colorStop, @endColor);
|
451
|
+
background-image: -o-linear-gradient(left, @startColor, @midColor @colorStop, @endColor);
|
452
|
+
background-image: linear-gradient(to right, @startColor, @midColor @colorStop, @endColor);
|
453
|
+
background-repeat: no-repeat;
|
454
|
+
filter: e(%("progid:DXImageTransform.Microsoft.gradient(startColorstr='%d', endColorstr='%d', GradientType=0)",argb(@startColor),argb(@endColor))); // IE9 and down, gets no color-stop at all for proper fallback
|
455
|
+
}
|
456
|
+
|
457
|
+
.vertical-three-colors(@startColor: #00b3ee, @midColor: #7a43b6, @colorStop: 50%, @endColor: #c3325f) {
|
458
|
+
background-color: mix(@midColor, @endColor, 80%);
|
459
|
+
background-image: -webkit-gradient(linear, 0 0, 0 100%, from(@startColor), color-stop(@colorStop, @midColor), to(@endColor));
|
460
|
+
background-image: -webkit-linear-gradient(@startColor, @midColor @colorStop, @endColor);
|
461
|
+
background-image: -moz-linear-gradient(top, @startColor, @midColor @colorStop, @endColor);
|
462
|
+
background-image: -o-linear-gradient(@startColor, @midColor @colorStop, @endColor);
|
463
|
+
background-image: linear-gradient(@startColor, @midColor @colorStop, @endColor);
|
464
|
+
background-repeat: no-repeat;
|
465
|
+
filter: e(%("progid:DXImageTransform.Microsoft.gradient(startColorstr='%d', endColorstr='%d', GradientType=0)",argb(@startColor),argb(@endColor))); // IE9 and down, gets no color-stop at all for proper fallback
|
466
|
+
}
|
467
|
+
.radial(@innerColor: #555, @outerColor: #333) {
|
468
|
+
background-color: @outerColor;
|
469
|
+
background-image: -webkit-gradient(radial, center center, 0, center center, 460, from(@innerColor), to(@outerColor));
|
470
|
+
background-image: -webkit-radial-gradient(circle, @innerColor, @outerColor);
|
471
|
+
background-image: -moz-radial-gradient(circle, @innerColor, @outerColor);
|
472
|
+
background-image: -o-radial-gradient(circle, @innerColor, @outerColor);
|
473
|
+
background-repeat: no-repeat;
|
474
|
+
}
|
475
|
+
.striped(@color: #555, @angle: 45deg) {
|
476
|
+
background-color: @color;
|
477
|
+
background-image: -webkit-gradient(linear, 0 100%, 100% 0, color-stop(.25, rgba(255,255,255,.15)), color-stop(.25, transparent), color-stop(.5, transparent), color-stop(.5, rgba(255,255,255,.15)), color-stop(.75, rgba(255,255,255,.15)), color-stop(.75, transparent), to(transparent));
|
478
|
+
background-image: -webkit-linear-gradient(@angle, rgba(255,255,255,.15) 25%, transparent 25%, transparent 50%, rgba(255,255,255,.15) 50%, rgba(255,255,255,.15) 75%, transparent 75%, transparent);
|
479
|
+
background-image: -moz-linear-gradient(@angle, rgba(255,255,255,.15) 25%, transparent 25%, transparent 50%, rgba(255,255,255,.15) 50%, rgba(255,255,255,.15) 75%, transparent 75%, transparent);
|
480
|
+
background-image: -o-linear-gradient(@angle, rgba(255,255,255,.15) 25%, transparent 25%, transparent 50%, rgba(255,255,255,.15) 50%, rgba(255,255,255,.15) 75%, transparent 75%, transparent);
|
481
|
+
background-image: linear-gradient(@angle, rgba(255,255,255,.15) 25%, transparent 25%, transparent 50%, rgba(255,255,255,.15) 50%, rgba(255,255,255,.15) 75%, transparent 75%, transparent);
|
482
|
+
}
|
483
|
+
}
|
484
|
+
// Reset filters for IE
|
485
|
+
.reset-filter() {
|
486
|
+
filter: e(%("progid:DXImageTransform.Microsoft.gradient(enabled = false)"));
|
487
|
+
}
|
488
|
+
|
489
|
+
|
490
|
+
|
491
|
+
// COMPONENT MIXINS
|
492
|
+
// --------------------------------------------------
|
493
|
+
|
494
|
+
// Horizontal dividers
|
495
|
+
// -------------------------
|
496
|
+
// Dividers (basically an hr) within dropdowns and nav lists
|
497
|
+
.nav-divider(@top: #e5e5e5, @bottom: @white) {
|
498
|
+
// IE7 needs a set width since we gave a height. Restricting just
|
499
|
+
// to IE7 to keep the 1px left/right space in other browsers.
|
500
|
+
// It is unclear where IE is getting the extra space that we need
|
501
|
+
// to negative-margin away, but so it goes.
|
502
|
+
*width: 100%;
|
503
|
+
height: 1px;
|
504
|
+
margin: ((@baseLineHeight / 2) - 1) 1px; // 8px 1px
|
505
|
+
*margin: -5px 0 5px;
|
506
|
+
overflow: hidden;
|
507
|
+
background-color: @top;
|
508
|
+
border-bottom: 1px solid @bottom;
|
509
|
+
}
|
510
|
+
|
511
|
+
// Button backgrounds
|
512
|
+
// ------------------
|
513
|
+
.buttonBackground(@startColor, @endColor, @textColor: #fff, @textShadow: 0 -1px 0 rgba(0,0,0,.25)) {
|
514
|
+
// gradientBar will set the background to a pleasing blend of these, to support IE<=9
|
515
|
+
.gradientBar(@startColor, @endColor, @textColor, @textShadow);
|
516
|
+
*background-color: @endColor; /* Darken IE7 buttons by default so they stand out more given they won't have borders */
|
517
|
+
.reset-filter();
|
518
|
+
|
519
|
+
// in these cases the gradient won't cover the background, so we override
|
520
|
+
&:hover, &:focus, &:active, &.active, &.disabled, &[disabled] {
|
521
|
+
color: @textColor;
|
522
|
+
background-color: @endColor;
|
523
|
+
*background-color: darken(@endColor, 5%);
|
524
|
+
}
|
525
|
+
|
526
|
+
// IE 7 + 8 can't handle box-shadow to show active, so we darken a bit ourselves
|
527
|
+
&:active,
|
528
|
+
&.active {
|
529
|
+
background-color: darken(@endColor, 10%) e("\9");
|
530
|
+
}
|
531
|
+
}
|
532
|
+
|
533
|
+
// Navbar vertical align
|
534
|
+
// -------------------------
|
535
|
+
// Vertically center elements in the navbar.
|
536
|
+
// Example: an element has a height of 30px, so write out `.navbarVerticalAlign(30px);` to calculate the appropriate top margin.
|
537
|
+
.navbarVerticalAlign(@elementHeight) {
|
538
|
+
margin-top: (@navbarHeight - @elementHeight) / 2;
|
539
|
+
}
|
540
|
+
|
541
|
+
|
542
|
+
|
543
|
+
// Grid System
|
544
|
+
// -----------
|
545
|
+
|
546
|
+
// Centered container element
|
547
|
+
.container-fixed() {
|
548
|
+
margin-right: auto;
|
549
|
+
margin-left: auto;
|
550
|
+
.clearfix();
|
551
|
+
}
|
552
|
+
|
553
|
+
// Table columns
|
554
|
+
.tableColumns(@columnSpan: 1) {
|
555
|
+
float: none; // undo default grid column styles
|
556
|
+
width: ((@gridColumnWidth) * @columnSpan) + (@gridGutterWidth * (@columnSpan - 1)) - 16; // 16 is total padding on left and right of table cells
|
557
|
+
margin-left: 0; // undo default grid column styles
|
558
|
+
}
|
559
|
+
|
560
|
+
// Make a Grid
|
561
|
+
// Use .makeRow and .makeColumn to assign semantic layouts grid system behavior
|
562
|
+
.makeRow() {
|
563
|
+
margin-left: @gridGutterWidth * -1;
|
564
|
+
.clearfix();
|
565
|
+
}
|
566
|
+
.makeColumn(@columns: 1, @offset: 0) {
|
567
|
+
float: left;
|
568
|
+
margin-left: (@gridColumnWidth * @offset) + (@gridGutterWidth * (@offset - 1)) + (@gridGutterWidth * 2);
|
569
|
+
width: (@gridColumnWidth * @columns) + (@gridGutterWidth * (@columns - 1));
|
570
|
+
}
|
571
|
+
|
572
|
+
// The Grid
|
573
|
+
#grid {
|
574
|
+
|
575
|
+
.core (@gridColumnWidth, @gridGutterWidth) {
|
576
|
+
|
577
|
+
.spanX (@index) when (@index > 0) {
|
578
|
+
.span@{index} { .span(@index); }
|
579
|
+
.spanX(@index - 1);
|
580
|
+
}
|
581
|
+
.spanX (0) {}
|
582
|
+
|
583
|
+
.offsetX (@index) when (@index > 0) {
|
584
|
+
.offset@{index} { .offset(@index); }
|
585
|
+
.offsetX(@index - 1);
|
586
|
+
}
|
587
|
+
.offsetX (0) {}
|
588
|
+
|
589
|
+
.offset (@columns) {
|
590
|
+
margin-left: (@gridColumnWidth * @columns) + (@gridGutterWidth * (@columns + 1));
|
591
|
+
}
|
592
|
+
|
593
|
+
.span (@columns) {
|
594
|
+
width: (@gridColumnWidth * @columns) + (@gridGutterWidth * (@columns - 1));
|
595
|
+
}
|
596
|
+
|
597
|
+
.row {
|
598
|
+
margin-left: @gridGutterWidth * -1;
|
599
|
+
.clearfix();
|
600
|
+
}
|
601
|
+
|
602
|
+
[class*="span"] {
|
603
|
+
float: left;
|
604
|
+
min-height: 1px; // prevent collapsing columns
|
605
|
+
margin-left: @gridGutterWidth;
|
606
|
+
}
|
607
|
+
|
608
|
+
// Set the container width, and override it for fixed navbars in media queries
|
609
|
+
.container,
|
610
|
+
.navbar-static-top .container,
|
611
|
+
.navbar-fixed-top .container,
|
612
|
+
.navbar-fixed-bottom .container { .span(@gridColumns); }
|
613
|
+
|
614
|
+
// generate .spanX and .offsetX
|
615
|
+
.spanX (@gridColumns);
|
616
|
+
.offsetX (@gridColumns);
|
617
|
+
|
618
|
+
}
|
619
|
+
|
620
|
+
.fluid (@fluidGridColumnWidth, @fluidGridGutterWidth) {
|
621
|
+
|
622
|
+
.spanX (@index) when (@index > 0) {
|
623
|
+
.span@{index} { .span(@index); }
|
624
|
+
.spanX(@index - 1);
|
625
|
+
}
|
626
|
+
.spanX (0) {}
|
627
|
+
|
628
|
+
.offsetX (@index) when (@index > 0) {
|
629
|
+
.offset@{index} { .offset(@index); }
|
630
|
+
.offset@{index}:first-child { .offsetFirstChild(@index); }
|
631
|
+
.offsetX(@index - 1);
|
632
|
+
}
|
633
|
+
.offsetX (0) {}
|
634
|
+
|
635
|
+
.offset (@columns) {
|
636
|
+
margin-left: (@fluidGridColumnWidth * @columns) + (@fluidGridGutterWidth * (@columns - 1)) + (@fluidGridGutterWidth*2);
|
637
|
+
*margin-left: (@fluidGridColumnWidth * @columns) + (@fluidGridGutterWidth * (@columns - 1)) - (.5 / @gridRowWidth * 100 * 1%) + (@fluidGridGutterWidth*2) - (.5 / @gridRowWidth * 100 * 1%);
|
638
|
+
}
|
639
|
+
|
640
|
+
.offsetFirstChild (@columns) {
|
641
|
+
margin-left: (@fluidGridColumnWidth * @columns) + (@fluidGridGutterWidth * (@columns - 1)) + (@fluidGridGutterWidth);
|
642
|
+
*margin-left: (@fluidGridColumnWidth * @columns) + (@fluidGridGutterWidth * (@columns - 1)) - (.5 / @gridRowWidth * 100 * 1%) + @fluidGridGutterWidth - (.5 / @gridRowWidth * 100 * 1%);
|
643
|
+
}
|
644
|
+
|
645
|
+
.span (@columns) {
|
646
|
+
width: (@fluidGridColumnWidth * @columns) + (@fluidGridGutterWidth * (@columns - 1));
|
647
|
+
*width: (@fluidGridColumnWidth * @columns) + (@fluidGridGutterWidth * (@columns - 1)) - (.5 / @gridRowWidth * 100 * 1%);
|
648
|
+
}
|
649
|
+
|
650
|
+
.row-fluid {
|
651
|
+
width: 100%;
|
652
|
+
.clearfix();
|
653
|
+
[class*="span"] {
|
654
|
+
.input-block-level();
|
655
|
+
float: left;
|
656
|
+
margin-left: @fluidGridGutterWidth;
|
657
|
+
*margin-left: @fluidGridGutterWidth - (.5 / @gridRowWidth * 100 * 1%);
|
658
|
+
}
|
659
|
+
[class*="span"]:first-child {
|
660
|
+
margin-left: 0;
|
661
|
+
}
|
662
|
+
|
663
|
+
// Space grid-sized controls properly if multiple per line
|
664
|
+
.controls-row [class*="span"] + [class*="span"] {
|
665
|
+
margin-left: @fluidGridGutterWidth;
|
666
|
+
}
|
667
|
+
|
668
|
+
// generate .spanX and .offsetX
|
669
|
+
.spanX (@gridColumns);
|
670
|
+
.offsetX (@gridColumns);
|
671
|
+
}
|
672
|
+
|
673
|
+
}
|
674
|
+
|
675
|
+
.input(@gridColumnWidth, @gridGutterWidth) {
|
676
|
+
|
677
|
+
.spanX (@index) when (@index > 0) {
|
678
|
+
input.span@{index}, textarea.span@{index}, .uneditable-input.span@{index} { .span(@index); }
|
679
|
+
.spanX(@index - 1);
|
680
|
+
}
|
681
|
+
.spanX (0) {}
|
682
|
+
|
683
|
+
.span(@columns) {
|
684
|
+
width: ((@gridColumnWidth) * @columns) + (@gridGutterWidth * (@columns - 1)) - 14;
|
685
|
+
}
|
686
|
+
|
687
|
+
input,
|
688
|
+
textarea,
|
689
|
+
.uneditable-input {
|
690
|
+
margin-left: 0; // override margin-left from core grid system
|
691
|
+
}
|
692
|
+
|
693
|
+
// Space grid-sized controls properly if multiple per line
|
694
|
+
.controls-row [class*="span"] + [class*="span"] {
|
695
|
+
margin-left: @gridGutterWidth;
|
696
|
+
}
|
697
|
+
|
698
|
+
// generate .spanX
|
699
|
+
.spanX (@gridColumns);
|
700
|
+
|
701
|
+
}
|
702
|
+
}
|