songtianlun/prmbr-image-mksaas
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

refactor: update navbar component styles to use accent foreground for active and hover states

Browse Source
This commit is contained in:
javayhu 2025-08-24 21:01:36 +08:00
parent cb9c3132fd
commit 610346055f
1 changed files with 14 additions and 14 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

28
src/components/layout/navbar.tsx
View File

@ -37,8 +37,8 @@ const customNavigationMenuTriggerStyle = cn(
'relative bg-transparent text-muted-foreground cursor-pointer',
'hover:bg-accent hover:text-accent-foreground',
'focus:bg-accent focus:text-accent-foreground',
'data-active:font-semibold data-active:bg-transparent data-active:text-foreground',
'data-[state=open]:bg-transparent data-[state=open]:text-foreground'
'data-active:font-semibold data-active:bg-transparent data-active:text-accent-foreground',
'data-[state=open]:bg-transparent data-[state=open]:text-accent-foreground'
);
export function Navbar({ scroll }: NavBarProps) {
@ -132,10 +132,10 @@ export function Navbar({ scroll }: NavBarProps) {
className={cn(
'flex size-8 shrink-0 items-center justify-center transition-colors',
'bg-transparent text-muted-foreground',
'group-hover:bg-transparent group-hover:text-foreground',
'group-focus:bg-transparent group-focus:text-foreground',
'group-hover:bg-transparent group-hover:text-accent-foreground',
'group-focus:bg-transparent group-focus:text-accent-foreground',
isSubItemActive &&
'bg-transparent text-foreground'
'bg-transparent text-accent-foreground'
)}
>
{subItem.icon ? subItem.icon : null}
@ -144,10 +144,10 @@ export function Navbar({ scroll }: NavBarProps) {
<div
className={cn(
'text-sm font-medium text-muted-foreground',
'group-hover:bg-transparent group-hover:text-foreground',
'group-focus:bg-transparent group-focus:text-foreground',
'group-hover:bg-transparent group-hover:text-accent-foreground',
'group-focus:bg-transparent group-focus:text-accent-foreground',
isSubItemActive &&
'bg-transparent text-foreground'
'bg-transparent text-accent-foreground'
)}
>
{subItem.title}
@ -156,10 +156,10 @@ export function Navbar({ scroll }: NavBarProps) {
<div
className={cn(
'text-sm text-muted-foreground',
'group-hover:bg-transparent group-hover:text-foreground/80',
'group-focus:bg-transparent group-focus:text-foreground/80',
'group-hover:bg-transparent group-hover:text-accent-foreground/80',
'group-focus:bg-transparent group-focus:text-accent-foreground/80',
isSubItemActive &&
'bg-transparent text-foreground/80'
'bg-transparent text-accent-foreground/80'
)}
>
{subItem.description}
@ -170,10 +170,10 @@ export function Navbar({ scroll }: NavBarProps) {
<ArrowUpRightIcon
className={cn(
'size-4 shrink-0 text-muted-foreground',
'group-hover:bg-transparent group-hover:text-foreground',
'group-focus:bg-transparent group-focus:text-foreground',
'group-hover:bg-transparent group-hover:text-accent-foreground',
'group-focus:bg-transparent group-focus:text-accent-foreground',
isSubItemActive &&
'bg-transparent text-foreground'
'bg-transparent text-accent-foreground'
)}
/>
)}