[IP-568]: correction of dark mode contrast in various locations

[nielsdrost7]

Summary

Filament applies --gray-100 to .fi-sidebar-item.fi-active > .fi-sidebar-item-btn (the child <a> element), not the <li> container. All custom themes were only overriding the container, leaving the near-white button visible over dark/colored sidebars and making white text unreadable. Extended each theme's fi-active block to also target > .fi-sidebar-item-btn, > .fi-icon, and > .fi-sidebar-item-label across all five company themes (invoiceplane.css, invoiceplane-blue.css, nord.css, orange.css, reddit.css).

Also: gray token remaps per theme, hover/focus/trigger text fixes for dropdown triggers, notification buttons, and user/tenant menus; Vite build now splits dev vs. production modes (minification only in production).

Closes

Closes #568 — dark-mode/active-sidebar-item contrast fixed across all company themes

Follow-up issues

None.

Test plan

• Visually verify active sidebar item contrast in each theme (invoiceplane, invoiceplane-blue, nord, orange, reddit) in both light and dark mode
• Verify hover/focus states remain legible
• npm run build (production) still minifies; dev build unaffected

[nielsdrost7]

@coderabbitai summary

[coderabbitai]

📝 Walkthrough

Walkthrough

The company Filament themes remap gray tokens and tighten sidebar active, hover, and trigger styling across the blue, nord, orange, and reddit variants. The Vite setup also splits development and production build commands and enables minification only in production.

Changes

Sidebar theme overrides

Layer / File(s)	Summary
Gray token remaps resources/css/filament/company/invoiceplane-blue.css, resources/css/filament/company/nord.css, resources/css/filament/company/orange.css, resources/css/filament/company/reddit.css	--gray-* variables are remapped to theme-specific neutral palettes in the company theme stylesheets.
Active sidebar item states resources/css/filament/company/invoiceplane-blue.css, resources/css/filament/company/invoiceplane.css, resources/css/filament/company/nord.css, resources/css/filament/company/orange.css, resources/css/filament/company/reddit.css	Active sidebar item buttons now force theme backgrounds and white nested icon/label text, with related sidebar and menu overrides included in the nord and orange sections.
Hover, focus, and trigger text resources/css/filament/company/invoiceplane.css, resources/css/filament/company/invoiceplane-blue.css, resources/css/filament/company/nord.css, resources/css/filament/company/orange.css, resources/css/filament/company/reddit.css	URL-backed sidebar items, dropdown triggers, database notification buttons, and user menu triggers now apply theme-specific hover/focus backgrounds and white nested text where those selectors are defined.

Build mode split

Layer / File(s)	Summary
Build mode split package.json, vite.config.js	The build script runs Vite in development mode, prod runs Vite in production mode, and minification is enabled only when the Vite mode is production.

Estimated code review effort

🎯 3 (Moderate) | ⏱️ ~20 minutes

Poem

A rabbit hopped through styles so bright,
Gray tokens tuned from dawn to night.
Dev and prod now bound their way,
While sidebar tails stayed neat and gay.
🐰✨ Thump! The build hops clean today.

🚥 Pre-merge checks | ✅ 5

✅ Passed checks (5 passed)

Check name	Status	Explanation
Docstring Coverage	✅ Passed	No functions found in the changed files to evaluate docstring coverage. Skipping docstring coverage check.
Linked Issues check	✅ Passed	Check skipped because no linked issues were found for this pull request.
Out of Scope Changes check	✅ Passed	Check skipped because no linked issues were found for this pull request.
Description Check	✅ Passed	Check skipped - CodeRabbit’s high-level summary is enabled.
Title check	✅ Passed	The title matches the main theme of the PR by describing the dark-mode/sidebar contrast fix, even though it is broader than the exact implementation.

✨ Finishing Touches

📝 Generate docstrings

• Create stacked PR
• Commit on current branch

🧪 Generate unit tests (beta)

• Create PR with unit tests
• Commit unit tests in branch claude/nord-sidebar-active-contrast-e569ge

---

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

• X
• Mastodon
• Reddit
• LinkedIn

_{Comment @coderabbitai help to get the list of available commands.}