Rooba
/
nightTab
mirror of https://github.com/zombieFox/nightTab.git
1
1
Fork 0
Code Issues Packages Projects Releases Wiki Activity

showcase layout

This commit is contained in:
zombieFox 2024-07-01 18:32:32 +01:00
parent 1b03de9bae
commit 50efa844d5
1 changed files with 13 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

17
src/component/showcase/index.css
View File

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