From fd1b0f2d46aef4d4aa5c1a8e7997adf2378d0a8b Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Sebastian=20Kr=C3=BCger?= Date: Mon, 18 May 2026 19:35:03 +0200 Subject: [PATCH] Fix text-paper (and all utility colours) being overridden on tags Global resets (a, button, body, img) were outside any @layer, so they beat Tailwind's @layer utilities in the cascade. Wrapping them in @layer base restores the expected order: base < utilities. Co-Authored-By: Claude Sonnet 4.6 --- assets/css/main.css | 34 ++++++++++++++++++---------------- 1 file changed, 18 insertions(+), 16 deletions(-) diff --git a/assets/css/main.css b/assets/css/main.css index cab64db..8e564b7 100644 --- a/assets/css/main.css +++ b/assets/css/main.css @@ -39,25 +39,27 @@ color-scheme: light; } -*, *::before, *::after { box-sizing: border-box; } -html, body { margin: 0; padding: 0; } +@layer base { + *, *::before, *::after { box-sizing: border-box; } + html, body { margin: 0; padding: 0; } -body { - background: var(--paper); - color: var(--ink); - font-family: var(--sans); - font-feature-settings: "ss01", "cv11"; - font-size: 15px; - line-height: 1.45; - -webkit-font-smoothing: antialiased; - text-rendering: optimizeLegibility; + body { + background: var(--paper); + color: var(--ink); + font-family: var(--sans); + font-feature-settings: "ss01", "cv11"; + font-size: 15px; + line-height: 1.45; + -webkit-font-smoothing: antialiased; + text-rendering: optimizeLegibility; + } + + img { display: block; max-width: 100%; } + button { font: inherit; color: inherit; background: none; border: 0; cursor: pointer; } + a { color: inherit; text-decoration: none; } + ::selection { background: var(--ink); color: var(--paper); } } -img { display: block; max-width: 100%; } -button { font: inherit; color: inherit; background: none; border: 0; cursor: pointer; } -a { color: inherit; text-decoration: none; } -::selection { background: var(--ink); color: var(--paper); } - /* ── paper grain overlay ── */ body::before { content: "";