Update +page.svelte

This commit is contained in:
luke-hagar-sp
2022-12-23 10:57:47 -06:00
parent d535ee37ab
commit 12bddb6f8d

View File

@@ -1,4 +1,4 @@
<script> <script lang="ts">
import AnimatedCounter from '$lib/AnimatedCounter.svelte'; import AnimatedCounter from '$lib/AnimatedCounter.svelte';
import { Avatar, GradientHeading } from '@skeletonlabs/skeleton'; import { Avatar, GradientHeading } from '@skeletonlabs/skeleton';
import Particles from 'svelte-particles'; import Particles from 'svelte-particles';
@@ -39,19 +39,19 @@
// decay: 0.01 // decay: 0.01
}, },
number: { number: {
value: 500 value: 200
} }
} }
}; };
const onParticlesLoaded = (event) => { const onParticlesLoaded = (event: any) => {
const particlesContainer = event.detail.particles; const particlesContainer = event.detail.particles;
// you can use particlesContainer to call all the Container class // you can use particlesContainer to call all the Container class
// (from the core library) methods like play, pause, refresh, start, stop // (from the core library) methods like play, pause, refresh, start, stop
}; };
const particlesInit = async (engine) => { const particlesInit = async (engine: any) => {
// you can use main to customize the tsParticles instance adding presets or custom shapes // you can use main to customize the tsParticles instance adding presets or custom shapes
// this loads the tsparticles package bundle, it's the easiest method for getting everything ready // this loads the tsparticles package bundle, it's the easiest method for getting everything ready
// starting from v2 you can add only the features you need reducing the bundle size // starting from v2 you can add only the features you need reducing the bundle size
@@ -94,7 +94,7 @@
transitionInterval={700} transitionInterval={700}
values={counterList} values={counterList}
random random
class="custom-skill" class="custom-skill px-2"
/>] />]
</div> </div>
</div> </div>
@@ -111,6 +111,5 @@
:global(.custom-skill) { :global(.custom-skill) {
display: inline-block; display: inline-block;
text-align: center; text-align: center;
@apply px-2;
} }
</style> </style>