mirror of
https://github.com/DavidHDev/vue-bits.git
synced 2026-03-07 06:29:30 -07:00
40 lines
959 B
TypeScript
40 lines
959 B
TypeScript
import code from '@content/Backgrounds/Particles/Particles.vue?raw';
|
|
import type { CodeObject } from '../../../types/code';
|
|
|
|
export const particles: CodeObject = {
|
|
cli: `npx jsrepo add https://vue-bits.dev/ui/Backgrounds/Particles`,
|
|
installation: `npm install ogl`,
|
|
usage: `<template>
|
|
<div class="particles-container">
|
|
<Particles
|
|
:particle-count="200"
|
|
:particle-spread="10"
|
|
:speed="0.1"
|
|
:particle-colors="['#ffffff']"
|
|
:move-particles-on-hover="false"
|
|
:particle-hover-factor="1"
|
|
:alpha-particles="false"
|
|
:particle-base-size="100"
|
|
:size-randomness="1"
|
|
:camera-distance="20"
|
|
:disable-rotation="false"
|
|
class="w-full h-full"
|
|
/>
|
|
</div>
|
|
</template>
|
|
|
|
<script setup lang="ts">
|
|
import Particles from "./Particles.vue";
|
|
</script>
|
|
|
|
<style scoped>
|
|
.particles-container {
|
|
width: 100%;
|
|
height: 500px;
|
|
position: relative;
|
|
overflow: hidden;
|
|
}
|
|
</style>`,
|
|
code
|
|
};
|