Last change
on this file since 6c1585f was fa375fe, checked in by Ema <ema_spirova@…>, 3 years ago |
adding new components
|
-
Property mode
set to
100644
|
File size:
1.5 KB
|
Rev | Line | |
---|
[fa375fe] | 1 | //
|
---|
| 2 | // Grid system
|
---|
| 3 | // --------------------------------------------------
|
---|
| 4 |
|
---|
| 5 |
|
---|
| 6 | // Container widths
|
---|
| 7 | //
|
---|
| 8 | // Set the container width, and override it for fixed navbars in media queries.
|
---|
| 9 |
|
---|
| 10 | .container {
|
---|
| 11 | .container-fixed();
|
---|
| 12 |
|
---|
| 13 | @media (min-width: @screen-sm-min) {
|
---|
| 14 | width: @container-sm;
|
---|
| 15 | }
|
---|
| 16 | @media (min-width: @screen-md-min) {
|
---|
| 17 | width: @container-md;
|
---|
| 18 | }
|
---|
| 19 | @media (min-width: @screen-lg-min) {
|
---|
| 20 | width: @container-lg;
|
---|
| 21 | }
|
---|
| 22 | }
|
---|
| 23 |
|
---|
| 24 |
|
---|
| 25 | // Fluid container
|
---|
| 26 | //
|
---|
| 27 | // Utilizes the mixin meant for fixed width containers, but without any defined
|
---|
| 28 | // width for fluid, full width layouts.
|
---|
| 29 |
|
---|
| 30 | .container-fluid {
|
---|
| 31 | .container-fixed();
|
---|
| 32 | }
|
---|
| 33 |
|
---|
| 34 |
|
---|
| 35 | // Row
|
---|
| 36 | //
|
---|
| 37 | // Rows contain and clear the floats of your columns.
|
---|
| 38 |
|
---|
| 39 | .row {
|
---|
| 40 | .make-row();
|
---|
| 41 | }
|
---|
| 42 |
|
---|
| 43 | .row-no-gutters {
|
---|
| 44 | margin-right: 0;
|
---|
| 45 | margin-left: 0;
|
---|
| 46 |
|
---|
| 47 | [class*="col-"] {
|
---|
| 48 | padding-right: 0;
|
---|
| 49 | padding-left: 0;
|
---|
| 50 | }
|
---|
| 51 | }
|
---|
| 52 |
|
---|
| 53 |
|
---|
| 54 | // Columns
|
---|
| 55 | //
|
---|
| 56 | // Common styles for small and large grid columns
|
---|
| 57 |
|
---|
| 58 | .make-grid-columns();
|
---|
| 59 |
|
---|
| 60 |
|
---|
| 61 | // Extra small grid
|
---|
| 62 | //
|
---|
| 63 | // Columns, offsets, pushes, and pulls for extra small devices like
|
---|
| 64 | // smartphones.
|
---|
| 65 |
|
---|
| 66 | .make-grid(xs);
|
---|
| 67 |
|
---|
| 68 |
|
---|
| 69 | // Small grid
|
---|
| 70 | //
|
---|
| 71 | // Columns, offsets, pushes, and pulls for the small device range, from phones
|
---|
| 72 | // to tablets.
|
---|
| 73 |
|
---|
| 74 | @media (min-width: @screen-sm-min) {
|
---|
| 75 | .make-grid(sm);
|
---|
| 76 | }
|
---|
| 77 |
|
---|
| 78 |
|
---|
| 79 | // Medium grid
|
---|
| 80 | //
|
---|
| 81 | // Columns, offsets, pushes, and pulls for the desktop device range.
|
---|
| 82 |
|
---|
| 83 | @media (min-width: @screen-md-min) {
|
---|
| 84 | .make-grid(md);
|
---|
| 85 | }
|
---|
| 86 |
|
---|
| 87 |
|
---|
| 88 | // Large grid
|
---|
| 89 | //
|
---|
| 90 | // Columns, offsets, pushes, and pulls for the large desktop device range.
|
---|
| 91 |
|
---|
| 92 | @media (min-width: @screen-lg-min) {
|
---|
| 93 | .make-grid(lg);
|
---|
| 94 | }
|
---|
Note:
See
TracBrowser
for help on using the repository browser.