bootstrap-generators 2.1.1 → 2.2.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.
Files changed (84) hide show
  1. data/README.md +48 -3
  2. data/lib/bootstrap/generators/version.rb +1 -1
  3. data/lib/generators/bootstrap/install/templates/assets/stylesheets/bootstrap-variables.css.scss +25 -2
  4. data/lib/generators/bootstrap/install/templates/assets/stylesheets/bootstrap-variables.less +23 -1
  5. data/lib/generators/bootstrap/install/templates/assets/stylesheets/fluid.css.scss +1 -1
  6. data/lib/generators/bootstrap/install/templates/assets/stylesheets/hero.css.scss +1 -1
  7. data/vendor/assets/javascripts/bootstrap-affix.js +4 -2
  8. data/vendor/assets/javascripts/bootstrap-alert.js +2 -4
  9. data/vendor/assets/javascripts/bootstrap-button.js +5 -7
  10. data/vendor/assets/javascripts/bootstrap-carousel.js +12 -12
  11. data/vendor/assets/javascripts/bootstrap-collapse.js +9 -11
  12. data/vendor/assets/javascripts/bootstrap-dropdown.js +9 -11
  13. data/vendor/assets/javascripts/bootstrap-modal.js +20 -25
  14. data/vendor/assets/javascripts/bootstrap-popover.js +1 -1
  15. data/vendor/assets/javascripts/bootstrap-scrollspy.js +1 -1
  16. data/vendor/assets/javascripts/bootstrap-tab.js +5 -7
  17. data/vendor/assets/javascripts/bootstrap-tooltip.js +12 -11
  18. data/vendor/assets/javascripts/bootstrap-transition.js +5 -5
  19. data/vendor/assets/javascripts/bootstrap-typeahead.js +19 -9
  20. data/vendor/twitter/bootstrap/less/accordion.less +1 -1
  21. data/vendor/twitter/bootstrap/less/alerts.less +1 -1
  22. data/vendor/twitter/bootstrap/less/bootstrap.less +2 -1
  23. data/vendor/twitter/bootstrap/less/breadcrumbs.less +1 -1
  24. data/vendor/twitter/bootstrap/less/button-groups.less +5 -8
  25. data/vendor/twitter/bootstrap/less/buttons.less +17 -16
  26. data/vendor/twitter/bootstrap/less/code.less +1 -1
  27. data/vendor/twitter/bootstrap/less/dropdowns.less +32 -5
  28. data/vendor/twitter/bootstrap/less/forms.less +47 -14
  29. data/vendor/twitter/bootstrap/less/hero-unit.less +6 -5
  30. data/vendor/twitter/bootstrap/less/labels-badges.less +4 -2
  31. data/vendor/twitter/bootstrap/less/media.less +55 -0
  32. data/vendor/twitter/bootstrap/less/mixins.less +15 -10
  33. data/vendor/twitter/bootstrap/less/modals.less +7 -11
  34. data/vendor/twitter/bootstrap/less/navbar.less +6 -6
  35. data/vendor/twitter/bootstrap/less/navs.less +3 -2
  36. data/vendor/twitter/bootstrap/less/pager.less +10 -9
  37. data/vendor/twitter/bootstrap/less/pagination.less +69 -12
  38. data/vendor/twitter/bootstrap/less/popovers.less +2 -2
  39. data/vendor/twitter/bootstrap/less/progress-bars.less +2 -2
  40. data/vendor/twitter/bootstrap/less/reset.less +5 -4
  41. data/vendor/twitter/bootstrap/less/responsive-767px-max.less +20 -1
  42. data/vendor/twitter/bootstrap/less/responsive-navbar.less +12 -4
  43. data/vendor/twitter/bootstrap/less/responsive.less +1 -1
  44. data/vendor/twitter/bootstrap/less/sprites.less +3 -3
  45. data/vendor/twitter/bootstrap/less/tables.less +20 -29
  46. data/vendor/twitter/bootstrap/less/thumbnails.less +1 -1
  47. data/vendor/twitter/bootstrap/less/tooltip.less +1 -1
  48. data/vendor/twitter/bootstrap/less/type.less +30 -24
  49. data/vendor/twitter/bootstrap/less/variables.less +23 -1
  50. data/vendor/twitter/bootstrap/less/wells.less +3 -3
  51. data/vendor/twitter/bootstrap/sass/_accordion.scss +1 -1
  52. data/vendor/twitter/bootstrap/sass/_alerts.scss +1 -1
  53. data/vendor/twitter/bootstrap/sass/_breadcrumbs.scss +1 -1
  54. data/vendor/twitter/bootstrap/sass/_button-groups.scss +5 -8
  55. data/vendor/twitter/bootstrap/sass/_buttons.scss +18 -17
  56. data/vendor/twitter/bootstrap/sass/_code.scss +1 -1
  57. data/vendor/twitter/bootstrap/sass/_component-animations.scss +2 -2
  58. data/vendor/twitter/bootstrap/sass/_dropdowns.scss +32 -5
  59. data/vendor/twitter/bootstrap/sass/_forms.scss +46 -14
  60. data/vendor/twitter/bootstrap/sass/_hero-unit.scss +6 -5
  61. data/vendor/twitter/bootstrap/sass/_labels-badges.scss +4 -2
  62. data/vendor/twitter/bootstrap/sass/_media.scss +55 -0
  63. data/vendor/twitter/bootstrap/sass/_mixins.scss +12 -7
  64. data/vendor/twitter/bootstrap/sass/_modals.scss +8 -11
  65. data/vendor/twitter/bootstrap/sass/_navbar.scss +8 -10
  66. data/vendor/twitter/bootstrap/sass/_navs.scss +5 -4
  67. data/vendor/twitter/bootstrap/sass/_pager.scss +10 -9
  68. data/vendor/twitter/bootstrap/sass/_pagination.scss +69 -12
  69. data/vendor/twitter/bootstrap/sass/_popovers.scss +2 -2
  70. data/vendor/twitter/bootstrap/sass/_progress-bars.scss +2 -2
  71. data/vendor/twitter/bootstrap/sass/_reset.scss +6 -4
  72. data/vendor/twitter/bootstrap/sass/_responsive-767px-max.scss +20 -1
  73. data/vendor/twitter/bootstrap/sass/_responsive-navbar.scss +12 -4
  74. data/vendor/twitter/bootstrap/sass/_scaffolding.scss +1 -3
  75. data/vendor/twitter/bootstrap/sass/_sprites.scss +3 -3
  76. data/vendor/twitter/bootstrap/sass/_tables.scss +12 -8
  77. data/vendor/twitter/bootstrap/sass/_thumbnails.scss +1 -1
  78. data/vendor/twitter/bootstrap/sass/_tooltip.scss +1 -1
  79. data/vendor/twitter/bootstrap/sass/_type.scss +30 -24
  80. data/vendor/twitter/bootstrap/sass/_variables.scss +25 -2
  81. data/vendor/twitter/bootstrap/sass/_wells.scss +3 -3
  82. data/vendor/twitter/bootstrap/sass/bootstrap.scss +2 -1
  83. data/vendor/twitter/bootstrap/sass/responsive.scss +1 -1
  84. metadata +12 -10
@@ -35,7 +35,7 @@ pre {
35
35
  background-color: #f5f5f5;
36
36
  border: 1px solid #ccc; // fallback for IE7-8
37
37
  border: 1px solid rgba(0,0,0,.15);
38
- .border-radius(4px);
38
+ .border-radius(@baseBorderRadius);
39
39
 
40
40
  // Make prettyprint styles more spaced out for readability
41
41
  &.prettyprint {
@@ -72,7 +72,7 @@
72
72
  }
73
73
 
74
74
  // Links within the dropdown menu
75
- a {
75
+ li > a {
76
76
  display: block;
77
77
  padding: 3px 20px;
78
78
  clear: both;
@@ -90,7 +90,6 @@
90
90
  .dropdown-submenu:hover > a {
91
91
  text-decoration: none;
92
92
  color: @dropdownLinkColorHover;
93
- background-color: @dropdownLinkBackgroundHover;
94
93
  #gradient > .vertical(@dropdownLinkBackgroundHover, darken(@dropdownLinkBackgroundHover, 5%));
95
94
  }
96
95
 
@@ -98,10 +97,9 @@
98
97
  // ------------
99
98
  .dropdown-menu .active > a,
100
99
  .dropdown-menu .active > a:hover {
101
- color: @dropdownLinkColorHover;
100
+ color: @dropdownLinkColorActive;
102
101
  text-decoration: none;
103
102
  outline: 0;
104
- background-color: @dropdownLinkBackgroundActive;
105
103
  #gradient > .vertical(@dropdownLinkBackgroundActive, darken(@dropdownLinkBackgroundActive, 5%));
106
104
  }
107
105
 
@@ -116,6 +114,7 @@
116
114
  .dropdown-menu .disabled > a:hover {
117
115
  text-decoration: none;
118
116
  background-color: transparent;
117
+ background-image: none; // Remove CSS gradient
119
118
  cursor: default;
120
119
  }
121
120
 
@@ -163,6 +162,7 @@
163
162
  .dropdown-submenu {
164
163
  position: relative;
165
164
  }
165
+ // Default dropdowns
166
166
  .dropdown-submenu > .dropdown-menu {
167
167
  top: 0;
168
168
  left: 100%;
@@ -176,6 +176,18 @@
176
176
  display: block;
177
177
  }
178
178
 
179
+ // Dropups
180
+ .dropup .dropdown-submenu > .dropdown-menu {
181
+ top: auto;
182
+ bottom: 0;
183
+ margin-top: 0;
184
+ margin-bottom: -2px;
185
+ -webkit-border-radius: 5px 5px 5px 0;
186
+ -moz-border-radius: 5px 5px 5px 0;
187
+ border-radius: 5px 5px 5px 0;
188
+ }
189
+
190
+ // Caret to indicate there is a submenu
179
191
  .dropdown-submenu > a:after {
180
192
  display: block;
181
193
  content: " ";
@@ -193,6 +205,21 @@
193
205
  border-left-color: @dropdownLinkColorHover;
194
206
  }
195
207
 
208
+ // Left aligned submenus
209
+ .dropdown-submenu.pull-left {
210
+ // Undo the float
211
+ // Yes, this is awkward since .pull-left adds a float, but it sticks to our conventions elsewhere.
212
+ float: none;
213
+
214
+ // Positioning the submenu
215
+ > .dropdown-menu {
216
+ left: -100%;
217
+ margin-left: 10px;
218
+ -webkit-border-radius: 6px 0 6px 6px;
219
+ -moz-border-radius: 6px 0 6px 6px;
220
+ border-radius: 6px 0 6px 6px;
221
+ }
222
+ }
196
223
 
197
224
  // Tweak nav headers
198
225
  // -----------------
@@ -206,5 +233,5 @@
206
233
  // ---------
207
234
  .typeahead {
208
235
  margin-top: 2px; // give it some space to breathe
209
- .border-radius(4px);
236
+ .border-radius(@baseBorderRadius);
210
237
  }
@@ -81,11 +81,12 @@ input[type="color"],
81
81
  display: inline-block;
82
82
  height: @baseLineHeight;
83
83
  padding: 4px 6px;
84
- margin-bottom: 9px;
84
+ margin-bottom: @baseLineHeight / 2;
85
85
  font-size: @baseFontSize;
86
86
  line-height: @baseLineHeight;
87
87
  color: @gray;
88
88
  .border-radius(@inputBorderRadius);
89
+ vertical-align: middle;
89
90
  }
90
91
 
91
92
  // Reset appearance properties for textual inputs and textarea
@@ -126,7 +127,7 @@ input[type="color"],
126
127
  border-color: rgba(82,168,236,.8);
127
128
  outline: 0;
128
129
  outline: thin dotted \9; /* IE6-9 */
129
- .box-shadow(inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(82,168,236,.6));
130
+ .box-shadow(~"inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(82,168,236,.6)");
130
131
  }
131
132
  }
132
133
 
@@ -154,9 +155,9 @@ input[type="checkbox"] {
154
155
  // Set the height of select and file controls to match text inputs
155
156
  select,
156
157
  input[type="file"] {
157
- height: 30px; /* In IE7, the height of the select element cannot be changed by height, only font-size */
158
+ height: @inputHeight; /* In IE7, the height of the select element cannot be changed by height, only font-size */
158
159
  *margin-top: 4px; /* For IE7, add top margin to align select with labels */
159
- line-height: 30px;
160
+ line-height: @inputHeight;
160
161
  }
161
162
 
162
163
  // Make select elements obey height by applying a border
@@ -210,7 +211,7 @@ input[type="checkbox"]:focus {
210
211
  // Placeholder
211
212
  // -------------------------
212
213
 
213
- // Placeholder text gets special styles because when browsers invalidate entire lines if it doesnt understand a selector
214
+ // Placeholder text gets special styles because when browsers invalidate entire lines if it doesn't understand a selector
214
215
  input,
215
216
  textarea {
216
217
  .placeholder();
@@ -223,13 +224,13 @@ textarea {
223
224
  // Indent the labels to position radios/checkboxes as hanging
224
225
  .radio,
225
226
  .checkbox {
226
- min-height: 18px; // clear the floating input if there is no label text
227
- padding-left: 18px;
227
+ min-height: @baseLineHeight; // clear the floating input if there is no label text
228
+ padding-left: 20px;
228
229
  }
229
230
  .radio input[type="radio"],
230
231
  .checkbox input[type="checkbox"] {
231
232
  float: left;
232
- margin-left: -18px;
233
+ margin-left: -20px;
233
234
  }
234
235
 
235
236
  // Move the options list down to align with labels
@@ -304,8 +305,17 @@ textarea[class*="span"],
304
305
  .controls-row {
305
306
  .clearfix(); // Clear the float from controls
306
307
  }
307
- .controls-row [class*="span"] {
308
- float: left; // Float to collapse white-space for proper grid alignment
308
+
309
+ // Float to collapse white-space for proper grid alignment
310
+ .controls-row [class*="span"],
311
+ // Redeclare the fluid grid collapse since we undo the float for inputs
312
+ .row-fluid .controls-row [class*="span"] {
313
+ float: left;
314
+ }
315
+ // Explicity set top padding on all checkboxes/radios, not just first-child
316
+ .controls-row .checkbox[class*="span"],
317
+ .controls-row .radio[class*="span"] {
318
+ padding-top: 5px;
309
319
  }
310
320
 
311
321
 
@@ -364,7 +374,8 @@ select:focus:required:invalid {
364
374
  border-color: #ee5f5b;
365
375
  &:focus {
366
376
  border-color: darken(#ee5f5b, 10%);
367
- .box-shadow(0 0 6px lighten(#ee5f5b, 20%));
377
+ @shadow: 0 0 6px lighten(#ee5f5b, 20%);
378
+ .box-shadow(@shadow);
368
379
  }
369
380
  }
370
381
 
@@ -413,16 +424,23 @@ select:focus:required:invalid {
413
424
  .input-append,
414
425
  .input-prepend {
415
426
  margin-bottom: 5px;
416
- font-size: 0;
427
+ font-size: 0; // white space collapse hack
417
428
  white-space: nowrap; // Prevent span and input from separating
418
429
 
430
+ // Reset the white space collapse hack
431
+ input,
432
+ select,
433
+ .uneditable-input,
434
+ .dropdown-menu {
435
+ font-size: @baseFontSize;
436
+ }
437
+
419
438
  input,
420
439
  select,
421
440
  .uneditable-input {
422
441
  position: relative; // placed here by default so that on :focus we can place the input above the .add-on for full border and box-shadow goodness
423
442
  margin-bottom: 0; // prevent bottom margin from screwing up alignment in stacked forms
424
443
  *margin-left: 0;
425
- font-size: @baseFontSize;
426
444
  vertical-align: top;
427
445
  .border-radius(0 @inputBorderRadius @inputBorderRadius 0);
428
446
  // Make input on top when focused so blue border and shadow always show
@@ -454,6 +472,7 @@ select:focus:required:invalid {
454
472
  border-color: @green;
455
473
  }
456
474
  }
475
+
457
476
  .input-prepend {
458
477
  .add-on,
459
478
  .btn {
@@ -461,17 +480,23 @@ select:focus:required:invalid {
461
480
  }
462
481
  .add-on:first-child,
463
482
  .btn:first-child {
483
+ // FYI, `.btn:first-child` accounts for a button group that's prepended
464
484
  .border-radius(@inputBorderRadius 0 0 @inputBorderRadius);
465
485
  }
466
486
  }
487
+
467
488
  .input-append {
468
489
  input,
469
490
  select,
470
491
  .uneditable-input {
471
492
  .border-radius(@inputBorderRadius 0 0 @inputBorderRadius);
493
+ + .btn-group .btn {
494
+ .border-radius(0 @inputBorderRadius @inputBorderRadius 0);
495
+ }
472
496
  }
473
497
  .add-on,
474
- .btn {
498
+ .btn,
499
+ .btn-group {
475
500
  margin-left: -1px;
476
501
  }
477
502
  .add-on:last-child,
@@ -479,12 +504,16 @@ select:focus:required:invalid {
479
504
  .border-radius(0 @inputBorderRadius @inputBorderRadius 0);
480
505
  }
481
506
  }
507
+
482
508
  // Remove all border-radius for inputs with both prepend and append
483
509
  .input-prepend.input-append {
484
510
  input,
485
511
  select,
486
512
  .uneditable-input {
487
513
  .border-radius(0);
514
+ + .btn-group .btn {
515
+ .border-radius(0 @inputBorderRadius @inputBorderRadius 0);
516
+ }
488
517
  }
489
518
  .add-on:first-child,
490
519
  .btn:first-child {
@@ -496,10 +525,14 @@ select:focus:required:invalid {
496
525
  margin-left: -1px;
497
526
  .border-radius(0 @inputBorderRadius @inputBorderRadius 0);
498
527
  }
528
+ .btn-group:first-child {
529
+ margin-left: 0;
530
+ }
499
531
  }
500
532
 
501
533
 
502
534
 
535
+
503
536
  // SEARCH FORM
504
537
  // -----------
505
538
 
@@ -6,6 +6,10 @@
6
6
  .hero-unit {
7
7
  padding: 60px;
8
8
  margin-bottom: 30px;
9
+ font-size: 18px;
10
+ font-weight: 200;
11
+ line-height: @baseLineHeight * 1.5;
12
+ color: @heroUnitLeadColor;
9
13
  background-color: @heroUnitBackground;
10
14
  .border-radius(6px);
11
15
  h1 {
@@ -15,10 +19,7 @@
15
19
  color: @heroUnitHeadingColor;
16
20
  letter-spacing: -1px;
17
21
  }
18
- p {
19
- font-size: 18px;
20
- font-weight: 200;
21
- line-height: @baseLineHeight * 1.5;
22
- color: @heroUnitLeadColor;
22
+ li {
23
+ line-height: @baseLineHeight * 1.5; // Reset since we specify in type.less
23
24
  }
24
25
  }
@@ -6,6 +6,8 @@
6
6
  // Base classes
7
7
  .label,
8
8
  .badge {
9
+ display: inline-block;
10
+ padding: 2px 4px;
9
11
  font-size: @baseFontSize * .846;
10
12
  font-weight: bold;
11
13
  line-height: 14px; // ensure proper line-height if floated
@@ -17,11 +19,11 @@
17
19
  }
18
20
  // Set unique padding and border-radii
19
21
  .label {
20
- padding: 1px 4px 2px;
21
22
  .border-radius(3px);
22
23
  }
23
24
  .badge {
24
- padding: 1px 9px 2px;
25
+ padding-left: 9px;
26
+ padding-right: 9px;
25
27
  .border-radius(9px);
26
28
  }
27
29
 
@@ -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
+ }
@@ -154,7 +154,7 @@
154
154
  .input-block-level {
155
155
  display: block;
156
156
  width: 100%;
157
- min-height: 30px; // Make inputs at least the height of their button counterpart
157
+ min-height: @inputHeight; // Make inputs at least the height of their button counterpart (base line-height + padding + border)
158
158
  .box-sizing(border-box); // Makes inputs behave like true block-level elements
159
159
  }
160
160
 
@@ -183,7 +183,8 @@
183
183
  .box-shadow(inset 0 1px 1px rgba(0,0,0,.075)); // Redeclare so transitions work
184
184
  &:focus {
185
185
  border-color: darken(@borderColor, 10%);
186
- .box-shadow(inset 0 1px 1px rgba(0,0,0,.075), 0 0 6px lighten(@borderColor, 20%));
186
+ @shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 6px lighten(@borderColor, 20%);
187
+ .box-shadow(@shadow);
187
188
  }
188
189
  }
189
190
  // Give a small background color for input-prepend/-append
@@ -248,12 +249,10 @@
248
249
  }
249
250
 
250
251
  // Drop shadows
251
- .box-shadow(@shadowA, @shadowB:X, ...){
252
- // Multiple shadow solution from http://toekneestuck.com/blog/2012/05/15/less-css-arguments-variable/
253
- @props: ~`"@{arguments}".replace(/[\[\]]|\,\sX/g, '')`;
254
- -webkit-box-shadow: @props;
255
- -moz-box-shadow: @props;
256
- box-shadow: @props;
252
+ .box-shadow(@shadow) {
253
+ -webkit-box-shadow: @shadow;
254
+ -moz-box-shadow: @shadow;
255
+ box-shadow: @shadow;
257
256
  }
258
257
 
259
258
  // Transitions
@@ -298,6 +297,7 @@
298
297
  -ms-transform: skewX(@x) skewY(@y); // See https://github.com/twitter/bootstrap/issues/4885
299
298
  -o-transform: skew(@x, @y);
300
299
  transform: skew(@x, @y);
300
+ -webkit-backface-visibility: hidden; // See https://github.com/twitter/bootstrap/issues/5319
301
301
  }
302
302
  .translate3d(@x, @y, @z) {
303
303
  -webkit-transform: translate3d(@x, @y, @z);
@@ -325,7 +325,7 @@
325
325
  }
326
326
 
327
327
  // Background sizing
328
- .background-size(@size){
328
+ .background-size(@size) {
329
329
  -webkit-background-size: @size;
330
330
  -moz-background-size: @size;
331
331
  -o-background-size: @size;
@@ -447,7 +447,7 @@
447
447
  background-repeat: no-repeat;
448
448
  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
449
449
  }
450
- .radial(@innerColor: #555, @outerColor: #333) {
450
+ .radial(@innerColor: #555, @outerColor: #333) {
451
451
  background-color: @outerColor;
452
452
  background-image: -webkit-gradient(radial, center center, 0, center center, 460, from(@innerColor), to(@outerColor));
453
453
  background-image: -webkit-radial-gradient(circle, @innerColor, @outerColor);
@@ -643,6 +643,11 @@
643
643
  margin-left: 0;
644
644
  }
645
645
 
646
+ // Space grid-sized controls properly if multiple per line
647
+ .controls-row [class*="span"] + [class*="span"] {
648
+ margin-left: @fluidGridGutterWidth;
649
+ }
650
+
646
651
  // generate .spanX and .offsetX
647
652
  .spanX (@gridColumns);
648
653
  .offsetX (@gridColumns);