diff --git a/frontend/src/App.css b/frontend/src/App.css index 742f336..1517547 100644 --- a/frontend/src/App.css +++ b/frontend/src/App.css @@ -436,6 +436,7 @@ height: 100%; } .header-actions .btn svg { width: 18px; height: 18px; } +.header-actions .header-actions-right { flex-shrink: 0; } /* Ensure dropdowns in header-actions overlay tables/cards correctly but stay below modals */ .header-actions .dropdown-menu, diff --git a/frontend/src/ServerManager.jsx b/frontend/src/ServerManager.jsx index 21a8630..1b85a11 100644 --- a/frontend/src/ServerManager.jsx +++ b/frontend/src/ServerManager.jsx @@ -602,7 +602,7 @@ function ServerManager() { } actions={ -
+ <> - -
+
+
+ + +
-
- -
+ } /> diff --git a/frontend/src/components/PageHeader.jsx b/frontend/src/components/PageHeader.jsx index 51e92d2..2313a20 100644 --- a/frontend/src/components/PageHeader.jsx +++ b/frontend/src/components/PageHeader.jsx @@ -3,12 +3,12 @@ import React from 'react' /** * Единый заголовок страницы в стиле Tabler UI. * Используется на всех страницах для одинакового UX. - * Кнопки (actions) отображаются под названием страницы. + * Кнопки (actions) отображаются справа от названия страницы. * @param {string} title - Заголовок страницы * @param {React.ReactNode} [icon] - Иконка слева от заголовка (например, ) * @param {string} [pretitle] - Небольшая надпись над заголовком (page-pretitle) * @param {React.ReactNode} [meta] - Подзаголовок или мета-информация под заголовком - * @param {React.ReactNode} [actions] - Кнопки/действия под заголовком (btn-list, btn-group) + * @param {React.ReactNode} [actions] - Кнопки/действия справа в шапке (btn-list, btn-group) */ function PageHeader({ title, icon, pretitle, actions, meta }) { return ( @@ -26,14 +26,12 @@ function PageHeader({ title, icon, pretitle, actions, meta }) {
{meta}
)}
- - {actions && ( -
-
+ {actions && ( +
{actions}
-
- )} + )} +
) } diff --git a/frontend/src/components/PageHeaderActions.jsx b/frontend/src/components/PageHeaderActions.jsx index 584ef7c..0d3c9ab 100644 --- a/frontend/src/components/PageHeaderActions.jsx +++ b/frontend/src/components/PageHeaderActions.jsx @@ -59,9 +59,13 @@ function PageHeaderActions({ {(onImport || onExport) && placeholderBtn(160)} {onClear && placeholderBtn(130)} {onClearCommunities && placeholderBtn(180)} - {onSave && placeholderBtn(140)} - {onHistory && placeholderBtn(110)} + {(onSave || onHistory) && ( +
+ {onSave && placeholderBtn(140)} + {onHistory && placeholderBtn(110)} +
+ )} ); } @@ -140,33 +144,37 @@ function PageHeaderActions({ Очистить community )} - {onSave && ( - - )} - {onHistory && ( -
- - {lastModified && ( - - )} -
- )} + {(onSave || onHistory) && ( +
+ {onSave && ( + + )} + {onHistory && ( +
+ + {lastModified && ( + + )} +
+ )} +
+ )} {/* Компактное меню для маленьких экранов */} {secondaryButtons && (