Files
website-11ty-hamburg.stefan…/src/assets/styles/layout/base.css
2021-12-31 08:35:34 +01:00

68 lines
1.2 KiB
CSS

/** Base */
.page-grid {
display: grid;
grid-template-columns: var(--grid-fullsize);
grid-template-rows: var(--grid-row) auto var(--grid-row);
min-height: 100vh;
}
.page-content {
display: grid;
grid-auto-rows: auto;
grid-column: 1 / -1;
grid-row: 1 / -1;
grid-template-columns: var(--grid-fullsize);
grid-template-rows: var(--grid-row);
margin-block-end: var(--grid-row);
row-gap: clamp(1.5rem, var(--space-55), 6rem);
}
.page-title {
align-items: center;
display: flex;
font-size: var(--font-size-4);
grid-column: 1 / 3;
grid-row: 1 / 3;
justify-content: flex-end;
margin: 0;
padding-inline-end: calc(var(--space-55) / 2);
transform: rotate(180deg);
writing-mode: vertical-lr;
}
@media (--tablet) {
.page-title {
grid-column: 1;
}
}
.page-title-link {
font-weight: var(--font-weight-black);
text-decoration: none;
}
.svg-icons {
left: -9999px;
position: absolute;
top: -9999px;
}
/** Narrow */
.layout-narrow {
grid-column: 3 / -3;
grid-row: 1 / 3;
padding-block-start: calc(var(--space-55) / 2);
}
@media (--tablet) {
.layout-narrow {
grid-column: 6 / -6;
}
}
@media (--desktop) {
.layout-narrow {
grid-column: 7 / -7;
}
}