clank/clank-together
1
0
Fork 0
Code Issues Wiki Activity

Info marks before the label; tooltip opens to the right so it is not cut off

Browse source 
Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01RNwtXPYqFu3oKaaXwYwNWW
This commit is contained in:
Saty 2026-10-18 12:25:34 +02:00
commit 69c6008c26
2 changed files with 4 additions and 4 deletions
Download patch file Download diff file Expand all files Collapse all files

5
src/server/web/app.js
View file

@ -110,15 +110,16 @@ const TASK_STATES = {
/** A label with an info mark that explains it on hover, focus or tap. */
function withInfo(label, text) {
const wrap = el('span', label);
const wrap = el('span');
if (text) {
const i = el('span', 'i', 'info');
i.tabIndex = 0;
i.setAttribute('role', 'note');
i.setAttribute('aria-label', text);
i.dataset.tip = text;
wrap.append(' ', i);
wrap.append(i, ' ');
}
wrap.append(label);
return wrap;
}

3
src/server/web/style.css
View file

@ -510,9 +510,8 @@ details.fold[open] > summary { margin-bottom: 6px; }
.info::after {
content: attr(data-tip);
position: absolute;
left: 50%;
left: -6px;
bottom: calc(100% + 6px);
transform: translateX(-50%);
width: max-content;
max-width: min(280px, 80vw);
padding: 6px 9px;