aboutsummaryrefslogtreecommitdiff
path: root/static/styles/risotto/layout.css
diff options
context:
space:
mode:
authorFuwn <[email protected]>2026-03-01 16:20:51 -0800
committerFuwn <[email protected]>2026-03-01 16:21:02 -0800
commiteae5d24d9e79e59a19d4721caaeaa0ca650ecb33 (patch)
tree1b685bb248e051dfa26d2bfdebe6689402dd93c5 /static/styles/risotto/layout.css
parentchore(tooling): remove legacy eslint and prettier (diff)
downloaddue.moe-eae5d24d9e79e59a19d4721caaeaa0ca650ecb33.tar.xz
due.moe-eae5d24d9e79e59a19d4721caaeaa0ca650ecb33.zip
chore(biome): drop formatter style overrides
Diffstat (limited to 'static/styles/risotto/layout.css')
-rw-r--r--static/styles/risotto/layout.css61
1 files changed, 32 insertions, 29 deletions
diff --git a/static/styles/risotto/layout.css b/static/styles/risotto/layout.css
index 78423b40..99e99656 100644
--- a/static/styles/risotto/layout.css
+++ b/static/styles/risotto/layout.css
@@ -1,57 +1,60 @@
/* 1rem = 16px by default */
.page {
- max-width: 64rem;
- margin: 1rem auto;
- display: grid;
- grid-template-areas:
- "header"
- "body"
- "aside"
- "footer";
- grid-template-columns: minmax(0, 1fr); /* https://css-tricks.com/preventing-a-grid-blowout/ */
- grid-row-gap: 2rem;
+ max-width: 64rem;
+ margin: 1rem auto;
+ display: grid;
+ grid-template-areas:
+ "header"
+ "body"
+ "aside"
+ "footer";
+ grid-template-columns: minmax(
+ 0,
+ 1fr
+ ); /* https://css-tricks.com/preventing-a-grid-blowout/ */
+ grid-row-gap: 2rem;
}
@media (min-width: 45rem) {
- .page {
- grid-template-areas:
- "header header"
- "body aside"
- "footer footer";
- grid-template-columns: minmax(0, 1fr) 15rem;
- grid-column-gap: 2rem;
- }
+ .page {
+ grid-template-areas:
+ "header header"
+ "body aside"
+ "footer footer";
+ grid-template-columns: minmax(0, 1fr) 15rem;
+ grid-column-gap: 2rem;
+ }
}
/* Header */
.page__header {
- grid-area: header;
- display: flex;
+ grid-area: header;
+ display: flex;
}
.page__logo {
- flex-shrink: 0;
+ flex-shrink: 0;
}
.page__nav {
- flex-grow: 1;
+ flex-grow: 1;
}
/* Body + aside */
.page__body {
- grid-area: body;
- background-color: var(--off-bg);
- box-shadow: 0 0 0 1rem var(--off-bg);
- overflow-wrap: break-word;
+ grid-area: body;
+ background-color: var(--off-bg);
+ box-shadow: 0 0 0 1rem var(--off-bg);
+ overflow-wrap: break-word;
}
.page__aside {
- grid-area: aside;
- color: var(--off-fg);
+ grid-area: aside;
+ color: var(--off-fg);
}
/* Footer */
.page__footer {
- grid-area: footer;
+ grid-area: footer;
}