trentuna/asw
8
0
Fork 0
Code Issues 1 Pull requests Projects Releases Packages Wiki Activity Actions

Compare commits

base: trentuna:376bfb2364f94efef6d1ef6cbbbd9c04b4386f72
Branches Tags
trentuna:main
..
compare: trentuna:5deaa22e3895dfe679cb8c56d49f41cad87c2680
Branches Tags
trentuna:main

No commits in common. "376bfb2364f94efef6d1ef6cbbbd9c04b4386f72" and "5deaa22e3895dfe679cb8c56d49f41cad87c2680" have entirely different histories.
376bfb2364 ... 5deaa22e38

9 changed files with 59 additions and 54 deletions
Download patch file Download diff file Expand all files Collapse all files

7
assets/css/main.css → assets/css/asw.css
View file

@ -11,7 +11,7 @@
/* 2. Framework layers */ /* 2. Framework layers */
@import "./layers/00-reset.css"; @import "./layers/00-reset.css";
@import "./layers/01-asw.css"; @import "./layers/01-tokens.css";
@import "./layers/02-semantic.css"; @import "./layers/02-semantic.css";
@import "./layers/03-components.css"; @import "./layers/03-components.css";
@import "./layers/04-data-attrs.css"; @import "./layers/04-data-attrs.css";
@ -21,3 +21,8 @@
@import "./layers/08-layout.css"; @import "./layers/08-layout.css";
@import "./layers/08a-paper.css"; @import "./layers/08a-paper.css";
@import "./layers/09-landing.css"; @import "./layers/09-landing.css";
/* 3. ASW theme overrides — edit here to retheme */
:root {
/* Override Open Props primitives or ASW semantics here */
}

4
assets/css/layers/01-asw.css → assets/css/layers/01-tokens.css
View file

@ -1,8 +1,8 @@
/** /**
* 01-asw.css * 01-tokens.css
* ASW semantic layer — builds on Open Props * ASW semantic layer — builds on Open Props
* *
* Open Props (imported in main.css) provides the base scales: * Open Props (imported below) provides the base scales:
* --gray-0…15, --green-0…12, --blue-0…12, --red-0…12, --yellow-0…12 * --gray-0…15, --green-0…12, --blue-0…12, --red-0…12, --yellow-0…12
* --size-1…15, --font-size-0…8, --font-weight-1…9 * --size-1…15, --font-size-0…8, --font-weight-1…9
* --font-lineheight-0…5, --radius-1…6, --shadow-1…6 * --font-lineheight-0…5, --radius-1…6, --shadow-1…6

6
assets/css/layers/02-semantic.css
View file

@ -184,8 +184,8 @@ blockquote {
margin: var(--type-space) 0; margin: var(--type-space) 0;
padding: var(--space-4); padding: var(--space-4);
border-right: none; border-right: none;
border-left: var(--space-1) solid var(--border); border-left: 0.25rem solid var(--border);
border-inline-start: var(--space-1) solid var(--border); border-inline-start: 0.25rem solid var(--border);
border-inline-end: none; border-inline-end: none;
} }
@ -200,7 +200,7 @@ hr {
height: 0; height: 0;
margin: var(--type-space) 0; margin: var(--type-space) 0;
border: 0; border: 0;
border-top: var(--border-width) solid var(--border); border-top: 1px solid var(--border);
color: inherit; color: inherit;
} }

34
assets/css/layers/03-components.css
View file

@ -263,10 +263,10 @@ body > nav {
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
align-items: center; align-items: center;
padding-top: var(--space-5); padding-top: 1.5rem;
padding-bottom: var(--space-5); padding-bottom: 1.5rem;
margin-bottom: var(--space-6); margin-bottom: 2rem;
border-bottom: var(--border-width) solid var(--border); border-bottom: 1px solid var(--border);
} }
body > nav strong { body > nav strong {
@ -322,7 +322,7 @@ body > nav a[aria-current="page"] {
body > nav { body > nav {
flex-direction: column; flex-direction: column;
align-items: flex-start; align-items: flex-start;
gap: var(--space-2); gap: 0.5rem;
} }
body > nav ul:last-child { body > nav ul:last-child {
@ -452,11 +452,11 @@ article {
border: 1px solid var(--border); border: 1px solid var(--border);
border-radius: var(--radius-md); border-radius: var(--radius-md);
padding: 1rem 1.25rem; padding: 1rem 1.25rem;
margin: var(--space-3) 0; margin: 0.75rem 0;
} }
article > header { article > header {
margin: 0 0 var(--space-2) 0; margin: 0 0 0.5rem 0;
padding: 0 0 0.4rem 0; padding: 0 0 0.4rem 0;
border-bottom: 1px solid var(--border-subtle); border-bottom: 1px solid var(--border-subtle);
border-top: none; border-top: none;
@ -495,12 +495,12 @@ article header h3 {
/* Wide container: spacious layout */ /* Wide container: spacious layout */
@container article (min-width: 600px) { @container article (min-width: 600px) {
article { article {
padding: var(--space-5) var(--space-6); padding: 1.5rem 2rem;
} }
article > header { article > header {
margin-bottom: var(--space-3); margin-bottom: 0.75rem;
padding-bottom: var(--space-2); padding-bottom: 0.5rem;
} }
} }
@ -512,7 +512,7 @@ dt {
font-size: var(--text-sm); font-size: var(--text-sm);
font-weight: 500; font-weight: 500;
color: var(--text-2); color: var(--text-2);
margin-top: var(--space-3); margin-top: 0.75rem;
} }
dd { dd {
@ -530,15 +530,15 @@ article dt:first-of-type {
/* ── Sections ──────────────────────────────────────────────────────────*/ /* ── Sections ──────────────────────────────────────────────────────────*/
section + section { section + section {
padding-top: var(--space-5); padding-top: 1.5rem;
border-top: var(--border-width) solid var(--border-subtle); border-top: 1px solid var(--border-subtle);
} }
hgroup p { hgroup p {
font-family: var(--font-mono); font-family: var(--font-mono);
font-size: var(--text-sm); font-size: var(--text-sm);
color: var(--text-3); color: var(--text-3);
margin-top: var(--space-1); margin-top: 0.25rem;
} }
/* Section intro: hgroup as centered subtitle block */ /* Section intro: hgroup as centered subtitle block */
@ -562,9 +562,9 @@ article[data-role="card"] header h3 {
body > footer, body > footer,
footer:last-child { footer:last-child {
margin-top: 3rem; margin-top: 3rem;
padding-top: var(--space-5); padding-top: 1.5rem;
padding-bottom: var(--space-6); padding-bottom: 2rem;
border-top: var(--border-width) solid var(--border); border-top: 1px solid var(--border);
font-family: var(--font-mono); font-family: var(--font-mono);
font-size: var(--text-xs); font-size: var(--text-xs);
color: var(--text-3); color: var(--text-3);

28
assets/css/layers/04-data-attrs.css
View file

@ -16,17 +16,17 @@
align-items: center; align-items: center;
justify-content: space-between; justify-content: space-between;
background: var(--surface-1); background: var(--surface-1);
border: var(--border-width) solid var(--border); border: 1px solid var(--border);
border-radius: var(--radius-md); border-radius: var(--radius-md);
padding: var(--space-3) var(--space-4); padding: 0.75rem 1rem;
font-family: var(--font-mono); font-family: var(--font-mono);
font-size: var(--text-sm); font-size: var(--text-sm);
margin: var(--space-5) 0; margin: 1.5rem 0;
} }
[data-role="command-box"] .prefix { [data-role="command-box"] .prefix {
color: var(--text-3); color: var(--text-3);
margin-right: var(--space-2); margin-right: 0.5rem;
user-select: none; user-select: none;
} }
@ -39,7 +39,7 @@
font-family: var(--font-mono); font-family: var(--font-mono);
font-size: 0.9em; font-size: 0.9em;
text-decoration: none; text-decoration: none;
border-bottom: var(--border-width) dotted var(--border); border-bottom: 1px dotted var(--border);
transition: border-color var(--ease); transition: border-color var(--ease);
} }
@ -186,7 +186,7 @@
══════════════════════════════════════════════════════════════════════════ */ ══════════════════════════════════════════════════════════════════════════ */
[data-role="timeline"] { [data-role="timeline"] {
border-left: var(--border-width) solid var(--border); border-left: 1px solid var(--border);
padding-left: 1.5em; padding-left: 1.5em;
margin: 1.5em 0; margin: 1.5em 0;
} }
@ -207,7 +207,7 @@
[data-role="status-card"] { [data-role="status-card"] {
padding: 1.25em; padding: 1.25em;
background: var(--surface-card); background: var(--surface-card);
border: var(--border-width) solid var(--border); border: 1px solid var(--border);
border-radius: var(--radius-md); border-radius: var(--radius-md);
margin: 1em 0; margin: 1em 0;
} }
@ -234,7 +234,7 @@
[data-tooltip] { [data-tooltip] {
position: relative; position: relative;
cursor: help; cursor: help;
border-bottom: var(--border-width) dotted var(--text-dim); border-bottom: 1px dotted var(--text-dim);
} }
[data-tooltip]::after { [data-tooltip]::after {
@ -246,7 +246,7 @@
padding: 0.4rem 0.75rem; padding: 0.4rem 0.75rem;
background: var(--surface-1); background: var(--surface-1);
color: var(--text); color: var(--text);
border: var(--border-width) solid var(--border); border: 1px solid var(--border);
border-radius: var(--radius-md); border-radius: var(--radius-md);
font-family: var(--font-mono); font-family: var(--font-mono);
font-size: var(--text-xs); font-size: var(--text-xs);
@ -326,9 +326,9 @@
align-items: center; align-items: center;
font-family: var(--font-mono); font-family: var(--font-mono);
font-size: var(--text-sm); font-size: var(--text-sm);
margin-bottom: var(--space-6); margin-bottom: 2rem;
padding-bottom: var(--space-3); padding-bottom: 0.75rem;
border-bottom: var(--border-width) solid var(--border); border-bottom: 1px solid var(--border);
} }
[data-subnav] a { [data-subnav] a {
@ -361,7 +361,7 @@
font-family: var(--font-mono); font-family: var(--font-mono);
font-size: var(--text-sm); font-size: var(--text-sm);
background: var(--surface-1); background: var(--surface-1);
border: var(--border-width) solid var(--border); border: 1px solid var(--border);
border-radius: var(--radius-md); border-radius: var(--radius-md);
overflow-x: auto; overflow-x: auto;
margin: var(--space-5) 0; margin: var(--space-5) 0;
@ -469,7 +469,7 @@
[data-redacted="reveal"]:focus { [data-redacted="reveal"]:focus {
background: var(--surface-card); background: var(--surface-card);
color: var(--text); color: var(--text);
outline: var(--border-width) solid var(--border); outline: 1px solid var(--border);
border-radius: var(--radius-sm); border-radius: var(--radius-sm);
user-select: text; user-select: text;
} }

12
assets/css/layers/05-utilities.css
View file

@ -52,7 +52,7 @@
[data-layout="grid-2"] { [data-layout="grid-2"] {
display: grid; display: grid;
grid-template-columns: 1fr 1fr; grid-template-columns: 1fr 1fr;
gap: var(--space-4); gap: 1rem;
} }
@media (--md-n-below) { @media (--md-n-below) {
@ -65,7 +65,7 @@
[data-layout="card-grid"] { [data-layout="card-grid"] {
display: flex; display: flex;
flex-wrap: wrap; flex-wrap: wrap;
gap: var(--space-5); gap: 1.5rem;
} }
[data-layout="card-grid"] > * { [data-layout="card-grid"] > * {
@ -89,9 +89,9 @@
[data-layout="stats"] > * { [data-layout="stats"] > * {
flex: 1 1 0; flex: 1 1 0;
min-width: 5rem; min-width: 5rem;
padding: var(--space-3) 0; padding: 0.75rem 0;
text-align: center; text-align: center;
border-right: var(--border-width) solid var(--border-subtle); border-right: 1px solid var(--border-subtle);
} }
[data-layout="stats"] > *:last-child { [data-layout="stats"] > *:last-child {
@ -120,7 +120,7 @@
[data-layout="stats"] > * { [data-layout="stats"] > * {
flex-basis: 33%; flex-basis: 33%;
border-right: none; border-right: none;
border-bottom: var(--border-width) solid var(--border-subtle); border-bottom: 1px solid var(--border-subtle);
} }
} }
@ -212,7 +212,7 @@ dl[data-layout="inline"] dd {
width: 1.5rem; width: 1.5rem;
height: 1.5rem; height: 1.5rem;
margin: -0.75rem 0 0 -0.75rem; margin: -0.75rem 0 0 -0.75rem;
border: var(--outline-width) solid var(--text-3); border: 2px solid var(--text-3);
border-top-color: transparent; border-top-color: transparent;
border-radius: 50%; border-radius: 50%;
} }

8
assets/css/layers/06-charts.css
View file

@ -44,12 +44,12 @@
/* Layout */ /* Layout */
--chart-height: 200px; /* column chart area height */ --chart-height: 200px; /* column chart area height */
--chart-bar-size: var(--space-6); /* column bar width / bar chart bar height */ --chart-bar-size: 2rem; /* column bar width / bar chart bar height */
--chart-gap: 6px; /* spacing between data points */ --chart-gap: 6px; /* spacing between data points */
/* Axis / labels */ /* Axis / labels */
--chart-axis: var(--border); --chart-axis: var(--border);
--chart-axis-width: var(--outline-width); --chart-axis-width: 2px;
--chart-label: var(--text-3); --chart-label: var(--text-3);
--chart-label-size: var(--text-xs); --chart-label-size: var(--text-xs);
@ -406,7 +406,7 @@
color-mix(in oklch, var(--chart-color-1), transparent 80%) 0%, color-mix(in oklch, var(--chart-color-1), transparent 80%) 0%,
transparent 60% transparent 60%
); );
border-block-start: var(--outline-width) solid var(--chart-color-1); border-block-start: 2px solid var(--chart-color-1);
position: relative; position: relative;
} }
@ -422,7 +422,7 @@
block-size: 8px; block-size: 8px;
border-radius: 50%; border-radius: 50%;
background: var(--chart-color-1); background: var(--chart-color-1);
border: var(--outline-width) solid var(--surface); border: 2px solid var(--surface);
z-index: 1; z-index: 1;
} }

12
assets/css/layers/08-layout.css
View file

@ -34,7 +34,7 @@ body {
[data-layout="hero"] { [data-layout="hero"] {
text-align: center; text-align: center;
padding: var(--space-8) var(--space-5); padding: var(--space-8) var(--space-5);
border-bottom: var(--border-width) solid var(--border); border-bottom: 1px solid var(--border);
} }
/* ── Install snippet ────────────────────────────────────────────────── */ /* ── Install snippet ────────────────────────────────────────────────── */
@ -42,7 +42,7 @@ body {
[data-layout="install"] { [data-layout="install"] {
display: inline-block; display: inline-block;
background: var(--surface-1); background: var(--surface-1);
border: var(--border-width) solid var(--border); border: 1px solid var(--border);
border-radius: var(--radius-md); border-radius: var(--radius-md);
padding: var(--space-2) var(--space-4); padding: var(--space-2) var(--space-4);
font-family: var(--font-mono); font-family: var(--font-mono);
@ -456,7 +456,7 @@ main[data-layout="prose"],
height: 0.65rem; height: 0.65rem;
border-radius: 50%; border-radius: 50%;
background: var(--accent); background: var(--accent);
border: var(--outline-width) solid var(--surface); border: 2px solid var(--surface);
box-shadow: 0 0 0 1px var(--accent); box-shadow: 0 0 0 1px var(--accent);
} }
@ -500,7 +500,7 @@ main[data-layout="prose"],
background: var(--surface); background: var(--surface);
color: var(--text); color: var(--text);
font-family: var(--font-ui); font-family: var(--font-ui);
font-size: var(--text-base); font-size: 1rem;
line-height: var(--leading); line-height: var(--leading);
} }
@ -515,7 +515,7 @@ main[data-layout="prose"],
[data-layout="report"] > header { [data-layout="report"] > header {
padding-top: var(--space-6); padding-top: var(--space-6);
padding-bottom: var(--space-5); padding-bottom: var(--space-5);
border-bottom: var(--outline-width) solid var(--border); border-bottom: 2px solid var(--border);
margin-bottom: var(--space-6); margin-bottom: var(--space-6);
} }
@ -530,7 +530,7 @@ main[data-layout="prose"],
} }
[data-layout="report"] > footer { [data-layout="report"] > footer {
border-top: var(--border-width) solid var(--border); border-top: 1px solid var(--border);
padding-top: var(--space-4); padding-top: var(--space-4);
padding-bottom: var(--space-4); padding-bottom: var(--space-4);
font-size: var(--text-sm); font-size: var(--text-sm);

2
deploy.sh
View file

@ -4,6 +4,6 @@ set -euo pipefail
cd ~/projects/asw cd ~/projects/asw
git pull origin main --ff-only git pull origin main --ff-only
npm ci --prefer-offline 2>/dev/null npm ci --prefer-offline 2>/dev/null
npx postcss assets/css/main.css -o assets/css/asw-built.css npx postcss assets/css/asw.css -o assets/css/asw-built.css
hugo hugo
echo "[$(date -u +%Y-%m-%dT%H:%M:%SZ)] Deploy complete" >> /tmp/asw-deploy.log echo "[$(date -u +%Y-%m-%dT%H:%M:%SZ)] Deploy complete" >> /tmp/asw-deploy.log