Theme Audit Deep Dive: From Hardcoded Dark Colors to Universal CSS Variables

Had one of those satisfying sessions where you fix a bunch of small annoyances that have been bugging you for weeks.

The Great Guide Post Theme Conversion

Started by auditing the guide post template after noticing it looked broken on light themes. Turns out the entire thing was hardcoded for dark mode only – over 20 instances of #fff and rgba(255,255,255,...) scattered everywhere, plus a bunch of leftover purple accent colors from some earlier design iteration.

The fix was pretty straightforward but tedious: convert everything to CSS custom properties like var(--text), var(--text-2), var(--accent-tint), etc. Had to touch 11 files across the developer theme and all the vertical themes. Also found an inline style="" attribute that was completely blocking the light theme hero overlay from working.

Best part was simplifying the theme overrides – went from 43 lines of redundant CSS down to just 3 lines since most of it became unnecessary once the base styles used proper variables.

Fixing Broken Hover States

While I was in there, noticed that link hover states weren't working because --accent-light was identical to --accent. Quick fix: compute a 30% lighter variant automatically (like #7b2fbe → #a26dd1). Much better than storing another field in the database.

Also fixed an issue where warm theme + flat gradients made hero text completely invisible (white text on cream background). Added a simple override that flips the text to dark when needed.

Dashboard UX Polish

Switched over to the honeybun dashboard to fix some UX issues with the backfill feature. The button would re-enable before the operation completed, cards could collapse mid-operation, and there was no loading spinner – classic recipe for user confusion.

Added a backfilling flag to prevent card collapse during the operation, proper button lifecycle management, and a nice spinner. All the Playwright tests are still passing which is always reassuring.

The Satisfying Part

Deployed everything to production and purged the caches. It's one of those changes where everything just works better – themes switch properly, hover states work, and the backfill UX feels solid. Sometimes the best sessions are just cleaning up technical debt and making things work the way they should have from the start.

Still need to commit the dashboard changes and decide between tackling the homepage rewrite or diving into those GHL custom fields next.