privacyguides.org/_sass/bootstrap/_grid.scss

70 lines
1.5 KiB
SCSS
Raw Normal View History

2020-04-28 17:09:22 -04:00
// Container widths
//
// Set the container width, and override it for fixed navbars in media queries.
@if $enable-grid-classes {
2020-04-28 17:14:23 -04:00
// Single container class with breakpoint max-widths
2020-04-28 17:09:22 -04:00
.container {
@include make-container();
@include make-container-max-widths();
}
2020-04-28 17:14:23 -04:00
// 100% wide container at all breakpoints
2020-04-28 17:09:22 -04:00
.container-fluid {
@include make-container();
}
2020-04-28 17:14:23 -04:00
// Responsive containers that are 100% wide until a breakpoint
@each $breakpoint, $container-max-width in $container-max-widths {
.container-#{$breakpoint} {
@extend .container-fluid;
}
@include media-breakpoint-up($breakpoint, $grid-breakpoints) {
%responsive-container-#{$breakpoint} {
max-width: $container-max-width;
}
@each $name, $width in $grid-breakpoints {
@if ($container-max-width > $width or $breakpoint == $name) {
.container#{breakpoint-infix($name, $grid-breakpoints)} {
@extend %responsive-container-#{$breakpoint};
}
}
}
}
}
2020-04-28 17:09:22 -04:00
}
2020-04-28 17:14:23 -04:00
2020-04-28 17:09:22 -04:00
// Row
//
2020-04-28 17:14:23 -04:00
// Rows contain your columns.
2020-04-28 17:09:22 -04:00
@if $enable-grid-classes {
.row {
@include make-row();
}
// Remove the negative margin from default .row, then the horizontal padding
// from all immediate children columns (to prevent runaway style inheritance).
.no-gutters {
margin-right: 0;
margin-left: 0;
> .col,
> [class*="col-"] {
padding-right: 0;
padding-left: 0;
}
}
}
// Columns
//
// Common styles for small and large grid columns
@if $enable-grid-classes {
@include make-grid-columns();
}