// ############################################################ // Page Grid // ############################################################
body {
min-width: 320px; margin-top: 15px; display: grid; grid-template-columns: 15px auto 15px; grid-template-rows: 30px min-content auto min-content min-content; grid-column-gap: 0; grid-row-gap: 1rem; grid-template-areas: ". nav-navigation ." ". header-banner ." ". main ." ". page-sidebar ." ". footer-contentinfo .";
}
// ============================================================ // Page Grid Areas // ============================================================
header-banner {
grid-area: header-banner;
}
nav-navigation {
grid-area: nav-navigation;
}
main {
grid-area: main;
}
page-sidebar {
grid-area: page-sidebar;
}
footer-contentinfo {
grid-area: footer-contentinfo;
}
// ============================================================ // Page Grid Mixins // ============================================================
// ———————————————————— // Default // ———————————————————— @mixin page-default() {}