showcase layout

This commit is contained in:
zombieFox 2024-07-01 18:32:32 +01:00
parent 1b03de9bae
commit 50efa844d5

View File

@ -1,5 +1,9 @@
:root {
--showcase-padding: 4em;
}
.showcase {
padding: 4em;
padding: var(--showcase-padding);
width: 100vw;
min-height: 100vh;
z-index: var(--z-index-showcase);
@ -7,16 +11,21 @@
.showcase {
display: grid;
gap: 4em;
grid-template-columns: 1fr 3fr;
gap: var(--showcase-padding);
grid-template-columns: 2fr 5fr;
grid-template-areas:
"side content"
"side content";
justify-items: center;
}
.showcase-side {
grid-area: side;
position: sticky;
top: var(--showcase-padding);
height: fit-content;
}
.showcase-content {
grid-area: content;
max-width: 50em;
}