added logo
parent
08e2c24a63
commit
4088dacba4
|
|
@ -152,7 +152,7 @@ const Dashboard = ({ isDarkMode, setIsDarkMode }) => {
|
|||
borderColor: 'divider',
|
||||
backgroundColor: 'background.default',
|
||||
zIndex: 1,
|
||||
transform: 'translateY(3px)'
|
||||
transform: 'translateY(31px)'
|
||||
}}>
|
||||
<CustomTabs
|
||||
tabs={tabs}
|
||||
|
|
|
|||
|
|
@ -20,6 +20,8 @@ import SidebarFooter from "./SidebarMenuComponents/SidebarFooter";
|
|||
import useSidebarResize from "../hooks/useSidebarResize";
|
||||
import ChevronLeft from '@mui/icons-material/ChevronLeft';
|
||||
import ChevronRight from '@mui/icons-material/ChevronRight';
|
||||
import LogoFull from '../../assets/images/logo.svg?react';
|
||||
import LogoSmall from '../../assets/images/system_monitor_icon.svg?react';
|
||||
|
||||
const SidebarMenu = ({
|
||||
data,
|
||||
|
|
@ -82,22 +84,44 @@ const SidebarMenu = ({
|
|||
},
|
||||
}}
|
||||
>
|
||||
{/* Заголовок и кнопка сворачивания */}
|
||||
{/* Заголовок с логотипом */}
|
||||
<Box sx={{
|
||||
display: 'flex',
|
||||
alignItems: 'center',
|
||||
justifyContent: 'space-between',
|
||||
justifyContent: 'center', // Центрируем содержимое
|
||||
p: 1,
|
||||
borderBottom: '1px solid',
|
||||
borderColor: 'divider',
|
||||
backgroundColor: 'custom.sidebar'
|
||||
backgroundColor: 'custom.sidebar',
|
||||
height: 80, // Фиксированная высота
|
||||
position: 'relative' // Для позиционирования кнопки
|
||||
}}>
|
||||
{!collapsed && (
|
||||
<Typography variant="h6" sx={{ flexGrow: 1, textAlign: 'center' }}>
|
||||
Меню
|
||||
</Typography>
|
||||
{/* Логотип (занимает все пространство) */}
|
||||
<Box sx={{
|
||||
display: 'flex',
|
||||
alignItems: 'center',
|
||||
justifyContent: 'center',
|
||||
width: '100%',
|
||||
height: '100%',
|
||||
'& svg': {
|
||||
width: '100%',
|
||||
height: '100%',
|
||||
padding: collapsed ? '8px' : '12px',
|
||||
objectFit: 'contain'
|
||||
}
|
||||
}}>
|
||||
{collapsed ? (
|
||||
<LogoSmall style={{
|
||||
color: 'inherit' // Наследует цвет темы
|
||||
}} />
|
||||
) : (
|
||||
<LogoFull style={{
|
||||
color: 'inherit' // Наследует цвет темы
|
||||
}} />
|
||||
)}
|
||||
</Box>
|
||||
|
||||
{/* Кнопка сворачивания (абсолютное позиционирование) */}
|
||||
<Tooltip title={collapsed ? "Развернуть меню" : "Свернуть меню"}>
|
||||
<IconButton
|
||||
onClick={handleToggleCollapse}
|
||||
|
|
@ -105,7 +129,10 @@ const SidebarMenu = ({
|
|||
sx={{
|
||||
color: 'custom.sidebarText',
|
||||
'&:hover': { backgroundColor: 'custom.sidebarHover' },
|
||||
ml: collapsed ? 'auto' : 0
|
||||
position: 'absolute',
|
||||
right: 8,
|
||||
top: '50%',
|
||||
transform: 'translateY(-50%)'
|
||||
}}
|
||||
>
|
||||
{collapsed ? <ChevronRight /> : <ChevronLeft />}
|
||||
|
|
|
|||
Loading…
Reference in New Issue