Fix minimum grid and maximum header width

This commit is contained in:
arne 2022-02-26 13:59:39 +01:00
commit 51243c2503

View file

@ -70,8 +70,9 @@ a {
.ten-print { .ten-print {
width: $logo-size * 1px; width: $logo-size * 1px;
height: $logo-size * 1px; height: auto;
display: block; display: block;
max-width: 100%;
path { path {
stroke: $highlight; stroke: $highlight;
@ -83,13 +84,14 @@ a {
main { main {
display: grid; display: grid;
width: 100%;
max-width: 960px; max-width: 960px;
margin: 48px; padding: 48px;
grid-gap: 32px; grid-gap: 32px;
grid-template-columns: repeat(4, minmax(0, 1fr)); grid-template-columns: repeat(4, minmax(0, 1fr));
grid-template-rows: auto minmax(0, 1fr) auto; // grow the content area, shrink the other ones grid-template-rows: auto minmax(0, 1fr) auto; // grow the content area, shrink the other ones
grid-template-areas: grid-template-areas:
"header header header header" "header empty empty empty"
"aside content content content" "aside content content content"
"footer footer footer footer"; "footer footer footer footer";
grid-auto-flow: dense; grid-auto-flow: dense;
@ -116,7 +118,7 @@ main {
main { main {
max-width: unset; max-width: unset;
margin: 32px; padding: 32px;
grid-template-columns: minmax(0, 1fr); grid-template-columns: minmax(0, 1fr);
grid-template-areas: grid-template-areas:
"header" "header"
@ -195,7 +197,7 @@ footer {
.home { .home {
grid-template-areas: grid-template-areas:
"header header header header" "header empty empty empty"
"aside aside aside aside" "aside aside aside aside"
"footer footer footer footer"; "footer footer footer footer";