62 lines
2.8 KiB
Svelte
62 lines
2.8 KiB
Svelte
<!-- Advanced Plasma Background -->
|
|
<div class="absolute inset-0 pointer-events-none">
|
|
<!-- Primary gradient layers -->
|
|
<div
|
|
class="absolute inset-0 bg-gradient-to-br from-primary/6 via-accent/10 to-primary/4 opacity-60"
|
|
></div>
|
|
<div
|
|
class="absolute inset-0 bg-gradient-to-tl from-accent/4 via-primary/8 to-accent/6 opacity-40"
|
|
></div>
|
|
|
|
<!-- Large floating orbs -->
|
|
<!-- <div
|
|
class="absolute top-20 left-20 w-80 h-80 bg-gradient-to-br from-primary/12 via-accent/18 to-primary/8 rounded-full blur-3xl animate-blob-slow"
|
|
></div>
|
|
<div
|
|
class="absolute bottom-20 right-20 w-96 h-96 bg-gradient-to-tl from-accent/12 via-primary/18 to-accent/8 rounded-full blur-3xl animate-blob-slow animation-delay-6000"
|
|
></div> -->
|
|
|
|
<!-- Medium morphing elements -->
|
|
<!-- <div
|
|
class="absolute top-1/2 left-1/3 w-64 h-64 bg-gradient-to-r from-primary/10 via-accent/15 to-primary/8 rounded-full blur-2xl animate-blob-reverse animation-delay-3000"
|
|
></div>
|
|
<div
|
|
class="absolute bottom-1/3 right-1/3 w-72 h-72 bg-gradient-to-l from-accent/10 via-primary/15 to-accent/8 rounded-full blur-2xl animate-blob-reverse animation-delay-9000"
|
|
></div> -->
|
|
|
|
<!-- Soft particle effects -->
|
|
<!-- <div
|
|
class="absolute top-1/4 right-1/4 w-48 h-48 bg-gradient-to-br from-primary/15 to-accent/12 rounded-full blur-xl animate-float animation-delay-2000"
|
|
></div>
|
|
<div
|
|
class="absolute bottom-1/4 left-1/4 w-56 h-56 bg-gradient-to-tl from-accent/15 to-primary/12 rounded-full blur-xl animate-float animation-delay-8000"
|
|
></div> -->
|
|
|
|
<!-- Premium glassmorphism overlay -->
|
|
<!-- <div
|
|
class="absolute inset-0 bg-gradient-to-br from-primary/2 via-transparent to-accent/3 backdrop-blur-[1px]"
|
|
></div> -->
|
|
|
|
<!-- Animated Plasma Background -->
|
|
<div
|
|
class="absolute top-1/3 left-1/3 w-72 h-72 bg-gradient-to-r from-accent/20 via-primary/25 to-accent/15 rounded-full blur-2xl animate-blob"
|
|
></div>
|
|
<div
|
|
class="absolute bottom-1/3 right-1/3 w-88 h-88 bg-gradient-to-r from-primary/20 via-accent/25 to-primary/15 rounded-full blur-3xl animate-blob-reverse animation-delay-3000"
|
|
></div>
|
|
<div
|
|
class="absolute top-1/2 right-1/4 w-64 h-64 bg-gradient-to-r from-accent/15 via-primary/20 to-accent/10 rounded-full blur-2xl animate-float animation-delay-1000"
|
|
></div>
|
|
|
|
<!-- Global Plasma Background -->
|
|
<!-- <div
|
|
class="absolute top-32 right-32 w-72 h-72 bg-gradient-to-r from-accent/18 via-primary/22 to-accent/12 rounded-full blur-3xl animate-blob"
|
|
></div>
|
|
<div
|
|
class="absolute bottom-32 left-32 w-88 h-88 bg-gradient-to-r from-primary/18 via-accent/22 to-primary/12 rounded-full blur-3xl animate-blob-reverse animation-delay-3000"
|
|
></div>
|
|
<div
|
|
class="absolute top-2/3 right-1/4 w-64 h-64 bg-gradient-to-r from-accent/15 via-primary/18 to-accent/10 rounded-full blur-2xl animate-float animation-delay-1500"
|
|
></div> -->
|
|
</div>
|