feat(nav): update NavDesktop and NavMobile styles for improved consistency and visibility

This commit is contained in:
OlgunR
2025-12-10 15:38:34 +01:00
parent a2673216c9
commit 58fb4f2849

View File

@@ -55,9 +55,9 @@ export function NavDesktop({
flexDirection: 'column', flexDirection: 'column',
zIndex: 'var(--layout-nav-zIndex)', zIndex: 'var(--layout-nav-zIndex)',
width: 'var(--layout-nav-vertical-width)', width: 'var(--layout-nav-vertical-width)',
bgcolor: '#ffe8ed', bgcolor: '#ffffff',
color: '#4a0f14', color: '#5a1a22',
borderRight: `1px solid ${varAlpha('74 15 20', 0.12)}`, borderRight: `1px solid ${varAlpha('90 24 34', 0.08)}`,
[theme.breakpoints.up(layoutQuery)]: { [theme.breakpoints.up(layoutQuery)]: {
display: 'flex', display: 'flex',
}, },
@@ -102,8 +102,8 @@ export function NavMobile({
overflow: 'unset', overflow: 'unset',
height: 'calc(100% - var(--layout-header-mobile-height))', height: 'calc(100% - var(--layout-header-mobile-height))',
width: 'var(--layout-nav-mobile-width)', width: 'var(--layout-nav-mobile-width)',
bgcolor: '#ffe8ed', bgcolor: '#ffffff',
color: '#4a0f14', color: '#5a1a22',
[theme.breakpoints.up(layoutQuery)]: { [theme.breakpoints.up(layoutQuery)]: {
top: 'var(--layout-header-desktop-height)', top: 'var(--layout-header-desktop-height)',
height: 'calc(100% - var(--layout-header-desktop-height))', height: 'calc(100% - var(--layout-header-desktop-height))',
@@ -164,14 +164,14 @@ export function NavContent({ data, slots, workspaces, sx }: NavContentProps) {
borderRadius: 0.75, borderRadius: 0.75,
typography: 'body2', typography: 'body2',
fontWeight: 'fontWeightMedium', fontWeight: 'fontWeightMedium',
color: '#4a0f14', color: '#5a1a22',
minHeight: 44, minHeight: 44,
...(isActived && { ...(isActived && {
fontWeight: 'fontWeightSemiBold', fontWeight: 'fontWeightSemiBold',
color: '#4a0f14', color: '#5a1a22',
bgcolor: 'rgba(74, 15, 20, 0.12)', bgcolor: 'rgba(90, 24, 34, 0.08)',
'&:hover': { '&:hover': {
bgcolor: 'rgba(74, 15, 20, 0.18)', bgcolor: 'rgba(90, 24, 34, 0.14)',
}, },
}), }),
}), }),