fix(settings): neutralize sidebar icons for a consistent palette

This commit is contained in:
Luca
2026-05-11 11:11:23 +02:00
parent 15d01f3756
commit 2f00bbdd90
+10 -2
View File
@@ -296,10 +296,14 @@ export const SettingsPage: React.FC = () => {
: 'text-neutral-700 dark:text-neutral-300 hover:bg-neutral-100 dark:hover:bg-neutral-800' : 'text-neutral-700 dark:text-neutral-300 hover:bg-neutral-100 dark:hover:bg-neutral-800'
}`} }`}
> >
{/* Active-state icon paints white to sit on the
accent-dark pill (matches the label colour
and avoids the accent-on-accent low-contrast
that the prior `text-accent` produced). */}
<Icon <Icon
className={`w-4 h-4 flex-shrink-0 ${ className={`w-4 h-4 flex-shrink-0 ${
isActive isActive
? 'text-accent' ? 'text-white'
: 'text-neutral-500 dark:text-neutral-400 group-hover:text-neutral-700 dark:group-hover:text-neutral-200' : 'text-neutral-500 dark:text-neutral-400 group-hover:text-neutral-700 dark:group-hover:text-neutral-200'
}`} }`}
/> />
@@ -318,7 +322,11 @@ export const SettingsPage: React.FC = () => {
{showSectionHeading && ( {showSectionHeading && (
<div className="mb-4 lg:mb-6 pb-3 border-b border-neutral-200 dark:border-neutral-700"> <div className="mb-4 lg:mb-6 pb-3 border-b border-neutral-200 dark:border-neutral-700">
<div className="flex items-center gap-2"> <div className="flex items-center gap-2">
<activeItem.icon className="w-5 h-5 text-accent" /> {/* Section heading icon stays neutral so the Settings
chrome reads as one consistent palette — no stray
accent flecks. The active sidebar pill is the only
place that uses the accent fill. */}
<activeItem.icon className="w-5 h-5 text-neutral-700 dark:text-neutral-300" />
<h2 className="text-lg font-semibold text-neutral-900 dark:text-neutral-100"> <h2 className="text-lg font-semibold text-neutral-900 dark:text-neutral-100">
{activeItem.label} {activeItem.label}
</h2> </h2>