the_role 1.6.7 → 1.6.8

Sign up to get free protection for your applications and to get access to all the features.
@@ -1,17 +0,0 @@
1
- //
2
- // Layouts
3
- // Fixed-width and fluid (with sidebar) layouts
4
- // --------------------------------------------
5
-
6
-
7
- // Container (centered, fixed-width layouts)
8
- .container {
9
- .container-fixed();
10
- }
11
-
12
- // Fluid layouts (left aligned, with sidebar, min- & max-width content)
13
- .container-fluid {
14
- padding-right: @gridGutterWidth;
15
- padding-left: @gridGutterWidth;
16
- .clearfix();
17
- }
@@ -1,41 +0,0 @@
1
- @mixin corp_font { font-family: AnyCorpFont, Arial, sans-serif }
2
- @mixin treb_ms { font-family: 'Trebuchet MS', Helvetica, sans-serif }
3
- @mixin arial { font-family: Arial, Helvetica, sans-serif }
4
- @mixin times { font-family: 'Times New Roman', Times, serif }
5
-
6
- @mixin overblock{ overflow: hidden; zoom: 1 }
7
-
8
- @mixin inline-block{
9
- display: inline-block;
10
- *display: inline;
11
- zoom: 1
12
- }
13
-
14
- /* for sliders building */
15
- @mixin nobr{ white-space: nowrap }
16
-
17
- @mixin nobr_item{
18
- @include inline-block;
19
- vertical-align: top
20
- }
21
-
22
- /* no text elements select */
23
- @mixin no_text_select{
24
- -webkit-touch-callout: none;
25
- -webkit-user-select: none;
26
- -khtml-user-select: none;
27
- -moz-user-select: none;
28
- -ms-user-select: none;
29
- -o-user-select: none;
30
- user-select: none;
31
- }
32
-
33
- /*
34
- @media screen and (-webkit-min-device-pixel-ratio:0){
35
- .class{
36
- .element{
37
- display: inline-table;
38
- }
39
- }
40
- }
41
- */
@@ -1,646 +0,0 @@
1
- // Mixins.less
2
- // Snippets of reusable CSS to develop faster and keep code readable
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
- }
19
- &:after {
20
- clear: both;
21
- }
22
- }
23
-
24
- // Webkit-style focus
25
- // ------------------
26
- .tab-focus() {
27
- // Default
28
- outline: thin dotted #333;
29
- // Webkit
30
- outline: 5px auto -webkit-focus-ring-color;
31
- outline-offset: -2px;
32
- }
33
-
34
- // Center-align a block level element
35
- // ----------------------------------
36
- .center-block() {
37
- display: block;
38
- margin-left: auto;
39
- margin-right: auto;
40
- }
41
-
42
- // IE7 inline-block
43
- // ----------------
44
- .ie7-inline-block() {
45
- *display: inline; /* IE7 inline-block hack */
46
- *zoom: 1;
47
- }
48
-
49
- // IE7 likes to collapse whitespace on either side of the inline-block elements.
50
- // Ems because we're attempting to match the width of a space character. Left
51
- // version is for form buttons, which typically come after other elements, and
52
- // right version is for icons, which come before. Applying both is ok, but it will
53
- // mean that space between those elements will be .6em (~2 space characters) in IE7,
54
- // instead of the 1 space in other browsers.
55
- .ie7-restore-left-whitespace() {
56
- *margin-left: .3em;
57
-
58
- &:first-child {
59
- *margin-left: 0;
60
- }
61
- }
62
-
63
- .ie7-restore-right-whitespace() {
64
- *margin-right: .3em;
65
-
66
- &:last-child {
67
- *margin-left: 0;
68
- }
69
- }
70
-
71
- // Sizing shortcuts
72
- // -------------------------
73
- .size(@height, @width) {
74
- width: @width;
75
- height: @height;
76
- }
77
- .square(@size) {
78
- .size(@size, @size);
79
- }
80
-
81
- // Placeholder text
82
- // -------------------------
83
- .placeholder(@color: @placeholderText) {
84
- &:-moz-placeholder {
85
- color: @color;
86
- }
87
- &:-ms-input-placeholder {
88
- color: @color;
89
- }
90
- &::-webkit-input-placeholder {
91
- color: @color;
92
- }
93
- }
94
-
95
- // Text overflow
96
- // -------------------------
97
- // Requires inline-block or block for proper styling
98
- .text-overflow() {
99
- overflow: hidden;
100
- text-overflow: ellipsis;
101
- white-space: nowrap;
102
- }
103
-
104
- // CSS image replacement
105
- // -------------------------
106
- // Source: https://github.com/h5bp/html5-boilerplate/commit/aa0396eae757
107
- .hide-text {
108
- font: 0/0 a;
109
- color: transparent;
110
- text-shadow: none;
111
- background-color: transparent;
112
- border: 0;
113
- }
114
-
115
-
116
- // FONTS
117
- // --------------------------------------------------
118
-
119
- #font {
120
- #family {
121
- .serif() {
122
- font-family: @serifFontFamily;
123
- }
124
- .sans-serif() {
125
- font-family: @sansFontFamily;
126
- }
127
- .monospace() {
128
- font-family: @monoFontFamily;
129
- }
130
- }
131
- .shorthand(@size: @baseFontSize, @weight: normal, @lineHeight: @baseLineHeight) {
132
- font-size: @size;
133
- font-weight: @weight;
134
- line-height: @lineHeight;
135
- }
136
- .serif(@size: @baseFontSize, @weight: normal, @lineHeight: @baseLineHeight) {
137
- #font > #family > .serif;
138
- #font > .shorthand(@size, @weight, @lineHeight);
139
- }
140
- .sans-serif(@size: @baseFontSize, @weight: normal, @lineHeight: @baseLineHeight) {
141
- #font > #family > .sans-serif;
142
- #font > .shorthand(@size, @weight, @lineHeight);
143
- }
144
- .monospace(@size: @baseFontSize, @weight: normal, @lineHeight: @baseLineHeight) {
145
- #font > #family > .monospace;
146
- #font > .shorthand(@size, @weight, @lineHeight);
147
- }
148
- }
149
-
150
-
151
- // FORMS
152
- // --------------------------------------------------
153
-
154
- // Block level inputs
155
- .input-block-level {
156
- display: block;
157
- width: 100%;
158
- min-height: 28px; // Make inputs at least the height of their button counterpart
159
- .box-sizing(border-box); // Makes inputs behave like true block-level elements
160
- }
161
-
162
-
163
- // Mixin for form field states
164
- .formFieldState(@textColor: #555, @borderColor: #ccc, @backgroundColor: #f5f5f5) {
165
- // Set the text color
166
- > 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
- border-color: @borderColor;
179
- &:focus {
180
- border-color: darken(@borderColor, 10%);
181
- .box-shadow(0 0 6px lighten(@borderColor, 20%));
182
- }
183
- }
184
- // Give a small background color for input-prepend/-append
185
- .input-prepend .add-on,
186
- .input-append .add-on {
187
- color: @textColor;
188
- background-color: @backgroundColor;
189
- border-color: @textColor;
190
- }
191
- }
192
-
193
-
194
-
195
- // CSS3 PROPERTIES
196
- // --------------------------------------------------
197
-
198
- // Border Radius
199
- .border-radius(@radius) {
200
- -webkit-border-radius: @radius;
201
- -moz-border-radius: @radius;
202
- border-radius: @radius;
203
- }
204
-
205
- // Drop shadows
206
- .box-shadow(@shadow) {
207
- -webkit-box-shadow: @shadow;
208
- -moz-box-shadow: @shadow;
209
- box-shadow: @shadow;
210
- }
211
-
212
- // Transitions
213
- .transition(@transition) {
214
- -webkit-transition: @transition;
215
- -moz-transition: @transition;
216
- -ms-transition: @transition;
217
- -o-transition: @transition;
218
- transition: @transition;
219
- }
220
-
221
- // Transformations
222
- .rotate(@degrees) {
223
- -webkit-transform: rotate(@degrees);
224
- -moz-transform: rotate(@degrees);
225
- -ms-transform: rotate(@degrees);
226
- -o-transform: rotate(@degrees);
227
- transform: rotate(@degrees);
228
- }
229
- .scale(@ratio) {
230
- -webkit-transform: scale(@ratio);
231
- -moz-transform: scale(@ratio);
232
- -ms-transform: scale(@ratio);
233
- -o-transform: scale(@ratio);
234
- transform: scale(@ratio);
235
- }
236
- .translate(@x, @y) {
237
- -webkit-transform: translate(@x, @y);
238
- -moz-transform: translate(@x, @y);
239
- -ms-transform: translate(@x, @y);
240
- -o-transform: translate(@x, @y);
241
- transform: translate(@x, @y);
242
- }
243
- .skew(@x, @y) {
244
- -webkit-transform: skew(@x, @y);
245
- -moz-transform: skew(@x, @y);
246
- -ms-transform: skew(@x, @y);
247
- -o-transform: skew(@x, @y);
248
- transform: skew(@x, @y);
249
- }
250
- .translate3d(@x, @y, @z) {
251
- -webkit-transform: translate(@x, @y, @z);
252
- -moz-transform: translate(@x, @y, @z);
253
- -ms-transform: translate(@x, @y, @z);
254
- -o-transform: translate(@x, @y, @z);
255
- transform: translate(@x, @y, @z);
256
- }
257
-
258
- // Backface visibility
259
- // Prevent browsers from flickering when using CSS 3D transforms.
260
- // Default value is `visible`, but can be changed to `hidden
261
- // See git pull https://github.com/dannykeane/bootstrap.git backface-visibility for examples
262
- .backface-visibility(@visibility){
263
- -webkit-backface-visibility: @visibility;
264
- -moz-backface-visibility: @visibility;
265
- -ms-backface-visibility: @visibility;
266
- backface-visibility: @visibility;
267
- }
268
-
269
- // Background clipping
270
- // Heads up: FF 3.6 and under need "padding" instead of "padding-box"
271
- .background-clip(@clip) {
272
- -webkit-background-clip: @clip;
273
- -moz-background-clip: @clip;
274
- background-clip: @clip;
275
- }
276
-
277
- // Background sizing
278
- .background-size(@size){
279
- -webkit-background-size: @size;
280
- -moz-background-size: @size;
281
- -o-background-size: @size;
282
- background-size: @size;
283
- }
284
-
285
-
286
- // Box sizing
287
- .box-sizing(@boxmodel) {
288
- -webkit-box-sizing: @boxmodel;
289
- -moz-box-sizing: @boxmodel;
290
- -ms-box-sizing: @boxmodel;
291
- box-sizing: @boxmodel;
292
- }
293
-
294
- // User select
295
- // For selecting text on the page
296
- .user-select(@select) {
297
- -webkit-user-select: @select;
298
- -moz-user-select: @select;
299
- -ms-user-select: @select;
300
- -o-user-select: @select;
301
- user-select: @select;
302
- }
303
-
304
- // Resize anything
305
- .resizable(@direction) {
306
- resize: @direction; // Options: horizontal, vertical, both
307
- overflow: auto; // Safari fix
308
- }
309
-
310
- // CSS3 Content Columns
311
- .content-columns(@columnCount, @columnGap: @gridGutterWidth) {
312
- -webkit-column-count: @columnCount;
313
- -moz-column-count: @columnCount;
314
- column-count: @columnCount;
315
- -webkit-column-gap: @columnGap;
316
- -moz-column-gap: @columnGap;
317
- column-gap: @columnGap;
318
- }
319
-
320
- // Optional hyphenation
321
- .hyphens(@mode: auto) {
322
- word-wrap: break-word;
323
- -webkit-hyphens: @mode;
324
- -moz-hyphens: @mode;
325
- -ms-hyphens: @mode;
326
- -o-hyphens: @mode;
327
- hyphens: @mode;
328
- }
329
-
330
- // Opacity
331
- .opacity(@opacity) {
332
- opacity: @opacity / 100;
333
- filter: ~"alpha(opacity=@{opacity})";
334
- }
335
-
336
-
337
-
338
- // BACKGROUNDS
339
- // --------------------------------------------------
340
-
341
- // Add an alphatransparency value to any background or border color (via Elyse Holladay)
342
- #translucent {
343
- .background(@color: @white, @alpha: 1) {
344
- background-color: hsla(hue(@color), saturation(@color), lightness(@color), @alpha);
345
- }
346
- .border(@color: @white, @alpha: 1) {
347
- border-color: hsla(hue(@color), saturation(@color), lightness(@color), @alpha);
348
- .background-clip(padding-box);
349
- }
350
- }
351
-
352
- // Gradient Bar Colors for buttons and alerts
353
- .gradientBar(@primaryColor, @secondaryColor) {
354
- #gradient > .vertical(@primaryColor, @secondaryColor);
355
- border-color: @secondaryColor @secondaryColor darken(@secondaryColor, 15%);
356
- border-color: rgba(0,0,0,.1) rgba(0,0,0,.1) fadein(rgba(0,0,0,.1), 15%);
357
- }
358
-
359
- // Gradients
360
- #gradient {
361
- .horizontal(@startColor: #555, @endColor: #333) {
362
- background-color: @endColor;
363
- background-image: -moz-linear-gradient(left, @startColor, @endColor); // FF 3.6+
364
- background-image: -ms-linear-gradient(left, @startColor, @endColor); // IE10
365
- background-image: -webkit-gradient(linear, 0 0, 100% 0, from(@startColor), to(@endColor)); // Safari 4+, Chrome 2+
366
- background-image: -webkit-linear-gradient(left, @startColor, @endColor); // Safari 5.1+, Chrome 10+
367
- background-image: -o-linear-gradient(left, @startColor, @endColor); // Opera 11.10
368
- background-image: linear-gradient(left, @startColor, @endColor); // Le standard
369
- background-repeat: repeat-x;
370
- filter: e(%("progid:DXImageTransform.Microsoft.gradient(startColorstr='%d', endColorstr='%d', GradientType=1)",@startColor,@endColor)); // IE9 and down
371
- }
372
- .vertical(@startColor: #555, @endColor: #333) {
373
- background-color: mix(@startColor, @endColor, 60%);
374
- background-image: -moz-linear-gradient(top, @startColor, @endColor); // FF 3.6+
375
- background-image: -ms-linear-gradient(top, @startColor, @endColor); // IE10
376
- background-image: -webkit-gradient(linear, 0 0, 0 100%, from(@startColor), to(@endColor)); // Safari 4+, Chrome 2+
377
- background-image: -webkit-linear-gradient(top, @startColor, @endColor); // Safari 5.1+, Chrome 10+
378
- background-image: -o-linear-gradient(top, @startColor, @endColor); // Opera 11.10
379
- background-image: linear-gradient(top, @startColor, @endColor); // The standard
380
- background-repeat: repeat-x;
381
- filter: e(%("progid:DXImageTransform.Microsoft.gradient(startColorstr='%d', endColorstr='%d', GradientType=0)",@startColor,@endColor)); // IE9 and down
382
- }
383
- .directional(@startColor: #555, @endColor: #333, @deg: 45deg) {
384
- background-color: @endColor;
385
- background-repeat: repeat-x;
386
- background-image: -moz-linear-gradient(@deg, @startColor, @endColor); // FF 3.6+
387
- background-image: -ms-linear-gradient(@deg, @startColor, @endColor); // IE10
388
- background-image: -webkit-linear-gradient(@deg, @startColor, @endColor); // Safari 5.1+, Chrome 10+
389
- background-image: -o-linear-gradient(@deg, @startColor, @endColor); // Opera 11.10
390
- background-image: linear-gradient(@deg, @startColor, @endColor); // The standard
391
- }
392
- .vertical-three-colors(@startColor: #00b3ee, @midColor: #7a43b6, @colorStop: 50%, @endColor: #c3325f) {
393
- background-color: mix(@midColor, @endColor, 80%);
394
- background-image: -webkit-gradient(linear, 0 0, 0 100%, from(@startColor), color-stop(@colorStop, @midColor), to(@endColor));
395
- background-image: -webkit-linear-gradient(@startColor, @midColor @colorStop, @endColor);
396
- background-image: -moz-linear-gradient(top, @startColor, @midColor @colorStop, @endColor);
397
- background-image: -ms-linear-gradient(@startColor, @midColor @colorStop, @endColor);
398
- background-image: -o-linear-gradient(@startColor, @midColor @colorStop, @endColor);
399
- background-image: linear-gradient(@startColor, @midColor @colorStop, @endColor);
400
- background-repeat: no-repeat;
401
- filter: e(%("progid:DXImageTransform.Microsoft.gradient(startColorstr='%d', endColorstr='%d', GradientType=0)",@startColor,@endColor)); // IE9 and down, gets no color-stop at all for proper fallback
402
- }
403
- .radial(@innerColor: #555, @outerColor: #333) {
404
- background-color: @outerColor;
405
- background-image: -webkit-gradient(radial, center center, 0, center center, 460, from(@innerColor), to(@outerColor));
406
- background-image: -webkit-radial-gradient(circle, @innerColor, @outerColor);
407
- background-image: -moz-radial-gradient(circle, @innerColor, @outerColor);
408
- background-image: -ms-radial-gradient(circle, @innerColor, @outerColor);
409
- background-image: -o-radial-gradient(circle, @innerColor, @outerColor);
410
- background-repeat: no-repeat;
411
- }
412
- .striped(@color, @angle: -45deg) {
413
- background-color: @color;
414
- 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));
415
- 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);
416
- 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);
417
- background-image: -ms-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);
418
- 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);
419
- 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);
420
- }
421
- }
422
- // Reset filters for IE
423
- .reset-filter() {
424
- filter: e(%("progid:DXImageTransform.Microsoft.gradient(enabled = false)"));
425
- }
426
-
427
-
428
-
429
- // COMPONENT MIXINS
430
- // --------------------------------------------------
431
-
432
- // Horizontal dividers
433
- // -------------------------
434
- // Dividers (basically an hr) within dropdowns and nav lists
435
- .nav-divider(@top: #e5e5e5, @bottom: @white) {
436
- // IE7 needs a set width since we gave a height. Restricting just
437
- // to IE7 to keep the 1px left/right space in other browsers.
438
- // It is unclear where IE is getting the extra space that we need
439
- // to negative-margin away, but so it goes.
440
- *width: 100%;
441
- height: 1px;
442
- margin: ((@baseLineHeight / 2) - 1) 1px; // 8px 1px
443
- *margin: -5px 0 5px;
444
- overflow: hidden;
445
- background-color: @top;
446
- border-bottom: 1px solid @bottom;
447
- }
448
-
449
- // Button backgrounds
450
- // ------------------
451
- .buttonBackground(@startColor, @endColor) {
452
- // gradientBar will set the background to a pleasing blend of these, to support IE<=9
453
- .gradientBar(@startColor, @endColor);
454
- *background-color: @endColor; /* Darken IE7 buttons by default so they stand out more given they won't have borders */
455
- .reset-filter();
456
-
457
- // in these cases the gradient won't cover the background, so we override
458
- &:hover, &:active, &.active, &.disabled, &[disabled] {
459
- background-color: @endColor;
460
- *background-color: darken(@endColor, 5%);
461
- }
462
-
463
- // IE 7 + 8 can't handle box-shadow to show active, so we darken a bit ourselves
464
- &:active,
465
- &.active {
466
- background-color: darken(@endColor, 10%) e("\9");
467
- }
468
- }
469
-
470
- // Navbar vertical align
471
- // -------------------------
472
- // Vertically center elements in the navbar.
473
- // Example: an element has a height of 30px, so write out `.navbarVerticalAlign(30px);` to calculate the appropriate top margin.
474
- .navbarVerticalAlign(@elementHeight) {
475
- margin-top: (@navbarHeight - @elementHeight) / 2;
476
- }
477
-
478
- // Popover arrows
479
- // -------------------------
480
- // For tipsies and popovers
481
- #popoverArrow {
482
- .top(@arrowWidth: 5px, @color: @black) {
483
- bottom: 0;
484
- left: 50%;
485
- margin-left: -@arrowWidth;
486
- border-left: @arrowWidth solid transparent;
487
- border-right: @arrowWidth solid transparent;
488
- border-top: @arrowWidth solid @color;
489
- }
490
- .left(@arrowWidth: 5px, @color: @black) {
491
- top: 50%;
492
- right: 0;
493
- margin-top: -@arrowWidth;
494
- border-top: @arrowWidth solid transparent;
495
- border-bottom: @arrowWidth solid transparent;
496
- border-left: @arrowWidth solid @color;
497
- }
498
- .bottom(@arrowWidth: 5px, @color: @black) {
499
- top: 0;
500
- left: 50%;
501
- margin-left: -@arrowWidth;
502
- border-left: @arrowWidth solid transparent;
503
- border-right: @arrowWidth solid transparent;
504
- border-bottom: @arrowWidth solid @color;
505
- }
506
- .right(@arrowWidth: 5px, @color: @black) {
507
- top: 50%;
508
- left: 0;
509
- margin-top: -@arrowWidth;
510
- border-top: @arrowWidth solid transparent;
511
- border-bottom: @arrowWidth solid transparent;
512
- border-right: @arrowWidth solid @color;
513
- }
514
- }
515
-
516
- // Grid System
517
- // -----------
518
-
519
- // Centered container element
520
- .container-fixed() {
521
- margin-right: auto;
522
- margin-left: auto;
523
- .clearfix();
524
- }
525
-
526
- // Table columns
527
- .tableColumns(@columnSpan: 1) {
528
- float: none; // undo default grid column styles
529
- width: ((@gridColumnWidth) * @columnSpan) + (@gridGutterWidth * (@columnSpan - 1)) - 16; // 16 is total padding on left and right of table cells
530
- margin-left: 0; // undo default grid column styles
531
- }
532
-
533
- // Make a Grid
534
- // Use .makeRow and .makeColumn to assign semantic layouts grid system behavior
535
- .makeRow() {
536
- margin-left: @gridGutterWidth * -1;
537
- .clearfix();
538
- }
539
- .makeColumn(@columns: 1, @offset: 0) {
540
- float: left;
541
- margin-left: (@gridColumnWidth * @offset) + (@gridGutterWidth * (@offset - 1)) + (@gridGutterWidth * 2);
542
- width: (@gridColumnWidth * @columns) + (@gridGutterWidth * (@columns - 1));
543
- }
544
-
545
- // The Grid
546
- #grid {
547
-
548
- .core (@gridColumnWidth, @gridGutterWidth) {
549
-
550
- .spanX (@index) when (@index > 0) {
551
- (~".span@{index}") { .span(@index); }
552
- .spanX(@index - 1);
553
- }
554
- .spanX (0) {}
555
-
556
- .offsetX (@index) when (@index > 0) {
557
- (~".offset@{index}") { .offset(@index); }
558
- .offsetX(@index - 1);
559
- }
560
- .offsetX (0) {}
561
-
562
- .offset (@columns) {
563
- margin-left: (@gridColumnWidth * @columns) + (@gridGutterWidth * (@columns + 1));
564
- }
565
-
566
- .span (@columns) {
567
- width: (@gridColumnWidth * @columns) + (@gridGutterWidth * (@columns - 1));
568
- }
569
-
570
- .row {
571
- margin-left: @gridGutterWidth * -1;
572
- .clearfix();
573
- }
574
-
575
- [class*="span"] {
576
- float: left;
577
- margin-left: @gridGutterWidth;
578
- }
579
-
580
- // Set the container width, and override it for fixed navbars in media queries
581
- .container,
582
- .navbar-fixed-top .container,
583
- .navbar-fixed-bottom .container { .span(@gridColumns); }
584
-
585
- // generate .spanX and .offsetX
586
- .spanX (@gridColumns);
587
- .offsetX (@gridColumns);
588
-
589
- }
590
-
591
- .fluid (@fluidGridColumnWidth, @fluidGridGutterWidth) {
592
-
593
- .spanX (@index) when (@index > 0) {
594
- (~".span@{index}") { .span(@index); }
595
- .spanX(@index - 1);
596
- }
597
- .spanX (0) {}
598
-
599
- .span (@columns) {
600
- width: (@fluidGridColumnWidth * @columns) + (@fluidGridGutterWidth * (@columns - 1));
601
- *width: (@fluidGridColumnWidth * @columns) + (@fluidGridGutterWidth * (@columns - 1)) - (.5 / @gridRowWidth * 100 * 1%);
602
- }
603
-
604
- .row-fluid {
605
- width: 100%;
606
- .clearfix();
607
- [class*="span"] {
608
- .input-block-level();
609
- float: left;
610
- margin-left: @fluidGridGutterWidth;
611
- *margin-left: @fluidGridGutterWidth - (.5 / @gridRowWidth * 100 * 1%);
612
- }
613
- [class*="span"]:first-child {
614
- margin-left: 0;
615
- }
616
-
617
- // generate .spanX
618
- .spanX (@gridColumns);
619
- }
620
-
621
- }
622
-
623
- .input(@gridColumnWidth, @gridGutterWidth) {
624
-
625
- .spanX (@index) when (@index > 0) {
626
- (~"input.span@{index}, textarea.span@{index}, .uneditable-input.span@{index}") { .span(@index); }
627
- .spanX(@index - 1);
628
- }
629
- .spanX (0) {}
630
-
631
- .span(@columns) {
632
- width: ((@gridColumnWidth) * @columns) + (@gridGutterWidth * (@columns - 1)) - 10;
633
- }
634
-
635
- input,
636
- textarea,
637
- .uneditable-input {
638
- margin-left: 0; // override margin-left from core grid system
639
- }
640
-
641
- // generate .spanX
642
- .spanX (@gridColumns);
643
-
644
- }
645
-
646
- }