anjlab-bootstrap-rails 3.0.0.rc1 → 3.0.0.rc2
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.
- 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
|
}
|