diff --git a/server/src/wled_controller/static/js/features/dashboard.js b/server/src/wled_controller/static/js/features/dashboard.js index b9d1199..c84e775 100644 --- a/server/src/wled_controller/static/js/features/dashboard.js +++ b/server/src/wled_controller/static/js/features/dashboard.js @@ -306,23 +306,32 @@ export async function loadDashboard() { `; } - if (running.length > 0) { - runningIds = running.map(t => t.id); - const stopAllBtn = ``; - const runningItems = running.map(target => renderDashboardTarget(target, true, devicesMap)).join(''); + if (targets.length > 0) { + let targetsInner = ''; + + if (running.length > 0) { + runningIds = running.map(t => t.id); + const stopAllBtn = ``; + const runningItems = running.map(target => renderDashboardTarget(target, true, devicesMap)).join(''); + + targetsInner += `
+ ${_sectionHeader('running', t('dashboard.section.running'), running.length, stopAllBtn)} + ${_sectionContent('running', runningItems)} +
`; + } + + if (stopped.length > 0) { + const stoppedItems = stopped.map(target => renderDashboardTarget(target, false, devicesMap)).join(''); + + targetsInner += `
+ ${_sectionHeader('stopped', t('dashboard.section.stopped'), stopped.length)} + ${_sectionContent('stopped', stoppedItems)} +
`; + } dynamicHtml += `
- ${_sectionHeader('running', t('dashboard.section.running'), running.length, stopAllBtn)} - ${_sectionContent('running', runningItems)} -
`; - } - - if (stopped.length > 0) { - const stoppedItems = stopped.map(target => renderDashboardTarget(target, false, devicesMap)).join(''); - - dynamicHtml += `
- ${_sectionHeader('stopped', t('dashboard.section.stopped'), stopped.length)} - ${_sectionContent('stopped', stoppedItems)} + ${_sectionHeader('targets', t('dashboard.section.targets'), targets.length)} + ${_sectionContent('targets', targetsInner)}
`; } } diff --git a/server/src/wled_controller/static/locales/en.json b/server/src/wled_controller/static/locales/en.json index 85a501c..587bb68 100644 --- a/server/src/wled_controller/static/locales/en.json +++ b/server/src/wled_controller/static/locales/en.json @@ -457,6 +457,7 @@ "overlay.error.start": "Failed to start overlay", "overlay.error.stop": "Failed to stop overlay", "dashboard.title": "📊 Dashboard", + "dashboard.section.targets": "Targets", "dashboard.section.running": "Running", "dashboard.section.stopped": "Stopped", "dashboard.no_targets": "No targets configured", diff --git a/server/src/wled_controller/static/locales/ru.json b/server/src/wled_controller/static/locales/ru.json index 1f6f2a8..2eb37fb 100644 --- a/server/src/wled_controller/static/locales/ru.json +++ b/server/src/wled_controller/static/locales/ru.json @@ -457,6 +457,7 @@ "overlay.error.start": "Не удалось запустить наложение", "overlay.error.stop": "Не удалось остановить наложение", "dashboard.title": "📊 Обзор", + "dashboard.section.targets": "Цели", "dashboard.section.running": "Запущенные", "dashboard.section.stopped": "Остановленные", "dashboard.no_targets": "Нет настроенных целей", diff --git a/server/src/wled_controller/static/style.css b/server/src/wled_controller/static/style.css index 9b5c189..5141cde 100644 --- a/server/src/wled_controller/static/style.css +++ b/server/src/wled_controller/static/style.css @@ -3276,6 +3276,14 @@ input:-webkit-autofill:focus { font-weight: 600; } +.dashboard-subsection { + margin-bottom: 10px; + padding-left: 16px; +} +.dashboard-subsection .dashboard-section-header { + font-size: 0.72rem; +} + .dashboard-stop-all { margin-left: auto; padding: 2px 8px; @@ -3454,12 +3462,12 @@ input:-webkit-autofill:focus { @media (max-width: 768px) { .dashboard-target { - grid-template-columns: 1fr; + grid-template-columns: 1fr auto; gap: 6px; } - .dashboard-target-actions { - justify-content: flex-end; + .dashboard-target-metrics { + display: none; } }