feat(ui): refresh layout, help assets, and panel styling

Update the main template and client scripts for the revised navigation
and zone/device panels, and add bundled help SVG assets under static.

Co-authored-by: Cursor <cursoragent@cursor.com>
This commit is contained in:
2026-06-08 10:33:41 +12:00
parent 2382ef16a1
commit aab62efd4f
27 changed files with 1606 additions and 467 deletions

View File

@@ -7,9 +7,11 @@ document.addEventListener('DOMContentLoaded', () => {
const mainMenuDropdown = document.getElementById('main-menu-dropdown');
if (helpBtn && helpModal) {
helpBtn.addEventListener('click', () => {
const openHelp = () => {
helpModal.classList.add('active');
});
switchHelpTab('overview');
};
helpBtn.addEventListener('click', openHelp);
}
if (helpCloseBtn && helpModal) {
@@ -18,10 +20,37 @@ document.addEventListener('DOMContentLoaded', () => {
});
}
const helpTabButtons = document.querySelectorAll('[data-help-tab]');
const helpTabPanels = document.querySelectorAll('[data-help-panel]');
function switchHelpTab(tabId) {
if (!tabId) tabId = 'overview';
for (const btn of helpTabButtons) {
const on = btn.getAttribute('data-help-tab') === tabId;
btn.classList.toggle('active', on);
btn.setAttribute('aria-selected', on ? 'true' : 'false');
}
for (const panel of helpTabPanels) {
const on = panel.getAttribute('data-help-panel') === tabId;
panel.classList.toggle('active', on);
panel.hidden = !on;
}
}
for (const btn of helpTabButtons) {
btn.addEventListener('click', () => {
switchHelpTab(btn.getAttribute('data-help-tab'));
});
}
// Mobile main menu: forward clicks to existing header buttons
if (mainMenuBtn && mainMenuDropdown) {
mainMenuBtn.addEventListener('click', () => {
mainMenuDropdown.classList.toggle('open');
const zonesMenuDropdown = document.getElementById('zones-menu-dropdown');
const zonesMenuBtn = document.getElementById('zones-menu-btn');
if (zonesMenuDropdown) zonesMenuDropdown.classList.remove('open');
if (zonesMenuBtn) zonesMenuBtn.setAttribute('aria-expanded', 'false');
});
mainMenuDropdown.addEventListener('click', (event) => {