fix: add x-cloak to content div to hide it until Alpine loads chartsLoaded
This commit is contained in:
@@ -106,6 +106,8 @@
|
||||
.telemetry-grow {
|
||||
animation: telemetryGrow 0.4s ease-out forwards;
|
||||
}
|
||||
/* Ensure loading shows by default before Alpine initializes */
|
||||
[x-cloak] { display: none !important; }
|
||||
</style>
|
||||
<section
|
||||
wire:poll.120s="stats"
|
||||
@@ -114,8 +116,8 @@
|
||||
@proxmox-chart-loaded.window="loadingProgress = Math.min(100, loadingProgress + 25)"
|
||||
class="bg-background-secondary border border-neutral rounded-2xl shadow-sm overflow-hidden"
|
||||
>
|
||||
<!-- Loading State - compact bar -->
|
||||
<div
|
||||
<!-- Loading State - compact bar, visible by default -->
|
||||
<div
|
||||
x-show="!chartsLoaded"
|
||||
class="flex items-center justify-center gap-3 py-3 px-4"
|
||||
>
|
||||
@@ -128,8 +130,9 @@
|
||||
<span class="text-base/70 text-sm">Loading Telemetry...</span>
|
||||
</div>
|
||||
|
||||
<!-- Content - hidden while loading -->
|
||||
<!-- Content - hidden by default with x-cloak until Alpine shows it -->
|
||||
<div
|
||||
x-cloak
|
||||
x-show="chartsLoaded"
|
||||
x-transition:enter="transition ease-out duration-300"
|
||||
x-transition:enter-start="opacity-0 transform scale-95"
|
||||
|
||||
Reference in New Issue
Block a user