anjlab-bootstrap-rails 3.0.0.rc1 → 3.0.0.rc2
Sign up to get free protection for your applications and to get access to all the features.
- checksums.yaml +4 -4
- data/README.md +4 -12
- data/Rakefile +3 -2
- data/app/assets/javascripts/twitter/bootstrap.js +2 -1
- data/app/assets/javascripts/twitter/bootstrap/button.js +4 -2
- data/app/assets/javascripts/twitter/bootstrap/carousel.js +6 -2
- data/app/assets/javascripts/twitter/bootstrap/collapse.js +2 -2
- data/app/assets/javascripts/twitter/bootstrap/modal.js +19 -16
- data/app/assets/javascripts/twitter/bootstrap/popover.js +7 -5
- data/app/assets/javascripts/twitter/bootstrap/tooltip.js +39 -21
- data/app/assets/javascripts/twitter/bootstrap/transition.js +2 -2
- data/app/assets/stylesheets/twitter/bootstrap/_alerts.scss +21 -19
- data/app/assets/stylesheets/twitter/bootstrap/_badges.scss +5 -5
- data/app/assets/stylesheets/twitter/bootstrap/_bootstrap.scss +1 -1
- data/app/assets/stylesheets/twitter/bootstrap/_button-groups.scss +96 -23
- data/app/assets/stylesheets/twitter/bootstrap/_buttons.scss +24 -18
- data/app/assets/stylesheets/twitter/bootstrap/_carousel.scss +10 -11
- data/app/assets/stylesheets/twitter/bootstrap/_close.scss +1 -1
- data/app/assets/stylesheets/twitter/bootstrap/_code.scss +4 -3
- data/app/assets/stylesheets/twitter/bootstrap/_dropdowns.scss +23 -18
- data/app/assets/stylesheets/twitter/bootstrap/_forms.scss +65 -160
- data/app/assets/stylesheets/twitter/bootstrap/_grid.scss +244 -59
- data/app/assets/stylesheets/twitter/bootstrap/_input-groups.scss +127 -0
- data/app/assets/stylesheets/twitter/bootstrap/_labels.scss +12 -4
- data/app/assets/stylesheets/twitter/bootstrap/_list-group.scss +36 -36
- data/app/assets/stylesheets/twitter/bootstrap/_mixins.scss +227 -52
- data/app/assets/stylesheets/twitter/bootstrap/_modals.scss +6 -9
- data/app/assets/stylesheets/twitter/bootstrap/_navbar.scss +268 -82
- data/app/assets/stylesheets/twitter/bootstrap/_navs.scss +10 -18
- data/app/assets/stylesheets/twitter/bootstrap/_pagination.scss +5 -41
- data/app/assets/stylesheets/twitter/bootstrap/_panels.scss +83 -57
- data/app/assets/stylesheets/twitter/bootstrap/_popovers.scss +0 -2
- data/app/assets/stylesheets/twitter/bootstrap/_progress-bars.scss +2 -8
- data/app/assets/stylesheets/twitter/bootstrap/_responsive-utilities.scss +76 -21
- data/app/assets/stylesheets/twitter/bootstrap/_scaffolding.scss +18 -2
- data/app/assets/stylesheets/twitter/bootstrap/_tables.scss +1 -1
- data/app/assets/stylesheets/twitter/bootstrap/_thumbnails.scss +2 -2
- data/app/assets/stylesheets/twitter/bootstrap/_tooltip.scss +1 -1
- data/app/assets/stylesheets/twitter/bootstrap/_type.scss +19 -13
- data/app/assets/stylesheets/twitter/bootstrap/_utilities.scss +3 -2
- data/app/assets/stylesheets/twitter/bootstrap/_variables.scss +86 -46
- data/app/assets/stylesheets/twitter/bootstrap/_wells.scss +2 -2
- data/lib/bootstrap-rails/version.rb +1 -1
- data/vendor/assets/javascripts/holder.js +419 -0
- metadata +4 -3
- data/app/assets/stylesheets/twitter/bootstrap/_accordion.scss +0 -31
@@ -20,7 +20,7 @@ legend {
|
|
20
20
|
margin-bottom: $line-height-computed;
|
21
21
|
font-size: ($font-size-base * 1.5);
|
22
22
|
line-height: inherit;
|
23
|
-
color: $
|
23
|
+
color: $legend-color;
|
24
24
|
border: 0;
|
25
25
|
border-bottom: 1px solid $legend-border-color;
|
26
26
|
}
|
@@ -77,7 +77,7 @@ input[type="checkbox"]:focus {
|
|
77
77
|
// See https://github.com/twbs/bootstrap/issues/8350 for more.
|
78
78
|
input[type="number"] {
|
79
79
|
&::-webkit-outer-spin-button,
|
80
|
-
&::-webkit-inner-spin-button
|
80
|
+
&::-webkit-inner-spin-button {
|
81
81
|
height: auto;
|
82
82
|
}
|
83
83
|
}
|
@@ -121,7 +121,7 @@ input[type="number"] {
|
|
121
121
|
padding: $padding-base-vertical $padding-base-horizontal;
|
122
122
|
font-size: $font-size-base;
|
123
123
|
line-height: $line-height-base;
|
124
|
-
color: $
|
124
|
+
color: $input-color;
|
125
125
|
vertical-align: middle;
|
126
126
|
background-color: $input-bg;
|
127
127
|
border: 1px solid $input-border;
|
@@ -129,13 +129,9 @@ input[type="number"] {
|
|
129
129
|
@include box-shadow(inset 0 1px 1px rgba(0,0,0,.075));
|
130
130
|
@include transition((border-color ease-in-out .15s, box-shadow ease-in-out .15s));
|
131
131
|
|
132
|
-
|
133
|
-
|
134
|
-
outline: 0;
|
135
|
-
@include box-shadow((inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(82,168,236,.6)));
|
136
|
-
}
|
132
|
+
// Customize the `:focus` state to imitate native WebKit styles.
|
133
|
+
@include form-control-focus();
|
137
134
|
}
|
138
|
-
|
139
135
|
// Disabled and read-only inputs
|
140
136
|
// Note: HTML5 says that inputs under a fieldset > legend:first-child won't be
|
141
137
|
// disabled if the fieldset is disabled. Due to implementation difficulty,
|
@@ -211,37 +207,10 @@ textarea.form-control {
|
|
211
207
|
}
|
212
208
|
|
213
209
|
|
214
|
-
|
215
210
|
// Form control sizing
|
216
|
-
|
217
|
-
// Relative text size, padding, and border-radii changes for form controls. For
|
218
|
-
// horizontal sizing, wrap controls in the predefined grid classes. `<select>`
|
219
|
-
// element gets special love because it's special, and that's a fact!
|
211
|
+
@include input-size(".input-sm", $input-height-small, $padding-small-vertical, $padding-small-horizontal, $font-size-small, $line-height-small, $border-radius-small);
|
220
212
|
|
221
|
-
.
|
222
|
-
&.input-large {
|
223
|
-
height: $input-height-large;
|
224
|
-
padding: $padding-large-vertical $padding-large-horizontal;
|
225
|
-
font-size: $font-size-large;
|
226
|
-
border-radius: $border-radius-large;
|
227
|
-
}
|
228
|
-
&.input-small {
|
229
|
-
height: $input-height-small;
|
230
|
-
padding: $padding-small-vertical $padding-small-horizontal;
|
231
|
-
font-size: $font-size-small;
|
232
|
-
border-radius: $border-radius-small;
|
233
|
-
}
|
234
|
-
}
|
235
|
-
select {
|
236
|
-
&.input-large {
|
237
|
-
height: $input-height-large;
|
238
|
-
line-height: $input-height-large;
|
239
|
-
}
|
240
|
-
&.input-small {
|
241
|
-
height: $input-height-small;
|
242
|
-
line-height: $input-height-small;
|
243
|
-
}
|
244
|
-
}
|
213
|
+
@include input-size(".input-lg", $input-height-large, $padding-large-vertical, $padding-large-horizontal, $font-size-large, $line-height-large, $border-radius-large);
|
245
214
|
|
246
215
|
|
247
216
|
// Form control feedback states
|
@@ -262,6 +231,17 @@ select {
|
|
262
231
|
}
|
263
232
|
|
264
233
|
|
234
|
+
// Static form control text
|
235
|
+
//
|
236
|
+
// Apply class to a `p` element to make any string of text align with labels in
|
237
|
+
// a horizontal form layout.
|
238
|
+
|
239
|
+
.form-control-static {
|
240
|
+
margin-bottom: 0; // Remove default margin from `p`
|
241
|
+
padding-top: $padding-base-vertical;
|
242
|
+
}
|
243
|
+
|
244
|
+
|
265
245
|
// Help text
|
266
246
|
//
|
267
247
|
// Apply to any element you wish to create light text for placement immediately
|
@@ -276,138 +256,63 @@ select {
|
|
276
256
|
|
277
257
|
|
278
258
|
|
279
|
-
// Input groups
|
280
|
-
// --------------------------------------------------
|
281
|
-
|
282
|
-
// Base styles
|
283
|
-
// -------------------------
|
284
|
-
.input-group {
|
285
|
-
display: table;
|
286
|
-
border-collapse: separate; // prevent input groups from inheriting border styles from table cells when placed within a table
|
287
|
-
|
288
|
-
// Undo padding and float of grid classes
|
289
|
-
&.col {
|
290
|
-
float: none;
|
291
|
-
padding-left: 0;
|
292
|
-
padding-right: 0;
|
293
|
-
}
|
294
|
-
|
295
|
-
.form-control {
|
296
|
-
width: 100%;
|
297
|
-
margin-bottom: 0;
|
298
|
-
}
|
299
|
-
}
|
300
|
-
|
301
|
-
// Display as table-cell
|
302
|
-
// -------------------------
|
303
|
-
.input-group-addon,
|
304
|
-
.input-group-btn,
|
305
|
-
.input-group .form-control {
|
306
|
-
display: table-cell;
|
307
|
-
|
308
|
-
&:not(:first-child):not(:last-child) {
|
309
|
-
border-radius: 0;
|
310
|
-
}
|
311
|
-
}
|
312
|
-
// Addon and addon wrapper for buttons
|
313
|
-
.input-group-addon,
|
314
|
-
.input-group-btn {
|
315
|
-
width: 1%;
|
316
|
-
white-space: nowrap;
|
317
|
-
vertical-align: middle; // Match the inputs
|
318
|
-
}
|
319
|
-
|
320
|
-
// Text input groups
|
321
|
-
// -------------------------
|
322
|
-
.input-group-addon {
|
323
|
-
@include box-sizing(border-box);
|
324
|
-
padding: $padding-base-vertical $padding-base-horizontal;
|
325
|
-
font-size: $font-size-base;
|
326
|
-
font-weight: normal;
|
327
|
-
line-height: $line-height-base;
|
328
|
-
text-align: center;
|
329
|
-
background-color: $gray-lighter;
|
330
|
-
border: 1px solid $input-group-addon-border-color;
|
331
|
-
border-radius: $border-radius-base;
|
332
|
-
|
333
|
-
&.input-small {
|
334
|
-
padding: $padding-small-vertical $padding-small-horizontal;
|
335
|
-
font-size: $font-size-small;
|
336
|
-
border-radius: $border-radius-small;
|
337
|
-
}
|
338
|
-
&.input-large {
|
339
|
-
padding: $padding-large-vertical $padding-large-horizontal;
|
340
|
-
font-size: $font-size-large;
|
341
|
-
border-radius: $border-radius-large;
|
342
|
-
}
|
343
|
-
}
|
344
|
-
|
345
|
-
// Reset rounded corners
|
346
|
-
.input-group .form-control:first-child,
|
347
|
-
.input-group-addon:first-child,
|
348
|
-
.input-group-btn:first-child > .btn,
|
349
|
-
.input-group-btn:first-child > .dropdown-toggle,
|
350
|
-
.input-group-btn:last-child > .btn:not(:last-child):not(.dropdown-toggle) {
|
351
|
-
@include border-right-radius(0);
|
352
|
-
}
|
353
|
-
.input-group-addon:first-child {
|
354
|
-
border-right: 0;
|
355
|
-
}
|
356
|
-
.input-group .form-control:last-child,
|
357
|
-
.input-group-addon:last-child,
|
358
|
-
.input-group-btn:last-child > .btn,
|
359
|
-
.input-group-btn:last-child > .dropdown-toggle,
|
360
|
-
.input-group-btn:first-child > .btn:not(:first-child) {
|
361
|
-
@include border-left-radius(0);
|
362
|
-
}
|
363
|
-
.input-group-addon:last-child {
|
364
|
-
border-left: 0;
|
365
|
-
}
|
366
|
-
|
367
|
-
// Button input groups
|
368
|
-
// -------------------------
|
369
|
-
.input-group-btn {
|
370
|
-
position: relative;
|
371
|
-
white-space: nowrap;
|
372
|
-
}
|
373
|
-
.input-group-btn > .btn {
|
374
|
-
position: relative;
|
375
|
-
// Jankily prevent input button groups from wrapping
|
376
|
-
+ .btn {
|
377
|
-
margin-left: -4px;
|
378
|
-
}
|
379
|
-
// Bring the "active" button to the front
|
380
|
-
&:hover,
|
381
|
-
&:active {
|
382
|
-
z-index: 2;
|
383
|
-
}
|
384
|
-
}
|
385
|
-
|
386
|
-
|
387
259
|
// Inline forms
|
388
|
-
//
|
260
|
+
//
|
261
|
+
// Make forms appear inline(-block) by adding the `.form-inline` class. Inline
|
262
|
+
// forms begin stacked on extra small (mobile) devices and then go inline when
|
263
|
+
// viewports reach <768px.
|
264
|
+
//
|
265
|
+
// Requires wrapping inputs and labels with `.form-group` for proper display of
|
266
|
+
// default HTML form controls and our custom form controls (e.g., input groups).
|
267
|
+
//
|
268
|
+
// Heads up! This is mixin-ed into `.navbar-form` in navbars.less.
|
389
269
|
|
390
270
|
@mixin form-inline {
|
391
|
-
|
392
|
-
|
393
|
-
|
394
|
-
|
395
|
-
|
396
|
-
|
397
|
-
|
398
|
-
|
399
|
-
|
271
|
+
|
272
|
+
// Kick in the inline
|
273
|
+
@media (min-width: $screen-tablet) {
|
274
|
+
// Inline-block all the things for "inline"
|
275
|
+
.form-group {
|
276
|
+
display: inline-block;
|
277
|
+
margin-bottom: 0;
|
278
|
+
vertical-align: middle;
|
279
|
+
}
|
280
|
+
|
281
|
+
// In navbar-form, allow folks to *not* use `.form-group`
|
282
|
+
.form-control {
|
283
|
+
display: inline-block;
|
284
|
+
}
|
285
|
+
|
286
|
+
// Remove default margin on radios/checkboxes that were used for stacking, and
|
287
|
+
// then undo the floating of radios and checkboxes to match (which also avoids
|
288
|
+
// a bug in WebKit: https://github.com/twbs/bootstrap/issues/1969).
|
289
|
+
.radio,
|
290
|
+
.checkbox {
|
291
|
+
display: inline-block;
|
292
|
+
margin-top: 0;
|
293
|
+
margin-bottom: 0;
|
294
|
+
padding-left: 0;
|
295
|
+
}
|
296
|
+
.radio input[type="radio"],
|
297
|
+
.checkbox input[type="checkbox"] {
|
298
|
+
float: none;
|
299
|
+
margin-left: 0;
|
300
|
+
}
|
400
301
|
}
|
401
302
|
}
|
402
303
|
|
403
304
|
.form-inline { @include form-inline }
|
404
305
|
|
306
|
+
|
405
307
|
// Horizontal forms
|
406
|
-
//
|
407
|
-
// Horizontal forms are built on grid classes
|
308
|
+
//
|
309
|
+
// Horizontal forms are built on grid classes and allow you to create forms with
|
310
|
+
// labels on the left and inputs on the right.
|
408
311
|
|
409
|
-
.form-horizontal .control-label
|
410
|
-
|
312
|
+
.form-horizontal .control-label,
|
313
|
+
.form-horizontal .radio-inline,
|
314
|
+
.form-horizontal .checkbox-inline {
|
315
|
+
padding-top: $padding-base-vertical;
|
411
316
|
}
|
412
317
|
|
413
318
|
.form-horizontal {
|
@@ -2,6 +2,7 @@
|
|
2
2
|
// Grid system
|
3
3
|
// --------------------------------------------------
|
4
4
|
|
5
|
+
|
5
6
|
// Set the container width, and override it for fixed navbars in media queries
|
6
7
|
.container {
|
7
8
|
@include container-fixed();
|
@@ -13,18 +14,18 @@
|
|
13
14
|
}
|
14
15
|
|
15
16
|
// Common styles for small and large grid columns
|
16
|
-
.col-1,
|
17
|
-
.col-2,
|
18
|
-
.col-3,
|
19
|
-
.col-4,
|
20
|
-
.col-5,
|
21
|
-
.col-6,
|
22
|
-
.col-7,
|
23
|
-
.col-8,
|
24
|
-
.col-9,
|
25
|
-
.col-10,
|
26
|
-
.col-11,
|
27
|
-
.col-12,
|
17
|
+
.col-xs-1,
|
18
|
+
.col-xs-2,
|
19
|
+
.col-xs-3,
|
20
|
+
.col-xs-4,
|
21
|
+
.col-xs-5,
|
22
|
+
.col-xs-6,
|
23
|
+
.col-xs-7,
|
24
|
+
.col-xs-8,
|
25
|
+
.col-xs-9,
|
26
|
+
.col-xs-10,
|
27
|
+
.col-xs-11,
|
28
|
+
.col-xs-12,
|
28
29
|
.col-sm-1,
|
29
30
|
.col-sm-2,
|
30
31
|
.col-sm-3,
|
@@ -37,6 +38,18 @@
|
|
37
38
|
.col-sm-10,
|
38
39
|
.col-sm-11,
|
39
40
|
.col-sm-12,
|
41
|
+
.col-md-1,
|
42
|
+
.col-md-2,
|
43
|
+
.col-md-3,
|
44
|
+
.col-md-4,
|
45
|
+
.col-md-5,
|
46
|
+
.col-md-6,
|
47
|
+
.col-md-7,
|
48
|
+
.col-md-8,
|
49
|
+
.col-md-9,
|
50
|
+
.col-md-10,
|
51
|
+
.col-md-11,
|
52
|
+
.col-md-12,
|
40
53
|
.col-lg-1,
|
41
54
|
.col-lg-2,
|
42
55
|
.col-lg-3,
|
@@ -58,32 +71,49 @@
|
|
58
71
|
}
|
59
72
|
|
60
73
|
|
61
|
-
|
74
|
+
// Extra small grid
|
62
75
|
//
|
63
|
-
//
|
76
|
+
// Grid classes for extra small devices like smartphones. No offset, push, or
|
77
|
+
// pull classes are present here due to the size of the target.
|
64
78
|
//
|
79
|
+
// Note that `.col-xs-12` doesn't get floated on purpose—there's no need since
|
80
|
+
// it's full-width.
|
65
81
|
|
66
|
-
|
67
|
-
.col-
|
68
|
-
.col-
|
69
|
-
.col-
|
70
|
-
.col-
|
71
|
-
.col-
|
72
|
-
.col-
|
73
|
-
.col-
|
74
|
-
.col-
|
75
|
-
.col-
|
76
|
-
.col-
|
77
|
-
.col-11,
|
78
|
-
.col-12 {
|
82
|
+
.col-xs-1,
|
83
|
+
.col-xs-2,
|
84
|
+
.col-xs-3,
|
85
|
+
.col-xs-4,
|
86
|
+
.col-xs-5,
|
87
|
+
.col-xs-6,
|
88
|
+
.col-xs-7,
|
89
|
+
.col-xs-8,
|
90
|
+
.col-xs-9,
|
91
|
+
.col-xs-10,
|
92
|
+
.col-xs-11 {
|
79
93
|
float: left;
|
80
94
|
}
|
95
|
+
.col-xs-1 { width: percentage((1 / $grid-columns)); }
|
96
|
+
.col-xs-2 { width: percentage((2 / $grid-columns)); }
|
97
|
+
.col-xs-3 { width: percentage((3 / $grid-columns)); }
|
98
|
+
.col-xs-4 { width: percentage((4 / $grid-columns)); }
|
99
|
+
.col-xs-5 { width: percentage((5 / $grid-columns)); }
|
100
|
+
.col-xs-6 { width: percentage((6 / $grid-columns)); }
|
101
|
+
.col-xs-7 { width: percentage((7 / $grid-columns)); }
|
102
|
+
.col-xs-8 { width: percentage((8 / $grid-columns)); }
|
103
|
+
.col-xs-9 { width: percentage((9 / $grid-columns)); }
|
104
|
+
.col-xs-10 { width: percentage((10/ $grid-columns)); }
|
105
|
+
.col-xs-11 { width: percentage((11/ $grid-columns)); }
|
106
|
+
.col-xs-12 { width: 100%; }
|
81
107
|
|
82
|
-
@for $i from 1 through $grid-columns {
|
83
|
-
.col-#{$i} { width: percentage(($i / $grid-columns)); }
|
84
|
-
}
|
85
108
|
|
86
|
-
// Small
|
109
|
+
// Small grid
|
110
|
+
//
|
111
|
+
// Columns, offsets, pushes, and pulls for the small device range, from phones
|
112
|
+
// to tablets.
|
113
|
+
//
|
114
|
+
// Note that `.col-sm-12` doesn't get floated on purpose—there's no need since
|
115
|
+
// it's full-width.
|
116
|
+
|
87
117
|
@media (min-width: $screen-tablet) {
|
88
118
|
.container {
|
89
119
|
max-width: $container-tablet;
|
@@ -99,30 +129,151 @@
|
|
99
129
|
.col-sm-8,
|
100
130
|
.col-sm-9,
|
101
131
|
.col-sm-10,
|
102
|
-
.col-sm-11
|
103
|
-
.col-sm-12 {
|
132
|
+
.col-sm-11 {
|
104
133
|
float: left;
|
105
134
|
}
|
106
|
-
|
107
|
-
|
108
|
-
|
109
|
-
}
|
135
|
+
.col-sm-1 { width: percentage((1 / $grid-columns)); }
|
136
|
+
.col-sm-2 { width: percentage((2 / $grid-columns)); }
|
137
|
+
.col-sm-3 { width: percentage((3 / $grid-columns)); }
|
138
|
+
.col-sm-4 { width: percentage((4 / $grid-columns)); }
|
139
|
+
.col-sm-5 { width: percentage((5 / $grid-columns)); }
|
140
|
+
.col-sm-6 { width: percentage((6 / $grid-columns)); }
|
141
|
+
.col-sm-7 { width: percentage((7 / $grid-columns)); }
|
142
|
+
.col-sm-8 { width: percentage((8 / $grid-columns)); }
|
143
|
+
.col-sm-9 { width: percentage((9 / $grid-columns)); }
|
144
|
+
.col-sm-10 { width: percentage((10/ $grid-columns)); }
|
145
|
+
.col-sm-11 { width: percentage((11/ $grid-columns)); }
|
146
|
+
.col-sm-12 { width: 100%; }
|
110
147
|
|
111
148
|
// Push and pull columns for source order changes
|
112
|
-
|
113
|
-
|
114
|
-
}
|
149
|
+
.col-sm-push-1 { left: percentage((1 / $grid-columns)); }
|
150
|
+
.col-sm-push-2 { left: percentage((2 / $grid-columns)); }
|
151
|
+
.col-sm-push-3 { left: percentage((3 / $grid-columns)); }
|
152
|
+
.col-sm-push-4 { left: percentage((4 / $grid-columns)); }
|
153
|
+
.col-sm-push-5 { left: percentage((5 / $grid-columns)); }
|
154
|
+
.col-sm-push-6 { left: percentage((6 / $grid-columns)); }
|
155
|
+
.col-sm-push-7 { left: percentage((7 / $grid-columns)); }
|
156
|
+
.col-sm-push-8 { left: percentage((8 / $grid-columns)); }
|
157
|
+
.col-sm-push-9 { left: percentage((9 / $grid-columns)); }
|
158
|
+
.col-sm-push-10 { left: percentage((10/ $grid-columns)); }
|
159
|
+
.col-sm-push-11 { left: percentage((11/ $grid-columns)); }
|
115
160
|
|
116
|
-
|
117
|
-
|
118
|
-
}
|
161
|
+
.col-sm-pull-1 { right: percentage((1 / $grid-columns)); }
|
162
|
+
.col-sm-pull-2 { right: percentage((2 / $grid-columns)); }
|
163
|
+
.col-sm-pull-3 { right: percentage((3 / $grid-columns)); }
|
164
|
+
.col-sm-pull-4 { right: percentage((4 / $grid-columns)); }
|
165
|
+
.col-sm-pull-5 { right: percentage((5 / $grid-columns)); }
|
166
|
+
.col-sm-pull-6 { right: percentage((6 / $grid-columns)); }
|
167
|
+
.col-sm-pull-7 { right: percentage((7 / $grid-columns)); }
|
168
|
+
.col-sm-pull-8 { right: percentage((8 / $grid-columns)); }
|
169
|
+
.col-sm-pull-9 { right: percentage((9 / $grid-columns)); }
|
170
|
+
.col-sm-pull-10 { right: percentage((10/ $grid-columns)); }
|
171
|
+
.col-sm-pull-11 { right: percentage((11/ $grid-columns)); }
|
172
|
+
|
173
|
+
// Offsets
|
174
|
+
.col-sm-offset-1 { margin-left: percentage((1 / $grid-columns)); }
|
175
|
+
.col-sm-offset-2 { margin-left: percentage((2 / $grid-columns)); }
|
176
|
+
.col-sm-offset-3 { margin-left: percentage((3 / $grid-columns)); }
|
177
|
+
.col-sm-offset-4 { margin-left: percentage((4 / $grid-columns)); }
|
178
|
+
.col-sm-offset-5 { margin-left: percentage((5 / $grid-columns)); }
|
179
|
+
.col-sm-offset-6 { margin-left: percentage((6 / $grid-columns)); }
|
180
|
+
.col-sm-offset-7 { margin-left: percentage((7 / $grid-columns)); }
|
181
|
+
.col-sm-offset-8 { margin-left: percentage((8 / $grid-columns)); }
|
182
|
+
.col-sm-offset-9 { margin-left: percentage((9 / $grid-columns)); }
|
183
|
+
.col-sm-offset-10 { margin-left: percentage((10/ $grid-columns)); }
|
184
|
+
.col-sm-offset-11 { margin-left: percentage((11/ $grid-columns)); }
|
119
185
|
}
|
120
186
|
|
121
|
-
|
187
|
+
|
188
|
+
// Medium grid
|
189
|
+
//
|
190
|
+
// Columns, offsets, pushes, and pulls for the desktop device range.
|
191
|
+
//
|
192
|
+
// Note that `.col-md-12` doesn't get floated on purpose—there's no need since
|
193
|
+
// it's full-width.
|
194
|
+
|
122
195
|
@media (min-width: $screen-desktop) {
|
123
196
|
.container {
|
124
197
|
max-width: $container-desktop;
|
125
198
|
}
|
199
|
+
.col-md-1,
|
200
|
+
.col-md-2,
|
201
|
+
.col-md-3,
|
202
|
+
.col-md-4,
|
203
|
+
.col-md-5,
|
204
|
+
.col-md-6,
|
205
|
+
.col-md-7,
|
206
|
+
.col-md-8,
|
207
|
+
.col-md-9,
|
208
|
+
.col-md-10,
|
209
|
+
.col-md-11 {
|
210
|
+
float: left;
|
211
|
+
}
|
212
|
+
.col-md-1 { width: percentage((1 / $grid-columns)); }
|
213
|
+
.col-md-2 { width: percentage((2 / $grid-columns)); }
|
214
|
+
.col-md-3 { width: percentage((3 / $grid-columns)); }
|
215
|
+
.col-md-4 { width: percentage((4 / $grid-columns)); }
|
216
|
+
.col-md-5 { width: percentage((5 / $grid-columns)); }
|
217
|
+
.col-md-6 { width: percentage((6 / $grid-columns)); }
|
218
|
+
.col-md-7 { width: percentage((7 / $grid-columns)); }
|
219
|
+
.col-md-8 { width: percentage((8 / $grid-columns)); }
|
220
|
+
.col-md-9 { width: percentage((9 / $grid-columns)); }
|
221
|
+
.col-md-10 { width: percentage((10/ $grid-columns)); }
|
222
|
+
.col-md-11 { width: percentage((11/ $grid-columns)); }
|
223
|
+
.col-md-12 { width: 100%; }
|
224
|
+
|
225
|
+
// Push and pull columns for source order changes
|
226
|
+
.col-md-push-1 { left: percentage((1 / $grid-columns)); }
|
227
|
+
.col-md-push-2 { left: percentage((2 / $grid-columns)); }
|
228
|
+
.col-md-push-3 { left: percentage((3 / $grid-columns)); }
|
229
|
+
.col-md-push-4 { left: percentage((4 / $grid-columns)); }
|
230
|
+
.col-md-push-5 { left: percentage((5 / $grid-columns)); }
|
231
|
+
.col-md-push-6 { left: percentage((6 / $grid-columns)); }
|
232
|
+
.col-md-push-7 { left: percentage((7 / $grid-columns)); }
|
233
|
+
.col-md-push-8 { left: percentage((8 / $grid-columns)); }
|
234
|
+
.col-md-push-9 { left: percentage((9 / $grid-columns)); }
|
235
|
+
.col-md-push-10 { left: percentage((10/ $grid-columns)); }
|
236
|
+
.col-md-push-11 { left: percentage((11/ $grid-columns)); }
|
237
|
+
|
238
|
+
.col-md-pull-1 { right: percentage((1 / $grid-columns)); }
|
239
|
+
.col-md-pull-2 { right: percentage((2 / $grid-columns)); }
|
240
|
+
.col-md-pull-3 { right: percentage((3 / $grid-columns)); }
|
241
|
+
.col-md-pull-4 { right: percentage((4 / $grid-columns)); }
|
242
|
+
.col-md-pull-5 { right: percentage((5 / $grid-columns)); }
|
243
|
+
.col-md-pull-6 { right: percentage((6 / $grid-columns)); }
|
244
|
+
.col-md-pull-7 { right: percentage((7 / $grid-columns)); }
|
245
|
+
.col-md-pull-8 { right: percentage((8 / $grid-columns)); }
|
246
|
+
.col-md-pull-9 { right: percentage((9 / $grid-columns)); }
|
247
|
+
.col-md-pull-10 { right: percentage((10/ $grid-columns)); }
|
248
|
+
.col-md-pull-11 { right: percentage((11/ $grid-columns)); }
|
249
|
+
|
250
|
+
// Offsets
|
251
|
+
.col-md-offset-1 { margin-left: percentage((1 / $grid-columns)); }
|
252
|
+
.col-md-offset-2 { margin-left: percentage((2 / $grid-columns)); }
|
253
|
+
.col-md-offset-3 { margin-left: percentage((3 / $grid-columns)); }
|
254
|
+
.col-md-offset-4 { margin-left: percentage((4 / $grid-columns)); }
|
255
|
+
.col-md-offset-5 { margin-left: percentage((5 / $grid-columns)); }
|
256
|
+
.col-md-offset-6 { margin-left: percentage((6 / $grid-columns)); }
|
257
|
+
.col-md-offset-7 { margin-left: percentage((7 / $grid-columns)); }
|
258
|
+
.col-md-offset-8 { margin-left: percentage((8 / $grid-columns)); }
|
259
|
+
.col-md-offset-9 { margin-left: percentage((9 / $grid-columns)); }
|
260
|
+
.col-md-offset-10 { margin-left: percentage((10/ $grid-columns)); }
|
261
|
+
.col-md-offset-11 { margin-left: percentage((11/ $grid-columns)); }
|
262
|
+
}
|
263
|
+
|
264
|
+
|
265
|
+
// Large grid
|
266
|
+
//
|
267
|
+
// Columns, offsets, pushes, and pulls for the large desktop device range.
|
268
|
+
//
|
269
|
+
// Note that `.col-lg-12` doesn't get floated on purpose—there's no need since
|
270
|
+
// it's full-width.
|
271
|
+
|
272
|
+
@media (min-width: $screen-large-desktop) {
|
273
|
+
.container {
|
274
|
+
max-width: $container-large-desktop;
|
275
|
+
}
|
276
|
+
|
126
277
|
.col-lg-1,
|
127
278
|
.col-lg-2,
|
128
279
|
.col-lg-3,
|
@@ -133,23 +284,57 @@
|
|
133
284
|
.col-lg-8,
|
134
285
|
.col-lg-9,
|
135
286
|
.col-lg-10,
|
136
|
-
.col-lg-11
|
137
|
-
.col-lg-12 {
|
287
|
+
.col-lg-11 {
|
138
288
|
float: left;
|
139
289
|
}
|
140
|
-
|
141
|
-
|
142
|
-
}
|
290
|
+
.col-lg-1 { width: percentage((1 / $grid-columns)); }
|
291
|
+
.col-lg-2 { width: percentage((2 / $grid-columns)); }
|
292
|
+
.col-lg-3 { width: percentage((3 / $grid-columns)); }
|
293
|
+
.col-lg-4 { width: percentage((4 / $grid-columns)); }
|
294
|
+
.col-lg-5 { width: percentage((5 / $grid-columns)); }
|
295
|
+
.col-lg-6 { width: percentage((6 / $grid-columns)); }
|
296
|
+
.col-lg-7 { width: percentage((7 / $grid-columns)); }
|
297
|
+
.col-lg-8 { width: percentage((8 / $grid-columns)); }
|
298
|
+
.col-lg-9 { width: percentage((9 / $grid-columns)); }
|
299
|
+
.col-lg-10 { width: percentage((10/ $grid-columns)); }
|
300
|
+
.col-lg-11 { width: percentage((11/ $grid-columns)); }
|
301
|
+
.col-lg-12 { width: 100%; }
|
143
302
|
|
144
|
-
//
|
145
|
-
|
146
|
-
|
147
|
-
}
|
148
|
-
}
|
303
|
+
// Push and pull columns for source order changes
|
304
|
+
.col-lg-push-1 { left: percentage((1 / $grid-columns)); }
|
305
|
+
.col-lg-push-2 { left: percentage((2 / $grid-columns)); }
|
306
|
+
.col-lg-push-3 { left: percentage((3 / $grid-columns)); }
|
307
|
+
.col-lg-push-4 { left: percentage((4 / $grid-columns)); }
|
308
|
+
.col-lg-push-5 { left: percentage((5 / $grid-columns)); }
|
309
|
+
.col-lg-push-6 { left: percentage((6 / $grid-columns)); }
|
310
|
+
.col-lg-push-7 { left: percentage((7 / $grid-columns)); }
|
311
|
+
.col-lg-push-8 { left: percentage((8 / $grid-columns)); }
|
312
|
+
.col-lg-push-9 { left: percentage((9 / $grid-columns)); }
|
313
|
+
.col-lg-push-10 { left: percentage((10/ $grid-columns)); }
|
314
|
+
.col-lg-push-11 { left: percentage((11/ $grid-columns)); }
|
149
315
|
|
150
|
-
|
151
|
-
|
152
|
-
.
|
153
|
-
|
154
|
-
}
|
316
|
+
.col-lg-pull-1 { right: percentage((1 / $grid-columns)); }
|
317
|
+
.col-lg-pull-2 { right: percentage((2 / $grid-columns)); }
|
318
|
+
.col-lg-pull-3 { right: percentage((3 / $grid-columns)); }
|
319
|
+
.col-lg-pull-4 { right: percentage((4 / $grid-columns)); }
|
320
|
+
.col-lg-pull-5 { right: percentage((5 / $grid-columns)); }
|
321
|
+
.col-lg-pull-6 { right: percentage((6 / $grid-columns)); }
|
322
|
+
.col-lg-pull-7 { right: percentage((7 / $grid-columns)); }
|
323
|
+
.col-lg-pull-8 { right: percentage((8 / $grid-columns)); }
|
324
|
+
.col-lg-pull-9 { right: percentage((9 / $grid-columns)); }
|
325
|
+
.col-lg-pull-10 { right: percentage((10/ $grid-columns)); }
|
326
|
+
.col-lg-pull-11 { right: percentage((11/ $grid-columns)); }
|
327
|
+
|
328
|
+
// Offsets
|
329
|
+
.col-lg-offset-1 { margin-left: percentage((1 / $grid-columns)); }
|
330
|
+
.col-lg-offset-2 { margin-left: percentage((2 / $grid-columns)); }
|
331
|
+
.col-lg-offset-3 { margin-left: percentage((3 / $grid-columns)); }
|
332
|
+
.col-lg-offset-4 { margin-left: percentage((4 / $grid-columns)); }
|
333
|
+
.col-lg-offset-5 { margin-left: percentage((5 / $grid-columns)); }
|
334
|
+
.col-lg-offset-6 { margin-left: percentage((6 / $grid-columns)); }
|
335
|
+
.col-lg-offset-7 { margin-left: percentage((7 / $grid-columns)); }
|
336
|
+
.col-lg-offset-8 { margin-left: percentage((8 / $grid-columns)); }
|
337
|
+
.col-lg-offset-9 { margin-left: percentage((9 / $grid-columns)); }
|
338
|
+
.col-lg-offset-10 { margin-left: percentage((10/ $grid-columns)); }
|
339
|
+
.col-lg-offset-11 { margin-left: percentage((11/ $grid-columns)); }
|
155
340
|
}
|