feat(nav): update NavDesktop and NavMobile styles for improved consistency and visibility
This commit is contained in:
@@ -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)',
|
||||||
},
|
},
|
||||||
}),
|
}),
|
||||||
}),
|
}),
|
||||||
|
|||||||
Reference in New Issue
Block a user