isaacclad/ladill-pos
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Fix confirm-dialog flashes: cloak panel + align transition timing
Deploy Ladill POS / deploy (push) Successful in 30s
Details

Browse Source 
The inner panel lacked x-cloak (brief FOUC on load/navigation) and its
leave/enter durations (300/200ms) outlasted the backdrop's (200/150ms), so the
card animated without its backdrop on open/close. Cloak the panel and align all
durations to 200ms so backdrop and card move together.

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
This commit is contained in:
isaacclad
2026-06-26 08:11:01 +00:00
co-authored by Claude Opus 4.8
parent 09df8e181a
commit 62e396195b
1 changed files with 3 additions and 2 deletions
Download Patch File Download Diff File Expand all files Collapse all files
resources/views/partials/confirm-prompt.blade.php
+3 -2
View File
@@ -4,7 +4,7 @@
x-transition:enter="transition-opacity ease-out duration-200"
x-transition:enter-start="opacity-0"
x-transition:enter-end="opacity-100"
x-transition:leave="transition-opacity ease-in duration-150"
x-transition:leave="transition-opacity ease-in duration-200"
x-transition:leave-start="opacity-100"
x-transition:leave-end="opacity-0"
class="fixed inset-0 z-[60] flex items-end sm:items-center sm:justify-center"
@@ -14,9 +14,10 @@
<div class="absolute inset-0" @click="$store.ladillConfirm.answer(false)"></div>
<div
x-cloak
x-show="$store.ladillConfirm.open"
class="relative z-10 w-full max-h-[90vh] overflow-y-auto rounded-t-3xl bg-white shadow-2xl sm:mb-6 sm:max-h-[85vh] sm:max-w-md sm:rounded-2xl sm:border sm:border-gray-200"
x-transition:enter="ease-out duration-300"
x-transition:enter="ease-out duration-200"
x-transition:enter-start="translate-y-full sm:translate-y-0 sm:opacity-0 sm:scale-95"
x-transition:enter-end="translate-y-0 sm:opacity-100 sm:scale-100"
x-transition:leave="ease-in duration-200"