Revert "Increase status polling interval to 5 seconds across Proxmox views; update layout styles and add new CSS for improved UI elements and animations."

This reverts commit 8c6df92fe7.
This commit is contained in:
2026-03-01 03:59:10 -05:00
parent 8c6df92fe7
commit f688779e44
22 changed files with 1313 additions and 712 deletions

View File

@@ -103,11 +103,26 @@
@endif
<style>
/* Critical animations that should load immediately */
.animate-pulse-optimized {
animation: pulse-optimized 4s cubic-bezier(0.4, 0, 0.6, 1) infinite;
}
@keyframes pulse-optimized {
0%, 100% { opacity: 0.1; transform: scale(1); }
50% { opacity: 0.25; transform: scale(1.05); }
}
.low-performance * {
animation-duration: 0.1s !important;
transition-duration: 0.1s !important;
}
.low-performance .animate-pulse-optimized {
animation: none !important;
opacity: 0.1 !important;
}
.reveal-on-scroll {
transform: translateY(20px);
opacity: 0;
@@ -238,17 +253,17 @@
<x-navigation />
@if(!theme('background_image_url'))
<div class="fixed inset-0 overflow-hidden pointer-events-none z-0 text-primary mix-blend-screen">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1920 1080" preserveAspectRatio="xMidYMid slice" class="w-full h-full">
<defs>
<filter id="blob-blur-lg" x="-50%" y="-50%" width="200%" height="200%"><feGaussianBlur in="SourceGraphic" stdDeviation="120"/></filter>
<filter id="blob-blur-md" x="-50%" y="-50%" width="200%" height="200%"><feGaussianBlur in="SourceGraphic" stdDeviation="100"/></filter>
</defs>
<circle cx="960" cy="540" r="200" fill="currentColor" opacity="0.15" filter="url(#blob-blur-lg)"/>
<circle cx="1344" cy="324" r="96" fill="currentColor" opacity="0.10" filter="url(#blob-blur-lg)"/>
<circle cx="1632" cy="918" r="120" fill="currentColor" opacity="0.15" filter="url(#blob-blur-md)"/>
<circle cx="480" cy="270" r="100" fill="currentColor" opacity="0.10" filter="url(#blob-blur-md)"/>
</svg>
<div class="fixed inset-0 overflow-hidden pointer-events-none z-0">
<div class="absolute top-[50%] left-[50%] w-[300px] h-[300px] sm:w-[400px] sm:h-[400px] bg-primary rounded-full mix-blend-normal sm:mix-blend-screen filter blur-[40px] sm:blur-[120px] opacity-15 animate-pulse-optimized transform -translate-x-1/2 -translate-y-1/2"></div>
<div class="hidden sm:block absolute top-[30%] right-[30%] w-32 h-32 sm:w-48 sm:h-48 bg-primary rounded-full mix-blend-screen filter blur-[80px] sm:blur-[120px] opacity-10 animate-pulse-optimized"
style="animation-delay: -1s;"></div>
<div class="hidden md:block absolute bottom-[15%] right-[15%] w-40 h-40 sm:w-60 sm:h-60 bg-primary rounded-full mix-blend-screen filter blur-[70px] sm:blur-[100px] opacity-15 animate-pulse-optimized"
style="animation-delay: -2s;"></div>
<div class="hidden sm:block absolute top-[25%] left-[25%] w-[150px] h-[150px] sm:w-[200px] sm:h-[200px] bg-primary rounded-full mix-blend-screen filter blur-[60px] sm:blur-[90px] opacity-10 animate-pulse-optimized"
style="animation-delay: -3s;"></div>
</div>
@endif