Joseph.Rawlings/Virtnet.bond
Public Access
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases 1 Wiki Activity

refactor: enhance onboarding modal functionality with improved x-cloak handling and slide display logic

Browse Source
This commit is contained in:
Joseph.Rawlings
2025-12-03 22:49:21 -05:00
parent 68232552b4
commit ae1996c25f
1 changed files with 9 additions and 6 deletions
Download Patch File Download Diff File Expand all files Collapse all files

15
extensions/Others/Onboarding/resources/views/modal.blade.php
View File

@@ -1,23 +1,26 @@
@php use Illuminate\Support\Facades\Storage; @endphp
<div>
@if($showModal && count($slides) > 0)
<div x-data="{ open: @entangle('showModal'), currentSlide: @entangle('currentSlide') }"
x-show="open"
x-cloak
x-init="$watch('open', value => {
{{-- Inline x-cloak style to prevent flash --}}
<style>[x-cloak] { display: none !important; }</style>
<div x-data="{ open: @entangle('showModal'), currentSlide: @entangle('currentSlide'), ready: false }"
x-init="$nextTick(() => { ready = true; }); $watch('open', value => {
if(value) {
document.documentElement.style.overflow = 'hidden';
} else {
document.documentElement.style.overflow = '';
}
})"
x-show="open && ready"
x-cloak
style="position: fixed; top: 0; left: 0; right: 0; bottom: 0; z-index: 50; display: flex; align-items: center; justify-content: center; pointer-events: none;">
{{-- Backdrop --}}
@if($this->showBackdrop)
<div class="bg-black/50 transition-opacity duration-300"
style="position: absolute; top: 0; left: 0; right: 0; bottom: 0; pointer-events: auto;"
x-show="open"
x-show="open && ready"
x-transition:enter="transition ease-out duration-300"
x-transition:enter-start="opacity-0"
x-transition:enter-end="opacity-100"
@@ -30,7 +33,7 @@
{{-- Modal Dialog --}}
<div class="bg-background-secondary border border-neutral rounded-xl shadow-2xl overflow-visible"
style="position: relative; width: calc(100% - 2rem); max-width: 32rem; max-height: calc(100vh - 4rem); pointer-events: auto; z-index: 10;"
x-show="open"
x-show="open && ready"
x-transition:enter="transition ease-out duration-300"
x-transition:enter-start="opacity-0 scale-90"
x-transition:enter-end="opacity-100 scale-100"