[PR #3192] [CLOSED] Update snapshot.js Close Button #3094

New issue

Closed

opened 2026-10-28 21:15:07 +00:00 by bsakaguchi · 0 comments

bsakaguchi commented

2026-10-28 21:15:07 +00:00

Owner

📋 Pull Request Information

Original PR: https://github.com/Comfy-Org/ComfyUI-Manager/pull/3192
Author: @admdev24
Created: 8/22/2026
Status: ❌ Closed

Base: main ← Head: patch-5

📝 Commits (2)

b952306 Update snapshot.js Close Button
ac3b23a Update snapshot.js

📊 Changes

1 file changed (+78 additions, -0 deletions)

View changed files

📝 js/snapshot.js (+78 -0)

📄 Description

Component-Specific Style Refinement of the ComfyUI Manager Dashboard

Maintain the same style as the main UI

1. Snapshot Manager Interface Harmonization:

Original Style: The top-right close icon (×) inside the Snapshot Manager dialog panel suffered from a layout styling exclusion bug. On idle, it was enclosed by a prominent, unstyled square framework box outline that broken the visual continuity of the interface. On cursor hover, the component remained completely transparent and lacked tactile response or alignment properties.
Updated Style: Fully stripped away all inherited container borders, default box outlines, and edge tracking constraints to establish a transparent, boundary-free profile on idle. The button layout logic was corrected locally at the file entrypoint by embedding a dedicated, non-blocking

## 📋 Pull Request Information **Original PR:** https://github.com/Comfy-Org/ComfyUI-Manager/pull/3192 **Author:** [@admdev24](https://github.com/admdev24) **Created:** 8/22/2026 **Status:** ❌ Closed **Base:** `main` ← **Head:** `patch-5` --- ### 📝 Commits (2) - [`b952306`](https://github.com/Comfy-Org/ComfyUI-Manager/commit/b9523069cf7e71c586dce9777837a0fd203285f7) Update snapshot.js Close Button - [`ac3b23a`](https://github.com/Comfy-Org/ComfyUI-Manager/commit/ac3b23a9d33fd950d3bcfe1d57601a6c09af0ebc) Update snapshot.js ### 📊 Changes **1 file changed** (+78 additions, -0 deletions) <details> <summary>View changed files</summary> 📝 `js/snapshot.js` (+78 -0) </details> ### 📄 Description ### Component-Specific Style Refinement of the ComfyUI Manager Dashboard **Maintain the same style as the main UI** **1. Snapshot Manager Interface Harmonization:** - > **Original Style:** The top-right close icon (×) inside the Snapshot Manager dialog panel suffered from a layout styling exclusion bug. On idle, it was enclosed by a prominent, unstyled square framework box outline that broken the visual continuity of the interface. On cursor hover, the component remained completely transparent and lacked tactile response or alignment properties. - **Updated Style:** Fully stripped away all inherited container borders, default box outlines, and edge tracking constraints to establish a transparent, boundary-free profile on idle. The button layout logic was corrected locally at the file entrypoint by embedding a dedicated, non-blocking <style> hook right at the top of snapshot.js to ensure the layout parameters register instantaneously when the popup script initializes. **2. Localized Spatial Alignment Calibration** - > **Original Style:** Standard browser formatting rules applied a rigid geometric center calculation to the font glyph character X. This technical alignment generated an optical illusion, making the close cross icon appear pushed out of bounds and visually unbalanced to the right of its relative interactive frame. - **Updated Style:** Isolated the internal text character metrics from the background container layout layers to enable precision tuning across asynchronous framework modules. The character font bounds were scaled and center-locked cleanly, while an independent, floating pseudo-element (::before) layer generates an elegant, light-grey circular backplate (rgba(255, 255, 255, 0.15)) exclusively during interactive mouse hover states. - **Precision Tuning:** Calibrated the horizontal transformation mapping specifically for the sub-manager panel layers to an eye-centered ratio lock (transform: translate(-55%, -50%)). This manual offset adjustment neutralizes the font rendering illusion, ensuring a visually balanced, pixel-perfect close button configuration across all sub-manager layout dialogs. Before: <img width="2158" height="1237" alt="2026-08-22_17-45-20" src="https://github.com/user-attachments/assets/d0e03e47-7ed9-47be-a045-4697d45ea48f" /> After (Hovering): <img width="2145" height="1231" alt="2026-08-22_18-07-05" src="https://github.com/user-attachments/assets/6feef039-5471-4a88-a322-f0665ff10e70" /> --- <sub>🔄 This issue represents a GitHub Pull Request. It cannot be merged through Gitea due to API limitations.</sub>

bsakaguchi

2026-10-28 21:15:07 +00:00