fix: resolve sidebar animation glitches and layout shifts in app detail page (#23216) (#23221)

This commit is contained in:
lyzno1 2025-07-31 16:04:49 +08:00 • committed by GitHub
commit a82b55005b
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
6 changed files with 746 additions and 18 deletions

View file

@ -44,20 +44,29 @@ export default function NavLink({
key={name}
href={href}
className={classNames(
isActive ? 'bg-state-accent-active text-text-accent font-semibold' : 'text-components-menu-item-text hover:bg-state-base-hover hover:text-components-menu-item-text-hover',
'group flex items-center h-9 rounded-md py-2 text-sm font-normal',
isActive ? 'bg-state-accent-active font-semibold text-text-accent' : 'text-components-menu-item-text hover:bg-state-base-hover hover:text-components-menu-item-text-hover',
'group flex h-9 items-center rounded-md py-2 text-sm font-normal',
mode === 'expand' ? 'px-3' : 'px-2.5',
)}
title={mode === 'collapse' ? name : ''}
>
<NavIcon
className={classNames(
'h-4 w-4 flex-shrink-0',
'h-4 w-4 shrink-0',
mode === 'expand' ? 'mr-2' : 'mr-0',
)}
aria-hidden="true"
/>
{mode === 'expand' && name}
<span
className={classNames(
'whitespace-nowrap transition-all duration-200 ease-in-out',
mode === 'expand'
? 'w-auto opacity-100'
: 'pointer-events-none w-0 overflow-hidden opacity-0',
)}
>
{name}
</span>
</Link>
)
}