pihkaal/lilou-cat
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: stars behind Lilou and reduce amount

Browse Source
This commit is contained in:
Pihkaal
2024-10-17 23:42:26 +02:00
parent 2c3e23c51c
commit 6bfb7baa15
2 changed files with 5 additions and 6 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
components/AppBody.vue
View File

@@ -1,6 +1,6 @@
<template> <template>
<main <main
class="h-full items-center p-5 justify-center flex flex-col space-y-4 bg-[#fa86c4]" class="h-full items-center relative p-5 justify-center flex flex-col space-y-4 bg-[#fa86c4] z-10"
> >
<NuxtRouteAnnouncer /> <NuxtRouteAnnouncer />
<h1 <h1
@@ -19,7 +19,7 @@
✨ Lilou ✨ ✨ Lilou ✨
</h1> </h1>
<div class="fixed inset-0"> <div class="absolute inset-0">
<StarshineGlitter /> <StarshineGlitter />
</div> </div>
</main> </main>

7
components/StarshineGlitter.vue
View File

@@ -1,8 +1,8 @@
<script setup lang="ts"> <script setup lang="ts">
const STARS = 500; const STARS = 250;
const MIN_SPARKLE = 2; const MIN_SPARKLE = 2;
const MAX_SPARKLE = 20; const MAX_SPARKLE = 15;
const MIN_SIZE = 15; const MIN_SIZE = 15;
const MAX_SIZE = 30; const MAX_SIZE = 30;
@@ -39,7 +39,7 @@ onMounted(() => {
</script> </script>
<template> <template>
<div ref="container" class="fixed inset-0" /> <div ref="container" class="fixed inset-0 -z-10" />
</template> </template>
<style> <style>
@@ -53,7 +53,6 @@ onMounted(() => {
background-position: center; background-position: center;
background-size: 100% 100%; background-size: 100% 100%;
overflow: hidden; overflow: hidden;
z-index: 2;
color: tansparent; color: tansparent;
opacity: 0; opacity: 0;
animation: glitter 6s linear 0s infinite normal; animation: glitter 6s linear 0s infinite normal;