Add per-button tooltips to graph overlay and widen stream test modal
- Each graph node overlay button now has its own <title> tooltip (Edit, Delete, Start/Stop, Test, etc.) instead of inheriting the card name from the parent group - Widen #test-stream-modal to 700px (matching CSS source test modal) Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
@@ -346,7 +346,8 @@
|
|||||||
margin: 0 4px;
|
margin: 0 4px;
|
||||||
}
|
}
|
||||||
|
|
||||||
#test-css-source-modal .modal-content {
|
#test-css-source-modal .modal-content,
|
||||||
|
#test-stream-modal .modal-content {
|
||||||
max-width: 700px;
|
max-width: 700px;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
@@ -346,6 +346,14 @@ function _createOverlay(node, nodeWidth, callbacks) {
|
|||||||
width: totalW, height: btnSize + 4,
|
width: totalW, height: btnSize + 4,
|
||||||
}));
|
}));
|
||||||
|
|
||||||
|
const ACTION_LABELS = {
|
||||||
|
startstop: node.running ? 'Stop' : 'Start',
|
||||||
|
test: 'Test / Preview',
|
||||||
|
notify: 'Test notification',
|
||||||
|
edit: 'Edit',
|
||||||
|
delete: 'Delete',
|
||||||
|
};
|
||||||
|
|
||||||
btns.forEach((btn, i) => {
|
btns.forEach((btn, i) => {
|
||||||
const bx = ox + 4 + i * (btnSize + btnGap);
|
const bx = ox + 4 + i * (btnSize + btnGap);
|
||||||
const by = oy + 2;
|
const by = oy + 2;
|
||||||
@@ -354,6 +362,9 @@ function _createOverlay(node, nodeWidth, callbacks) {
|
|||||||
const txt = svgEl('text', { x: bx + btnSize / 2, y: by + btnSize / 2 });
|
const txt = svgEl('text', { x: bx + btnSize / 2, y: by + btnSize / 2 });
|
||||||
txt.textContent = btn.icon;
|
txt.textContent = btn.icon;
|
||||||
bg.appendChild(txt);
|
bg.appendChild(txt);
|
||||||
|
const btnTip = svgEl('title');
|
||||||
|
btnTip.textContent = ACTION_LABELS[btn.action] || btn.action;
|
||||||
|
bg.appendChild(btnTip);
|
||||||
bg.addEventListener('click', (e) => {
|
bg.addEventListener('click', (e) => {
|
||||||
e.stopPropagation();
|
e.stopPropagation();
|
||||||
if (btn.action === 'edit' && callbacks.onEditNode) callbacks.onEditNode(node);
|
if (btn.action === 'edit' && callbacks.onEditNode) callbacks.onEditNode(node);
|
||||||
|
|||||||
Reference in New Issue
Block a user