mirror of
https://github.com/DavidHDev/vue-bits.git
synced 2026-04-21 17:44:39 -06:00
37 lines
876 B
TypeScript
37 lines
876 B
TypeScript
import code from '@/content/Animations/MagicRings/MagicRings.vue?raw';
|
|
import { createCodeObject } from '@/types/code';
|
|
|
|
export const magicRings = createCodeObject(code, 'Animations/MagicRings', {
|
|
usage: `<template>
|
|
<div style="width: 600px; height: 400px; position: relative;">
|
|
<MagicRings
|
|
color="#7cff67"
|
|
colorTwo="#42fcff"
|
|
:ringCount="6"
|
|
:speed="1"
|
|
:attenuation="10"
|
|
:lineThickness="2"
|
|
:baseRadius="0.35"
|
|
:radiusStep="0.1"
|
|
:scaleRate="0.1"
|
|
:opacity="1"
|
|
:blur="0"
|
|
:noiseAmount="0.1"
|
|
:rotation="0"
|
|
:ringGap="1.5"
|
|
:fadeIn="0.7"
|
|
:fadeOut="0.5"
|
|
:followMouse="false"
|
|
:mouseInfluence="0.2"
|
|
:hoverScale="1.2"
|
|
:parallax="0.05"
|
|
:clickBurst="false"
|
|
/>
|
|
</div>
|
|
</template>
|
|
|
|
<script setup>
|
|
import MagicRings from './MagicRings.vue'
|
|
</script>`
|
|
});
|