Skip to content

fix(vibe-check): make logo readable in dark mode#18164

Open
DerGeraetK wants to merge 1 commit into
PostHog:masterfrom
DerGeraetK:fix/vibe-check-logo-dark-mode
Open

fix(vibe-check): make logo readable in dark mode#18164
DerGeraetK wants to merge 1 commit into
PostHog:masterfrom
DerGeraetK:fix/vibe-check-logo-dark-mode

Conversation

@DerGeraetK

Copy link
Copy Markdown

Changes

Fixes #17952

In dark mode on /vibe-check, the PostHog logo in the "You'll hate PostHog if..." heading was nearly invisible: the Logo SVG letters use hardcoded black path fills that don't adapt to the theme.

This applies the same theme-conditional fill already used for the Logo across the site (About/v2/Letterhead.tsx, Home/Control, Home/Test, ko/_KoreanHome.tsx):

fill={siteSettings.theme === 'dark' ? 'white' : undefined}

  • In dark mode the whole logo (letters + glyph) renders monochrome white — intentional, matching the site's established dark-mode logo treatment (see screenshots).
  • In light mode undefined falls back to the component default — unchanged behavior.

Note: open PR #17950 fixes the text contrast on this same page (#17926). This PR only touches the Logo fill — semantically independent, but both edit adjacent lines of the same <h1>, so whichever lands second needs a trivial rebase. Happy to rebase if #17950 merges first.

Screenshots (dark before → dark after → light unchanged)

Dark before:
Screenshot 2026-07-03 132520

Dark after:
Screenshot 2026-07-03 132538

Light unchanged:
Screenshot 2026-07-03 133053

Checklist

  • I've read the docs/content style guides
  • Words are spelled using American English
  • Relative URLs for internal links (n/a — none added)
  • Vercel preview build checked (will verify once the preview builds)
  • No page moved (n/a)

🤖 Agent context

Claude-written: implemented with Claude Code under my direction.

  • Tools: Claude Code (single session). Approach: located the root cause in components/Logo (hardcoded path fills), searched the repo for existing dark-mode Logo treatments and applied the established pattern rather than inventing one.
  • Verification: ran the site locally (Gatsby dev), visually verified both themes on /vibe-check; Prettier/ESLint via the repo's commit hooks.
  • Human review: I reviewed the diff and can explain it.

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
@DerGeraetK DerGeraetK force-pushed the fix/vibe-check-logo-dark-mode branch from d683907 to 3bd0334 Compare July 3, 2026 11:53
@DerGeraetK DerGeraetK marked this pull request as ready for review July 3, 2026 11:53
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Bug Report: Text Color in PostHog is hard to Read

1 participant