mirror of
https://github.com/Comfy-Org/ComfyUI_frontend.git
synced 2026-03-03 12:10:11 +00:00
Prevent sidebar tool buttons from flashing during collapse (#7652)
Prevent sidebar tool buttons from flashing during collapse. ## What changed - Clip the sidebar tool-buttons container during hover collapse so tab labels don't render outside the header. - Keep the existing width/opacity transition so the title still reclaims space. ## Why - Motivation: the hover-out transition shrinks the tool-buttons wrapper to `w-0` while the tabs keep their intrinsic width, causing a brief clipped flash on the right edge of the sidebar. - Why this approach: clipping during the transition is the smallest change that fixes the visual artifact without altering layout timing or hover behavior. - Tradeoffs / limitations: no functional change; the buttons are only clipped while collapsing. ## Evidence - Issues: n/a - Tests: Not run (lint/typecheck only; not evidence) - Screenshots/video: https://github.com/user-attachments/assets/3af4d735-6330-4521-b4cf-45eb4b09f9ba ## References - Related PRs: n/a
This commit is contained in:
@@ -15,7 +15,7 @@
|
||||
</template>
|
||||
<template #end>
|
||||
<div
|
||||
class="touch:w-auto touch:opacity-100 flex flex-row transition-all duration-200 motion-safe:w-0 motion-safe:opacity-0 motion-safe:group-focus-within/sidebar-tab:w-auto motion-safe:group-focus-within/sidebar-tab:opacity-100 motion-safe:group-hover/sidebar-tab:w-auto motion-safe:group-hover/sidebar-tab:opacity-100"
|
||||
class="touch:w-auto touch:opacity-100 flex flex-row overflow-hidden transition-all duration-200 motion-safe:w-0 motion-safe:opacity-0 motion-safe:group-focus-within/sidebar-tab:w-auto motion-safe:group-focus-within/sidebar-tab:opacity-100 motion-safe:group-hover/sidebar-tab:w-auto motion-safe:group-hover/sidebar-tab:opacity-100"
|
||||
>
|
||||
<slot name="tool-buttons" />
|
||||
</div>
|
||||
|
||||
Reference in New Issue
Block a user