diff --git a/client/src/components/SiderMenu.tsx b/client/src/components/SiderMenu.tsx index cada106..8403cf0 100644 --- a/client/src/components/SiderMenu.tsx +++ b/client/src/components/SiderMenu.tsx @@ -1,4 +1,4 @@ -import { Divider, Menu } from 'antd'; +import { Divider, Menu, Tooltip } from 'antd'; import React from 'react'; interface SiderMenuProps { @@ -12,6 +12,10 @@ export default function SiderMenu({ selectedKey, hangleMenuClick, }: SiderMenuProps) { + const collapseStyle = collapsed + ? { fontSize: '12px' } + : { fontSize: '12px', paddingLeft: '52px' }; + const menuItems = [ { key: 'toggle', @@ -33,7 +37,7 @@ export default function SiderMenu({ icon: ( process diagram ), - label: 'Схемы процессов', + label: Схемы процессов, }, { key: '/running-processes', @@ -43,7 +47,7 @@ export default function SiderMenu({ alt="running processes" /> ), - label: 'Запущенные процессы', + label: Запущенные процессы, }, !collapsed ? { @@ -53,6 +57,7 @@ export default function SiderMenu({ marginBottom: '-16px', marginTop: '-4px', cursor: 'default', + width: '100%', }, disabled: true, } @@ -65,18 +70,30 @@ export default function SiderMenu({ children: [ { key: '/accounts', - label: 'Учетные записи', - style: { fontSize: '12px', paddingLeft: '52px' }, + label: !collapsed ? ( + Учетные записи + ) : ( + 'Учетные записи' + ), + style: collapseStyle, }, { key: '/events-list', - label: 'Справочник событий', - style: { fontSize: '12px', paddingLeft: '52px' }, + label: !collapsed ? ( + Справочник событий + ) : ( + 'Справочник событий' + ), + style: collapseStyle, }, { key: '/configuration', - label: 'Конфигурация', - style: { fontSize: '12px', paddingLeft: '52px' }, + label: !collapsed ? ( + Конфигурация + ) : ( + 'Конфигурация' + ), + style: collapseStyle, }, ], }, diff --git a/client/src/config/customTheme.ts b/client/src/config/customTheme.ts index b79c59a..3863996 100644 --- a/client/src/config/customTheme.ts +++ b/client/src/config/customTheme.ts @@ -6,6 +6,7 @@ export const theme = { itemColor: 'f2f2f2', itemBg: '#f2f2f2', subMenuItemBg: '#f2f2f2', + iconSize: '18px', }, Layout: { bodyBg: '#f2f2f2',