refactor(PageHeader): update actions positioning and layout for improved visibility and user experience
Publish Fast Tabler Docker image / build-and-push-fast (push) Successful in 1m55s

This commit is contained in:
2026-02-16 22:23:27 +07:00
parent 6fad114b22
commit f2c3562000
+8 -5
View File
@@ -3,11 +3,12 @@ import React from 'react'
/**
* Единый заголовок страницы в стиле Tabler UI.
* Используется на всех страницах для одинакового UX.
* Кнопки (actions) отображаются под названием страницы.
* @param {string} title - Заголовок страницы
* @param {React.ReactNode} [icon] - Иконка слева от заголовка (например, <IconServer />)
* @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 (
@@ -25,12 +26,14 @@ function PageHeader({ title, icon, pretitle, actions, meta }) {
<div className="text-muted small mt-1">{meta}</div>
)}
</div>
{actions && (
<div className="col-auto ms-auto d-print-none">
</div>
{actions && (
<div className="row mt-2">
<div className="col d-print-none">
{actions}
</div>
)}
</div>
</div>
)}
</div>
)
}