chore: set AnimatedBg globally
This commit is contained in:
1 parent
f973e48561
commit
44d7401947
2 files changed
+3
-6
No files matched your search
@@ -1,13 +1,13 @@
|
|||||||
<script lang="ts">
|
<script lang="ts">
|
||||||
//TODO: maybe dynamic background images fetched from ezpp?
|
//TODO: maybe dynamic background images fetched from ezpp?
|
||||||
|
|
||||||
const COUNT = 120;
|
const COUNT = 60;
|
||||||
|
|
||||||
function rand(min: number, max: number) {
|
function rand(min: number, max: number) {
|
||||||
return Math.random() * (max - min) + min;
|
return Math.random() * (max - min) + min;
|
||||||
}
|
}
|
||||||
|
|
||||||
const streaks = Array.from({ length: COUNT }).map(() => {
|
const streaks = Array.from({ length: COUNT }).map((_, i) => {
|
||||||
const depth = rand(0, 2);
|
const depth = rand(0, 2);
|
||||||
|
|
||||||
const scale = 0.6 + depth * 0.8;
|
const scale = 0.6 + depth * 0.8;
|
||||||
@@ -19,7 +19,7 @@
|
|||||||
return {
|
return {
|
||||||
width: rand(180, 320) * scale,
|
width: rand(180, 320) * scale,
|
||||||
height: rand(16, 32) * scale,
|
height: rand(16, 32) * scale,
|
||||||
x: rand(-80, 100),
|
x: ((i * (180 / COUNT)) % 180) - 80,
|
||||||
y: rand(-80, 100),
|
y: rand(-80, 100),
|
||||||
opacity: 0.25 + depth * 0.65,
|
opacity: 0.25 + depth * 0.65,
|
||||||
duration,
|
duration,
|
||||||
|
|||||||
@@ -871,9 +871,6 @@
|
|||||||
</AlertDialog.Root>
|
</AlertDialog.Root>
|
||||||
|
|
||||||
<div class="grid grid-cols-[0.085fr_1fr] h-[100vh] relative">
|
<div class="grid grid-cols-[0.085fr_1fr] h-[100vh] relative">
|
||||||
<div class="absolute top-0 left-0 w-full h-[100vh] opacity-30 z-0">
|
|
||||||
<AnimatedBg />
|
|
||||||
</div>
|
|
||||||
<div
|
<div
|
||||||
class="p-3 border-r border-r-theme-900 flex flex-col items-center gap-2 z-10 bg-black/40 backdrop-blur-sm"
|
class="p-3 border-r border-r-theme-900 flex flex-col items-center gap-2 z-10 bg-black/40 backdrop-blur-sm"
|
||||||
>
|
>
|
||||||
|
|||||||
Reference in new issue
Block a user