diff options
| author | Christophe Besson <cbesson@gmail.com> | 2026-08-30 22:53:00 +0200 |
|---|---|---|
| committer | Christophe Besson <cbesson@gmail.com> | 2026-08-30 22:53:00 +0200 |
| commit | cebe64d6c14256a31247987bcafbce1a2bf2d8ba (patch) | |
| tree | 5edef11a705493fd94042f4758c05746eea86f0a /packages/meshbay-hub/src/meshbay_hub/static/app.js | |
| parent | 2d6c276734fd19f80edf84cdb95f91a929df6365 (diff) | |
| download | meshbay-cebe64d6c14256a31247987bcafbce1a2bf2d8ba.tar.gz | |
fix(ui): use toggle switches in Settings page, trim verbose hints
Replace checkboxes with the existing toggle-switch component for
notifications, keep-screen-on, and allow-public-groups. Remove the
"Notifications" label from per-group lines, and shorten the
music-keep-screen-on and hub-URL hints.
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
Diffstat (limited to 'packages/meshbay-hub/src/meshbay_hub/static/app.js')
| -rw-r--r-- | packages/meshbay-hub/src/meshbay_hub/static/app.js | 13 |
1 files changed, 8 insertions, 5 deletions
diff --git a/packages/meshbay-hub/src/meshbay_hub/static/app.js b/packages/meshbay-hub/src/meshbay_hub/static/app.js index 268ec3f..611cb27 100644 --- a/packages/meshbay-hub/src/meshbay_hub/static/app.js +++ b/packages/meshbay-hub/src/meshbay_hub/static/app.js @@ -1733,9 +1733,10 @@ function SettingsPage({ user, theme, onThemeChange, groups, onPrefsChange }) { <h3 class="settings-heading">${t('settings.groups')}</h3> <div class="settings-row"> <span class="settings-label">${t('settings.notif_global_disable')}</span> - <label class="settings-value" style="cursor:pointer"> + <label class="toggle-switch"> <input type="checkbox" checked=${globalMute} onChange=${toggleGlobalMute} /> + <span class="toggle-switch-track"><span class="toggle-switch-thumb"></span></span> </label> </div> ${!globalMute && html` @@ -1743,10 +1744,10 @@ function SettingsPage({ user, theme, onThemeChange, groups, onPrefsChange }) { ${groups.map(g => html` <div class="settings-row" key=${g.id}> <span class="settings-label">${g.name}</span> - <label class="settings-value" style="cursor:pointer"> + <label class="toggle-switch"> <input type="checkbox" checked=${!muted[g.id]} onChange=${() => toggleMute(g.id)} /> - ${' '}${t('settings.notifications')} + <span class="toggle-switch-track"><span class="toggle-switch-thumb"></span></span> </label> </div> `)} @@ -1766,9 +1767,10 @@ function SettingsPage({ user, theme, onThemeChange, groups, onPrefsChange }) { <p class="settings-hint">${t('settings.default_tab_hint')}</p> <div class="settings-row"> <span class="settings-label">${t('settings.music_keep_screen_on')}</span> - <label class="settings-value" style="cursor:pointer"> + <label class="toggle-switch"> <input type="checkbox" checked=${keepScreenOnAudio} onChange=${toggleKeepScreenOnAudio} /> + <span class="toggle-switch-track"><span class="toggle-switch-thumb"></span></span> </label> </div> <p class="settings-hint">${t('settings.music_keep_screen_on_hint')}</p> @@ -2005,10 +2007,11 @@ function AdminPage({ token, role }) { <h3 class="settings-heading">${t('admin.general_groups_heading')}</h3> <div class="settings-row"> <span class="settings-label">${t('admin.allow_public_groups_label')}</span> - <label class="settings-value" style="cursor:pointer"> + <label class="toggle-switch ${!canEditSettings || settingsSaving ? 'toggle-switch-disabled' : ''}"> <input type="checkbox" checked=${settings.allow_public_groups} disabled=${!canEditSettings || settingsSaving} onChange=${e => saveSettings({ allow_public_groups: e.target.checked })} /> + <span class="toggle-switch-track"><span class="toggle-switch-thumb"></span></span> </label> </div> <p class="settings-hint">${t('admin.allow_public_groups_hint')}</p> |