bottom nav theme changed

This commit is contained in:
suryacp23 2026-07-16 16:17:10 +05:30
parent 7f88b4a7e4
commit 83c9a27a96
2 changed files with 18 additions and 4 deletions

View File

@ -66,16 +66,16 @@ export function ConsoleLayout() {
<> <>
<span <span
className={cn( className={cn(
'flex items-center justify-center h-7 w-14 rounded-pill transition-colors duration-150', 'flex items-center justify-center h-7 w-14 rounded-pill transition-colors duration-150 bottom-nav-icon',
isActive ? 'bg-sunrise-100 text-sunrise-600' : 'text-faint', isActive ? 'active' : 'text-faint',
)} )}
> >
<Icon size={20} /> <Icon size={20} />
</span> </span>
<span <span
className={cn( className={cn(
'text-2xs leading-none transition-colors duration-150', 'text-2xs leading-none transition-colors duration-150 bottom-nav-text',
isActive ? 'font-semibold text-sunrise-600' : 'font-medium text-faint', isActive ? 'font-semibold active' : 'font-medium text-faint',
)} )}
> >
{t.label} {t.label}

View File

@ -18,3 +18,17 @@
color: var(--nav-item-active); color: var(--nav-item-active);
background: var(--nav-item-active-bg); background: var(--nav-item-active-bg);
} }
.bottom-nav-icon,
.bottom-nav-text {
color: var(--text-faint); /* fallback */
}
.bottom-nav-icon.active {
color: var(--nav-item-active);
background: var(--nav-item-active-bg);
}
.bottom-nav-text.active {
color: var(--nav-item-active);
}