html, body {
height: 100%;
}
#main-container {
display: flex;
flex-direction: column;
align-items: stretch;
min-height: 100%;
> main {
flex-grow: 1;
}
}
// Fixed container
.ct-container {
// max-width: 1290px;
max-width: var(--maxSiteWidth);
margin: 0 auto;
@include media-breakpoint-up (lg) {
width: 90%;
}
@include media-breakpoint-only (md) {
width: 85%;
}
@include media-breakpoint-down (sm) {
width: 90%;
}
}
// Fluid container
.ct-container-fluid {
width: 100%;
margin: 0 auto;
@include media-breakpoint-up (lg) {
padding-left: 30px;
padding-right: 30px;
}
@include media-breakpoint-down (md) {
padding-left: 20px;
padding-right: 20px;
}
}
// Boundless container
.ct-container-boundless {
width: 100%;
}
// Sidebar
@include media-breakpoint-up (lg) {
[data-sidebar] {
display: grid;
grid-column-gap: 4%;
}
[data-sidebar="right"] {
grid-template-columns: auto var(--sidebarWidth);
}
[data-sidebar="left"] {
grid-template-columns: var(--sidebarWidth) auto;
> section {
order: 2;
}
> aside {
order: 1;
}
}
}
// Main page container spacing
body:not(.main-content-area-boundless) {
.content-area {
padding-top: var(--contentAreaSpacing);
padding-bottom: var(--contentAreaSpacing);
}
}