michael/ProdDash
1
0
Fork 0
Code Issues Pull Requests 3 Actions Packages Projects Releases 1 Wiki Activity

Shell: tooltips at once, one or two words; text-size buttons are drawn − and +

Browse Source 
Every header and top-bar button's title becomes a tip the shell shows the
moment the pointer arrives (the browser's own waits a second and looks
different everywhere); it moves from `title` to data-tip so the native one
never appears, and a module that sets `title` again is picked up on the
next hover. The shell's own labels are "Settings" and "Remove"; the top
bar's are "Fullscreen", "Add tile", "Layouts", "Admin"; Slack, PCO Plan,
ProdCom and Timers shorten theirs to match. A− / A+ are a drawn − and +
in Slack, PCO Plan and ProdCom, sized like every other header icon.

Co-Authored-By: Claude Fable 5.1 <noreply@anthropic.com>
This commit is contained in:
Waters Church
2026-09-15 10:49:58 -04:00
co-authored by Claude Fable 5.1
parent 1930fb142d
commit 818def822d
8 changed files with 127 additions and 31 deletions
Download Patch File Download Diff File Expand all files Collapse all files
public/style.css
+18
View File
@@ -308,6 +308,24 @@ body.menu-hidden #topbar {
.tile-btn.active { color: var(--accent); }
.tile-btn.is-open,
.tile-btn.is-open:hover { background: var(--accent); color: var(--accent-text); }
/* the shell's tooltip: shown at once under the button the pointer is on */
#tip {
position: fixed;
z-index: 200;
pointer-events: none;
padding: 3px 8px;
border: 1px solid var(--border);
border-radius: 5px;
background: var(--panel);
color: var(--text);
font-size: 11px;
font-weight: 600;
letter-spacing: 0.02em;
white-space: nowrap;
box-shadow: 0 4px 14px rgba(0, 0, 0, 0.35);
}
#tip[hidden] { display: none; }
.tile-btn svg { width: 13px; height: 13px; display: block; }
/* controls a module adds to its own title bar (moduleApi.header) */