sendnrw/netbird-docs
2
0
Fork 0
mirror of https://github.com/netbirdio/docs.git synced 2026-08-24 16:51:26 +02:00
Code Issues Packages Projects Releases Wiki Activity

fix: image zoom overlay flickering on close

Browse Source 
The closing fade-out ran without animation-fill-mode: forwards, so when
the 200ms animation finished the overlay snapped back to full opacity
until React's unmount timeout fired, flashing for a frame or two.
Holding the animation end state covers that gap.

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
This commit is contained in:
Eduard Gert
2026-08-20 12:22:38 +02:00
parent 96f3cb18d1
commit 26b4d5f172
1 changed files with 5 additions and 2 deletions
Download Patch File Download Diff File Expand all files Collapse all files

7
src/styles/tailwind.css
View File

@@ -124,7 +124,10 @@ video.imagewrapper-big {
}
.image-zoom-overlay.closing {
animation: fadeOut 0.2s ease-out;
/* forwards holds opacity 0 after the animation ends, covering the gap
until React's unmount timeout fires (otherwise the overlay snaps back
to full opacity for a frame). */
animation: fadeOut 0.2s ease-out forwards;
}
.image-zoom-content {
@@ -138,7 +141,7 @@ video.imagewrapper-big {
}
.image-zoom-content.closing {
animation: zoomOut 0.2s ease-out;
animation: zoomOut 0.2s ease-out forwards;
}
.image-zoom-close {