43 lines
941 B
SCSS
43 lines
941 B
SCSS
|
.site-container {
|
||
|
|
display: grid;
|
||
|
|
grid-template-columns: 2.5% 1fr 2.5%;
|
||
|
|
grid-template-rows: auto 1fr 2.5%;
|
||
|
|
grid-template-areas:
|
||
|
|
"header header header"
|
||
|
|
"page-container page-container page-container"
|
||
|
|
"footer footer footer";
|
||
|
|
min-block-size: calc(100vh - 4em);
|
||
|
|
border-block-start: 0;
|
||
|
|
|
||
|
|
@include mq("large") {
|
||
|
|
margin-block-end: 2em;
|
||
|
|
grid-template-areas:
|
||
|
|
"header header header"
|
||
|
|
". page-container ."
|
||
|
|
"footer footer footer";
|
||
|
|
border: 2px solid black;
|
||
|
|
margin-inline: 2em;
|
||
|
|
}
|
||
|
|
|
||
|
|
&--homepage {
|
||
|
|
align-items: center;
|
||
|
|
grid-template-rows: auto 2.5%;
|
||
|
|
grid-template-areas:
|
||
|
|
"page-container page-container page-container"
|
||
|
|
"footer footer footer";
|
||
|
|
margin: 2em;
|
||
|
|
|
||
|
|
@include mq("large") {
|
||
|
|
border: 2px solid black;
|
||
|
|
grid-template-areas:
|
||
|
|
". page-container ."
|
||
|
|
"footer footer footer";
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
&--list,
|
||
|
|
&--section {
|
||
|
|
align-items: center;
|
||
|
|
}
|
||
|
|
}
|