mirror of
https://github.com/tiennm99/iammiti99.git
synced 2026-10-12 22:14:44 +00:00
tiennm99
401296a468
Address the 17 findings from the 260510 UI/UX audit (10 shipped in the
review pass, 7 deferred items + Q4 noscript guard tackled here).
A11y
- sakura accent #d4456a -> #c93f63 (4.04 -> 4.49 vs bg, WCAG AA)
- koi accent #c8521e -> #bd4c1c (4.17 -> 4.63 vs bg, WCAG AA)
- /themes/, /variants/ wrapped in <section aria-labelledby> keyed
to the page <h1>; variant cards demoted from <section> to <article>
- prior pass: koi-light --bonsai-muted #8a6f5c -> #7a5e48; gallery
card headings <h3> -> <h2>; theme-toggle 36px -> 44px hit target;
reduced-motion extended to .theme-toggle and :active
Polish
- favicon system: opt-in params.faviconSvg + params.appleTouchIcon
with conditional <link> tags; existing favicon path unchanged
- .link:hover adds subtle accent tint via color-mix(in oklab, ...)
alongside existing border + 1px lift
- theme toggle hidden via <noscript> when JS disabled (button is JS-only)
- prior pass: inline FOUC-blocking script in <head>; avatar SVG uses
currentColor + safeCSS; fallback external-link icon matches Lucide
stroke style; .link gains position:relative; theme-toggle :active
i18n
- theme-toggle aria-label/title use {{ with i18n }}{{ . }}{{ else }}
fallback so missing translation keys never leak into the DOM
Internal
- drop non-standard data-theme="auto" from <html>; CSS only ever
queried light/dark, the auto value was a no-op
- README CSS budget claim relaxed from "< 3 KB gzipped" to "~ 3 KB"
to match reality (currently 3,113 B minified+gzipped)
Verification
- hugo --gc --minify clean (no warnings)
- rendered HTML at /, /themes/, /variants/ inspected via curl
- WCAG ratios re-computed for sakura+koi against bg and surface
- no headless browser available on host; visual screenshots not produced
Plan: plans/260510-0107-deferred-ui-ux-fixes/
Audit: plans/reports/ui-ux-review-260510-0026-bonsai-theme.md
iammiti99
Personal link-in-bio page — built with Hugo and the bonsai theme. Self-hosted Linktree alternative for my own use.
How it works
Edit hugo.yml (params: block) → push to main → GitHub
Actions builds with Hugo + bonsai → output deploys to GitHub Pages.
Local development
Requires Hugo Extended ≥ 0.128.
hugo server # http://localhost:1313
hugo --gc --minify # build to ./public
Deployment
Every push to main deploys to GitHub Pages. The workflow self-enables Pages
on first run via actions/configure-pages@v5 with enablement: true, so no
manual UI setup is required for fresh forks (provided Settings → Actions →
General → Workflow permissions is set to "Read and write").
(Optional) Custom domain: drop a static/CNAME file containing your apex
domain — Hugo will copy it through to the deployed site.
Project layout
hugo.yml # site content — edit params here
content/_index.md # placeholder so Hugo renders the index
static/images/ # avatar etc.
themes/bonsai/ # bonsai theme (in-repo, full history)
.github/workflows/deploy.yml
public/ # build output (gitignored)