dashboard: new S3TT1NGS tab housing the notification toggle (closes #763)
Adds a fifth tab (◆ S3TT1NGS ◆) at the end of the dashboard tab strip; moves the browser-notification controls out of the chrome header into the new pane. ### Why The chrome was carrying the notification controls as 'always-on ergonomics' but the surface they belong on is operator preferences, not navigation. With #589 / #701 likely adding more per-browser preferences later (theme / density / etc.), having a dedicated S3TT1NGS pane gives them a home so the chrome strip doesn't keep accreting controls. ### Shape - index.html: new `#tab-pane-settings` section with H2 + intro + H3 'browser notifications' group; same notif-row DOM (same IDs) migrated from the chrome - flow.html: drops the duplicated notif-row from its chrome (FL0W reused the dashboard's strip); adds a `◆ S3TT1NGS ◆ →` cross-page link to `/#settings`. Notifications still fire on FL0W when enabled — NOTIF.show() reads Notification.permission + the hyperhive.notify.muted localStorage key directly, no buttons needed in the page DOM. - tabs.js: adds 'settings' to TABS array so hash routing activates the pane - dashboard.css: drops the chrome-anchoring `.tabbar #notif-row` rule and the flow-page reuse comment, both obsolete; the general `.notif-row` styling stays - docs/web-ui.md: new `### S3TT1NGS tab` section; Chrome-header bullet drops 'Notification controls' + adds S3TT1NGS; Browser notifications section pointers at the new pane ### No JS or backend changes Same IDs (notif-row, notif-enable, notif-mute, notif-unmute, notif-status) so `NOTIF.bind()` in common.js wires the new pane unchanged. NOTIF.show() dispatch is DOM-independent. ### Validation `npm run --workspace @hive/dashboard build` clean (tabs.js 167.8kb, flow.js 37.4kb, dashboard.css 50.2kb).
This commit is contained in:
parent
80dd4babd4
commit
6cf169d324
5 changed files with 92 additions and 52 deletions
|
|
@ -98,15 +98,6 @@ body.dashboard-shell {
|
|||
color: var(--red);
|
||||
}
|
||||
|
||||
/* Notification controls cohabit with the tabs (always-on chrome). */
|
||||
.tabbar #notif-row {
|
||||
margin-left: auto;
|
||||
display: flex;
|
||||
gap: 0.5em;
|
||||
align-items: center;
|
||||
padding-right: 0.5em;
|
||||
}
|
||||
|
||||
/* Tab pane visibility — show only the active one. The .tab-pane-active
|
||||
class is set by tabs.js based on the URL hash; default (no hash)
|
||||
resolves to SW4RM. */
|
||||
|
|
@ -1582,10 +1573,6 @@ body.flow-shell .tabbar .tab.active.tab-link {
|
|||
border-color: var(--purple-dim);
|
||||
box-shadow: 0 -2px 12px -4px rgba(203, 166, 247, 0.4);
|
||||
}
|
||||
/* `.notif-row` styling lives under the shared `.tabbar #notif-row`
|
||||
selector earlier in the file — the flow page reuses the dashboard
|
||||
tab strip rather than carrying its own title/hint/back chrome. */
|
||||
|
||||
/* Inbox pill — operator inbox flyout trigger. Sits right under the
|
||||
header so it stays in the operator's gaze without crowding the
|
||||
chat. Same shape as the agent page's header pills. */
|
||||
|
|
|
|||
Loading…
Reference in a new issue