Ethanfel/Comfyui-Workflow-Snapshot-Manager
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Center timeline bar at 80% width with rounded corners

Browse Source 
Replace full-width bar with centered floating pill that clears both the
left sidebar and right controls. Uses left/right: 10% with border-radius
and a small bottom offset. Icons remain left-aligned inside the track.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
Ethanfel
2026-02-25 00:35:32 +01:00
parent 95cbcd4f6c
commit e554dc9973
1 changed files with 5 additions and 14 deletions
Download Patch File Download Diff File Expand all files Collapse all files

19
js/snapshot_manager.js
View File

@@ -882,12 +882,13 @@ const CSS = `
} }
.snap-timeline { .snap-timeline {
position: absolute; position: absolute;
bottom: 0; bottom: 4px;
left: 0; left: 10%;
right: 0; right: 10%;
height: 32px; height: 32px;
background: rgba(15, 23, 42, 0.85); background: rgba(15, 23, 42, 0.85);
border-top: 1px solid var(--border-color, #334155); border: 1px solid var(--border-color, #334155);
border-radius: 8px;
display: flex; display: flex;
align-items: center; align-items: center;
padding: 0 16px; padding: 0 16px;
@@ -1441,16 +1442,6 @@ function buildTimeline() {
bar.appendChild(track); bar.appendChild(track);
bar.appendChild(snapBtn); bar.appendChild(snapBtn);
// Offset timeline to avoid floating sidebar overlap
const leftToolbar = document.querySelector(".comfyui-body-left .side-tool-bar-container");
const rightToolbar = document.querySelector(".comfyui-body-right .side-tool-bar-container");
if (leftToolbar && !leftToolbar.classList.contains("connected-sidebar")) {
bar.style.paddingLeft = "calc(var(--sidebar-width, 48px) + 16px)";
}
if (rightToolbar && !rightToolbar.classList.contains("connected-sidebar")) {
bar.style.paddingRight = "calc(var(--sidebar-width, 48px) + 16px)";
}
canvasParent.appendChild(bar); canvasParent.appendChild(bar);
timelineEl = bar; timelineEl = bar;