12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091929394 |
- //
- // Grid system
- // --------------------------------------------------
- // Container widths
- //
- // Set the container width, and override it for fixed navbars in media queries.
- .container {
- .container-fixed();
- @media (min-width: @screen-sm-min) {
- width: @container-sm;
- }
- @media (min-width: @screen-md-min) {
- width: @container-md;
- }
- @media (min-width: @screen-lg-min) {
- width: @container-lg;
- }
- }
- // Fluid container
- //
- // Utilizes the mixin meant for fixed width containers, but without any defined
- // width for fluid, full width layouts.
- .container-fluid {
- .container-fixed();
- }
- // Row
- //
- // Rows contain and clear the floats of your columns.
- .row {
- .make-row();
- }
- .row-no-gutters {
- margin-right: 0;
- margin-left: 0;
- [class*="col-"] {
- padding-right: 0;
- padding-left: 0;
- }
- }
- // Columns
- //
- // Common styles for small and large grid columns
- .make-grid-columns();
- // Extra small grid
- //
- // Columns, offsets, pushes, and pulls for extra small devices like
- // smartphones.
- .make-grid(xs);
- // Small grid
- //
- // Columns, offsets, pushes, and pulls for the small device range, from phones
- // to tablets.
- @media (min-width: @screen-sm-min) {
- .make-grid(sm);
- }
- // Medium grid
- //
- // Columns, offsets, pushes, and pulls for the desktop device range.
- @media (min-width: @screen-md-min) {
- .make-grid(md);
- }
- // Large grid
- //
- // Columns, offsets, pushes, and pulls for the large desktop device range.
- @media (min-width: @screen-lg-min) {
- .make-grid(lg);
- }
|