From 21fda0a851517fe72956e7587328792523be1197 Mon Sep 17 00:00:00 2001 From: Michael Czechowski Date: Fri, 16 Jan 2026 14:45:30 +0100 Subject: [PATCH] feat: add section color coding to overview page elements MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Topic headings (h2, h3) and inline code now use section-specific colors: - CSS: purple - HTML: pink - Tailwind: teal Uses CSS custom properties (--section-color-dark, --section-color-rgb) that are already set per section. 🤖 Generated with [Claude Code](https://claude.com/claude-code) --- src/main.css | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/src/main.css b/src/main.css index 5ce8ea6..d3101d7 100644 --- a/src/main.css +++ b/src/main.css @@ -2649,13 +2649,13 @@ input:checked + .toggle-slider::before { .topic-text h2 { font-size: 1.25rem; - color: var(--primary-dark); + color: var(--section-color-dark, var(--primary-dark)); margin: 0 0 0.75rem; } .topic-text h3 { font-size: 1rem; - color: var(--primary-dark); + color: var(--section-color-dark, var(--primary-dark)); margin: 0 0 0.5rem; } @@ -2735,8 +2735,8 @@ input:checked + .toggle-slider::before { /* Inline code in topic text */ .topic-text code { - background: var(--primary-bg-light); - color: var(--primary-dark); + background: rgba(var(--section-color-rgb, 145, 99, 184), 0.1); + color: var(--section-color-dark, var(--primary-dark)); padding: 0.15rem 0.4rem; border-radius: 4px; font-family: "JetBrains Mono", "Fira Code", Consolas, monospace;