diff --git a/.github/ISSUE_TEMPLATE/1-bug-report.yml b/.github/ISSUE_TEMPLATE/1-bug-report.yml index 17beb58..0df7898 100644 --- a/.github/ISSUE_TEMPLATE/1-bug-report.yml +++ b/.github/ISSUE_TEMPLATE/1-bug-report.yml @@ -1,47 +1,47 @@ name: 🐞 Bug report description: Help improve Vue Bits. -labels: ["bug"] -title: "[BUG]: " +labels: ['bug'] +title: '[BUG]: ' body: - - type: markdown - attributes: - value: | - ## Thanks for trying to improve Vue Bits! - Before continuing make sure you have checked other issues to see if your issue has already been reported / addressed. - - type: textarea - id: desc - attributes: - label: Describe the issue - description: What is happening right now? What is supposed to happen? - placeholder: When I do ..., it does ... but it should do ... - validations: - required: true - - type: markdown - attributes: - value: | - ## Reproduction + - type: markdown + attributes: + value: | + ## Thanks for trying to improve Vue Bits! + Before continuing make sure you have checked other issues to see if your issue has already been reported / addressed. + - type: textarea + id: desc + attributes: + label: Describe the issue + description: What is happening right now? What is supposed to happen? + placeholder: When I do ..., it does ... but it should do ... + validations: + required: true + - type: markdown + attributes: + value: | + ## Reproduction - Please provide code snippets/screenshots and, if possible/needed, a live environment where your bug can be reproduced. - - type: input - id: reproduction-link - attributes: - label: Reproduction Link - description: Link a live environment you used to reproduce. - placeholder: https://github.com/DavidHDev/vue-bits - validations: - required: false - - type: textarea - id: repro-steps - attributes: - label: Steps to reproduce - description: What steps should be taken to reproduce your issue. - validations: + Please provide code snippets/screenshots and, if possible/needed, a live environment where your bug can be reproduced. + - type: input + id: reproduction-link + attributes: + label: Reproduction Link + description: Link a live environment you used to reproduce. + placeholder: https://github.com/DavidHDev/vue-bits + validations: + required: false + - type: textarea + id: repro-steps + attributes: + label: Steps to reproduce + description: What steps should be taken to reproduce your issue. + validations: + required: true + - type: checkboxes + id: terms + attributes: + label: Validations + description: Please make sure you have checked all of the following. + options: + - label: I have checked other issues to see if my issue was already reported or addressed required: true - - type: checkboxes - id: terms - attributes: - label: Validations - description: Please make sure you have checked all of the following. - options: - - label: I have checked other issues to see if my issue was already reported or addressed - required: true \ No newline at end of file diff --git a/.github/ISSUE_TEMPLATE/2-feature-request.yml b/.github/ISSUE_TEMPLATE/2-feature-request.yml index 6704327..0e2de7c 100644 --- a/.github/ISSUE_TEMPLATE/2-feature-request.yml +++ b/.github/ISSUE_TEMPLATE/2-feature-request.yml @@ -1,26 +1,26 @@ name: πŸ’‘ Feature Request description: Suggest something for Vue Bits. -labels: ["enhancement"] -title: "[FEAT]: " +labels: ['enhancement'] +title: '[FEAT]: ' body: - - type: markdown - attributes: - value: | - ## Thanks for trying to improve Vue Bits! - Before continuing make sure you have checked other issues to see if your idea has already been discussed / addressed. - - type: textarea - id: desc - attributes: - label: Share your suggestion - description: What would you like to see in Vue Bits? - placeholder: I want flying pigs in a component please - validations: + - type: markdown + attributes: + value: | + ## Thanks for trying to improve Vue Bits! + Before continuing make sure you have checked other issues to see if your idea has already been discussed / addressed. + - type: textarea + id: desc + attributes: + label: Share your suggestion + description: What would you like to see in Vue Bits? + placeholder: I want flying pigs in a component please + validations: + required: true + - type: checkboxes + id: terms + attributes: + label: Validations + description: Please make sure you have checked all of the following. + options: + - label: I have checked other issues to see if my issue was already discussed or addressed required: true - - type: checkboxes - id: terms - attributes: - label: Validations - description: Please make sure you have checked all of the following. - options: - - label: I have checked other issues to see if my issue was already discussed or addressed - required: true \ No newline at end of file diff --git a/.prettierignore b/.prettierignore new file mode 100644 index 0000000..5d94291 --- /dev/null +++ b/.prettierignore @@ -0,0 +1,34 @@ +# Dependencies +node_modules/ + +# Build outputs +dist/ +build/ +public/ui/ + +# OS files +.DS_Store +Thumbs.db + +# IDE files +.vscode/ +.idea/ + +# Logs +*.log + +# Cache +.cache/ +.parcel-cache/ +.nuxt/ +.next/ +.vite/ + +# Environment files +.env +.env.local +.env.*.local + +# Generated files +coverage/ +*.tsbuildinfo diff --git a/.prettierrc b/.prettierrc new file mode 100644 index 0000000..85e84fe --- /dev/null +++ b/.prettierrc @@ -0,0 +1,14 @@ +{ + "semi": true, + "singleQuote": true, + "tabWidth": 2, + "trailingComma": "none", + "printWidth": 120, + "bracketSpacing": true, + "arrowParens": "avoid", + "endOfLine": "lf", + "vueIndentScriptAndStyle": false, + "htmlWhitespaceSensitivity": "ignore", + "bracketSameLine": false, + "singleAttributePerLine": false +} diff --git a/README.md b/README.md index c67732f..f0511c8 100644 --- a/README.md +++ b/README.md @@ -28,9 +28,9 @@ Go to [vue-bits.dev](https://vue-bits.dev/) to view the documentation. ## About -This is the official Vue port of [React Bits](https://reactbits.dev)! +This is the official Vue port of [React Bits](https://reactbits.dev)! -Vue Bits is a large collection of animated Vue UI components made to spice up your web creations. We've got animations, components, backgrounds, and awesome stuff that you won't be able to find anywhere else - all free for you to use! +Vue Bits is a large collection of animated Vue UI components made to spice up your web creations. We've got animations, components, backgrounds, and awesome stuff that you won't be able to find anywhere else - all free for you to use! These components are all enhanced with customization options as props, to make it easy for you to get exactly what you need. @@ -62,7 +62,7 @@ Please review the [Contribution Guide](https://github.com/DavidHDev/vue-bits/blo ## Stats -![Alt](https://repobeats.axiom.co/api/embed/02689c621a09cc5b492ccc1b4bb2f764e32500b7.svg "Repobeats analytics image") +![Alt](https://repobeats.axiom.co/api/embed/02689c621a09cc5b492ccc1b4bb2f764e32500b7.svg 'Repobeats analytics image') ## Sponsorship diff --git a/eslint.config.ts b/eslint.config.ts index 0acea8e..5472bb1 100644 --- a/eslint.config.ts +++ b/eslint.config.ts @@ -1,11 +1,11 @@ -import { globalIgnores } from 'eslint/config' -import { defineConfigWithVueTs, vueTsConfigs } from '@vue/eslint-config-typescript' -import pluginVue from 'eslint-plugin-vue' +import { globalIgnores } from 'eslint/config'; +import { defineConfigWithVueTs, vueTsConfigs } from '@vue/eslint-config-typescript'; +import pluginVue from 'eslint-plugin-vue'; export default defineConfigWithVueTs( { name: 'app/files-to-lint', - files: ['**/*.{ts,mts,tsx,vue}'], + files: ['**/*.{ts,mts,tsx,vue}'] }, globalIgnores(['**/dist/**', '**/dist-ssr/**', '**/coverage/**']), @@ -18,7 +18,7 @@ export default defineConfigWithVueTs( files: ['**/*.vue'], rules: { 'vue/multi-word-component-names': 'off', - 'vue/no-reserved-component-names': 'off', - }, - }, -) + 'vue/no-reserved-component-names': 'off' + } + } +); diff --git a/index.html b/index.html index bac3082..7709c90 100644 --- a/index.html +++ b/index.html @@ -1,99 +1,107 @@ - + + + + + + + + + - - - - - - - - + + + + + + + + + + - - - - - - - - - - + + + + + + + - - - - - - - + + + + + + + + + + + - - - - - - - - - - - + + + + + + - - - - - - + + + + - - - - + + + - - - - - - - Vue Bits - Animated UI Components For Vue - + + Vue Bits - Animated UI Components For Vue + - -
- - - - \ No newline at end of file + +
+ + + diff --git a/jsrepo-build-config.json b/jsrepo-build-config.json index 29643a7..85ee01d 100644 --- a/jsrepo-build-config.json +++ b/jsrepo-build-config.json @@ -1,37 +1,37 @@ { - "$schema": "https://unpkg.com/jsrepo@1.30.1/schemas/registry-config.json", - "meta": { - "authors": ["David Haz"], - "description": "An open source collection of animated, interactive & fully customizable Vue components for building stunning, memorable user interfaces.", - "bugs": "https://github.com/DavidHDev/vue-bits/issues", - "homepage": "https://vue-bits.dev", - "repository": "https://github.com/DavidHDev/vue-bits", - "tags": [ - "vue", - "javascript", - "components", - "web", - "vuejs", - "css-animations", - "component-library", - "ui-components", - "3d", - "ui-library", - "tailwind", - "tailwindcss", - "components", - "components-library" - ] - }, - "dirs": [], - "doNotListBlocks": [], - "doNotListCategories": [], - "listBlocks": [], - "listCategories": [], - "excludeDeps": ["vue"], - "includeBlocks": [], - "includeCategories": [], - "excludeBlocks": [], - "excludeCategories": [], - "preview": true + "$schema": "https://unpkg.com/jsrepo@1.30.1/schemas/registry-config.json", + "meta": { + "authors": ["David Haz"], + "description": "An open source collection of animated, interactive & fully customizable Vue components for building stunning, memorable user interfaces.", + "bugs": "https://github.com/DavidHDev/vue-bits/issues", + "homepage": "https://vue-bits.dev", + "repository": "https://github.com/DavidHDev/vue-bits", + "tags": [ + "vue", + "javascript", + "components", + "web", + "vuejs", + "css-animations", + "component-library", + "ui-components", + "3d", + "ui-library", + "tailwind", + "tailwindcss", + "components", + "components-library" + ] + }, + "dirs": [], + "doNotListBlocks": [], + "doNotListCategories": [], + "listBlocks": [], + "listCategories": [], + "excludeDeps": ["vue"], + "includeBlocks": [], + "includeCategories": [], + "excludeBlocks": [], + "excludeCategories": [], + "preview": true } diff --git a/package-lock.json b/package-lock.json index a3c070d..aa07415 100644 --- a/package-lock.json +++ b/package-lock.json @@ -41,6 +41,7 @@ "jsrepo": "^1.30.1", "npm-run-all2": "^8.0.4", "postcss": "^8.5.6", + "prettier": "^3.6.2", "tailwindcss": "^4.1.11", "typescript": "~5.8.0", "vite": "^7.0.0", diff --git a/package.json b/package.json index cba736a..537c416 100644 --- a/package.json +++ b/package.json @@ -11,6 +11,8 @@ "build-only": "vite build", "type-check": "vue-tsc --build", "lint": "eslint . --fix", + "format": "prettier --write .", + "format:check": "prettier --check .", "new:component": "node scripts/generateComponent.js" }, "dependencies": { @@ -47,6 +49,7 @@ "jsrepo": "^1.30.1", "npm-run-all2": "^8.0.4", "postcss": "^8.5.6", + "prettier": "^3.6.2", "tailwindcss": "^4.1.11", "typescript": "~5.8.0", "vite": "^7.0.0", diff --git a/public/site.webmanifest b/public/site.webmanifest index 45dc8a2..0b08af1 100644 --- a/public/site.webmanifest +++ b/public/site.webmanifest @@ -1 +1,11 @@ -{"name":"","short_name":"","icons":[{"src":"/android-chrome-192x192.png","sizes":"192x192","type":"image/png"},{"src":"/android-chrome-512x512.png","sizes":"512x512","type":"image/png"}],"theme_color":"#ffffff","background_color":"#ffffff","display":"standalone"} \ No newline at end of file +{ + "name": "", + "short_name": "", + "icons": [ + { "src": "/android-chrome-192x192.png", "sizes": "192x192", "type": "image/png" }, + { "src": "/android-chrome-512x512.png", "sizes": "512x512", "type": "image/png" } + ], + "theme_color": "#ffffff", + "background_color": "#ffffff", + "display": "standalone" +} diff --git a/scripts/cleanEmptyLines.js b/scripts/cleanEmptyLines.js new file mode 100644 index 0000000..e69de29 diff --git a/scripts/generateComponent.js b/scripts/generateComponent.js index 110686b..eb264b1 100644 --- a/scripts/generateComponent.js +++ b/scripts/generateComponent.js @@ -1,15 +1,15 @@ -import fs from "fs"; -import path from "path"; -import process from "process"; +import fs from 'fs'; +import path from 'path'; +import process from 'process'; -import { fileURLToPath } from "url"; +import { fileURLToPath } from 'url'; const __filename = fileURLToPath(import.meta.url); const __dirname = path.dirname(__filename); const args = process.argv.slice(2); if (args.length < 2) { - console.error("Usage: npm run generate:component "); + console.error('Usage: npm run generate:component '); process.exit(1); } @@ -17,12 +17,12 @@ const [componentType, componentName] = args; const componentNameLower = componentName.charAt(0).toLowerCase() + componentName.slice(1); const paths = { - content: path.join(__dirname, "../src/content", componentType, componentName), - demo: path.join(__dirname, "../src/demo", componentType), - constants: path.join(__dirname, "../src/constants/code", componentType), + content: path.join(__dirname, '../src/content', componentType, componentName), + demo: path.join(__dirname, '../src/demo', componentType), + constants: path.join(__dirname, '../src/constants/code', componentType) }; -Object.values(paths).forEach((dir) => { +Object.values(paths).forEach(dir => { if (!fs.existsSync(dir)) { fs.mkdirSync(dir, { recursive: true }); } @@ -31,12 +31,12 @@ Object.values(paths).forEach((dir) => { const files = [ path.join(paths.content, `${componentName}.vue`), path.join(paths.demo, `${componentName}Demo.vue`), - path.join(paths.constants, `${componentNameLower}Code.ts`), + path.join(paths.constants, `${componentNameLower}Code.ts`) ]; -files.forEach((file) => { +files.forEach(file => { if (!fs.existsSync(file)) { - fs.writeFileSync(file, ""); + fs.writeFileSync(file, ''); } }); diff --git a/src/App.vue b/src/App.vue index 4733645..29f3a14 100644 --- a/src/App.vue +++ b/src/App.vue @@ -1,27 +1,24 @@ diff --git a/src/components/code/CliInstallation.vue b/src/components/code/CliInstallation.vue index 1384cc4..b830c21 100644 --- a/src/components/code/CliInstallation.vue +++ b/src/components/code/CliInstallation.vue @@ -2,12 +2,21 @@

One-Time Installation

- +

Full CLI Setup

+

Vue Bits uses jsrepo @@ -17,23 +26,57 @@ Setup Steps + + :pt="{ + transition: { + enterFromClass: '', + enterActiveClass: '', + enterToClass: '', + leaveFromClass: '', + leaveActiveClass: '', + leaveToClass: '' + } + }" + >

1. Initialize a config file for your project

- +

2. Browse & add components from the list

- + +

3. Or just add a specific component

- + +
@@ -42,15 +85,15 @@ \ No newline at end of file + diff --git a/src/components/code/CodeExample.vue b/src/components/code/CodeExample.vue index 5bdcc98..cc41b9f 100644 --- a/src/components/code/CodeExample.vue +++ b/src/components/code/CodeExample.vue @@ -4,14 +4,25 @@

{{ getDisplayName(name) }}

-
- +
+
-
@@ -19,6 +30,7 @@
Nothing here yet! +
@@ -26,58 +38,55 @@ \ No newline at end of file + diff --git a/src/components/landing/PlasmaWave/PlasmaWave.vue b/src/components/landing/PlasmaWave/PlasmaWave.vue index 7310aa9..f554cc4 100644 --- a/src/components/landing/PlasmaWave/PlasmaWave.vue +++ b/src/components/landing/PlasmaWave/PlasmaWave.vue @@ -1,29 +1,32 @@ \ No newline at end of file +}); + diff --git a/src/components/landing/StartBuilding/StartBuilding.css b/src/components/landing/StartBuilding/StartBuilding.css index 8b442b5..bef9290 100644 --- a/src/components/landing/StartBuilding/StartBuilding.css +++ b/src/components/landing/StartBuilding/StartBuilding.css @@ -17,9 +17,7 @@ max-width: 1200px; user-select: none; margin: 0 auto; - background: linear-gradient(135deg, - #3aed6d, - rgba(24, 255, 93, 0.6)); + background: linear-gradient(135deg, #3aed6d, rgba(24, 255, 93, 0.6)); background-size: 200% 200%; border-radius: 16px; padding: 4rem 3rem; @@ -78,7 +76,7 @@ background: transparent; color: #0b0b0b; border: 2px solid #0b0b0b; - padding: .6rem 1.6rem; + padding: 0.6rem 1.6rem; font-size: 1.1rem; font-weight: 600; border-radius: 50px; @@ -88,7 +86,7 @@ .start-building-button:hover { background: #0b0b0b; - color: #27FF64; + color: #27ff64; } @media (max-width: 1280px) { @@ -159,4 +157,4 @@ padding: 0.75rem 1.5rem; font-size: 0.95rem; } -} \ No newline at end of file +} diff --git a/src/components/landing/StartBuilding/StartBuilding.vue b/src/components/landing/StartBuilding/StartBuilding.vue index 5d881ab..eac09c6 100644 --- a/src/components/landing/StartBuilding/StartBuilding.vue +++ b/src/components/landing/StartBuilding/StartBuilding.vue @@ -3,16 +3,15 @@

Start exploring Vue Bits

+

Animations, components, backgrounds - it's all here

- - Browse Components - + Browse Components
\ No newline at end of file +import './StartBuilding.css'; + diff --git a/src/components/layouts/CategoryLayout.vue b/src/components/layouts/CategoryLayout.vue index 546d4d3..712daea 100644 --- a/src/components/layouts/CategoryLayout.vue +++ b/src/components/layouts/CategoryLayout.vue @@ -1,20 +1,24 @@ \ No newline at end of file + diff --git a/src/components/navs/Header.vue b/src/components/navs/Header.vue index 91952b9..4af8f34 100644 --- a/src/components/navs/Header.vue +++ b/src/components/navs/Header.vue @@ -28,6 +28,7 @@
+ @@ -35,12 +36,13 @@
+
-

Useful Links

- - Docs - + + Docs + GitHub @@ -68,6 +70,7 @@

Other

+ Who made this? @@ -80,58 +83,58 @@ \ No newline at end of file + document.removeEventListener('keydown', handleKeyDown); +}); + diff --git a/src/components/navs/Sidebar.vue b/src/components/navs/Sidebar.vue index 90c039c..2087102 100644 --- a/src/components/navs/Sidebar.vue +++ b/src/components/navs/Sidebar.vue @@ -1,5 +1,6 @@ \ No newline at end of file +}); + diff --git a/src/composables/useForceRerender.ts b/src/composables/useForceRerender.ts index fba5ae4..b6d8ab7 100644 --- a/src/composables/useForceRerender.ts +++ b/src/composables/useForceRerender.ts @@ -1,18 +1,18 @@ -import { ref } from 'vue' +import { ref } from 'vue'; /** * Composable for force re-rendering components * Useful for demo components that need to restart animations or reset state */ export function useForceRerender() { - const rerenderKey = ref(0) + const rerenderKey = ref(0); const forceRerender = () => { - rerenderKey.value++ - } + rerenderKey.value++; + }; return { rerenderKey, forceRerender - } + }; } diff --git a/src/composables/useStars.ts b/src/composables/useStars.ts index 5bd69cd..9dd0507 100644 --- a/src/composables/useStars.ts +++ b/src/composables/useStars.ts @@ -1,48 +1,51 @@ -import { ref, onMounted } from 'vue' -import { getStarsCount } from '@/utils/utils' +import { ref, onMounted } from 'vue'; +import { getStarsCount } from '@/utils/utils'; -const CACHE_KEY = 'github_stars_cache' -const CACHE_DURATION = 24 * 60 * 60 * 1000 +const CACHE_KEY = 'github_stars_cache'; +const CACHE_DURATION = 24 * 60 * 60 * 1000; export function useStars() { - const stars = ref(0) + const stars = ref(0); const fetchStars = async () => { try { - const cachedData = localStorage.getItem(CACHE_KEY) - + const cachedData = localStorage.getItem(CACHE_KEY); + if (cachedData) { - const { count, timestamp } = JSON.parse(cachedData) - const now = Date.now() - + const { count, timestamp } = JSON.parse(cachedData); + const now = Date.now(); + if (now - timestamp < CACHE_DURATION) { - stars.value = count - return + stars.value = count; + return; } } - - const count = await getStarsCount() - - localStorage.setItem(CACHE_KEY, JSON.stringify({ - count, - timestamp: Date.now() - })) - - stars.value = count + + const count = await getStarsCount(); + + localStorage.setItem( + CACHE_KEY, + JSON.stringify({ + count, + timestamp: Date.now() + }) + ); + + stars.value = count; } catch (error) { - console.error('Error fetching stars:', error) - - const cachedData = localStorage.getItem(CACHE_KEY) + console.error('Error fetching stars:', error); + + const cachedData = localStorage.getItem(CACHE_KEY); if (cachedData) { - const { count } = JSON.parse(cachedData) - stars.value = count + const { count } = JSON.parse(cachedData); + stars.value = count; } } - } + }; onMounted(() => { - fetchStars() - }) + fetchStars(); + }); - return stars + return stars; } diff --git a/src/constants/Categories.ts b/src/constants/Categories.ts index 20a5126..29eb24e 100644 --- a/src/constants/Categories.ts +++ b/src/constants/Categories.ts @@ -20,7 +20,7 @@ export const CATEGORIES = [ 'Text Cursor', 'Decrypted Text', 'True Focus', - 'Scroll Float', + 'Scroll Float' ] }, { @@ -34,7 +34,7 @@ export const CATEGORIES = [ 'Count Up', 'Click Spark', 'Magnet', - 'Cubes', + 'Cubes' ] }, { @@ -55,8 +55,8 @@ export const CATEGORIES = [ 'Glass Icons', 'Decay Card', 'Flowing Menu', - 'Elastic Slider', - ], + 'Elastic Slider' + ] }, { name: 'Backgrounds', @@ -73,6 +73,6 @@ export const CATEGORIES = [ 'Iridescence', 'Threads', 'Grid Motion' - ], + ] } ]; diff --git a/src/constants/Components.ts b/src/constants/Components.ts index 1bae9f4..dc761d3 100644 --- a/src/constants/Components.ts +++ b/src/constants/Components.ts @@ -1,69 +1,69 @@ const animations = { - 'fade-content': () => import("../demo/Animations/FadeContentDemo.vue"), - 'animated-content': () => import("../demo/Animations/AnimatedContentDemo.vue"), - 'pixel-transition': () => import("../demo/Animations/PixelTransitionDemo.vue"), - 'glare-hover': () => import("../demo/Animations/GlareHoverDemo.vue"), - 'magnet-lines': () => import("../demo/Animations/MagnetLinesDemo.vue"), - 'click-spark': () => import("../demo/Animations/ClickSparkDemo.vue"), - 'magnet': () => import("../demo/Animations/MagnetDemo.vue"), - 'cubes': () => import("../demo/Animations/CubesDemo.vue"), - 'count-up': () => import("../demo/Animations/CountUpDemo.vue"), + 'fade-content': () => import('../demo/Animations/FadeContentDemo.vue'), + 'animated-content': () => import('../demo/Animations/AnimatedContentDemo.vue'), + 'pixel-transition': () => import('../demo/Animations/PixelTransitionDemo.vue'), + 'glare-hover': () => import('../demo/Animations/GlareHoverDemo.vue'), + 'magnet-lines': () => import('../demo/Animations/MagnetLinesDemo.vue'), + 'click-spark': () => import('../demo/Animations/ClickSparkDemo.vue'), + magnet: () => import('../demo/Animations/MagnetDemo.vue'), + cubes: () => import('../demo/Animations/CubesDemo.vue'), + 'count-up': () => import('../demo/Animations/CountUpDemo.vue') }; const textAnimations = { - 'split-text': () => import("../demo/TextAnimations/SplitTextDemo.vue"), - 'blur-text': () => import("../demo/TextAnimations/BlurTextDemo.vue"), - 'circular-text': () => import("../demo/TextAnimations/CircularTextDemo.vue"), - 'shiny-text': () => import("../demo/TextAnimations/ShinyTextDemo.vue"), - 'text-pressure': () => import("../demo/TextAnimations/TextPressureDemo.vue"), - 'curved-loop': () => import("../demo/TextAnimations/CurvedLoopDemo.vue"), - 'fuzzy-text': () => import("../demo/TextAnimations/FuzzyTextDemo.vue"), - 'gradient-text': () => import("../demo/TextAnimations/GradientTextDemo.vue"), - 'text-trail': () => import("../demo/TextAnimations/TextTrailDemo.vue"), - 'falling-text': () => import("../demo/TextAnimations/FallingTextDemo.vue"), - 'text-cursor': () => import("../demo/TextAnimations/TextCursorDemo.vue"), - 'decrypted-text': () => import("../demo/TextAnimations/DecryptedTextDemo.vue"), - 'true-focus': () => import("../demo/TextAnimations/TrueFocusDemo.vue"), - 'scroll-float': () => import("../demo/TextAnimations/ScrollFloatDemo.vue"), + 'split-text': () => import('../demo/TextAnimations/SplitTextDemo.vue'), + 'blur-text': () => import('../demo/TextAnimations/BlurTextDemo.vue'), + 'circular-text': () => import('../demo/TextAnimations/CircularTextDemo.vue'), + 'shiny-text': () => import('../demo/TextAnimations/ShinyTextDemo.vue'), + 'text-pressure': () => import('../demo/TextAnimations/TextPressureDemo.vue'), + 'curved-loop': () => import('../demo/TextAnimations/CurvedLoopDemo.vue'), + 'fuzzy-text': () => import('../demo/TextAnimations/FuzzyTextDemo.vue'), + 'gradient-text': () => import('../demo/TextAnimations/GradientTextDemo.vue'), + 'text-trail': () => import('../demo/TextAnimations/TextTrailDemo.vue'), + 'falling-text': () => import('../demo/TextAnimations/FallingTextDemo.vue'), + 'text-cursor': () => import('../demo/TextAnimations/TextCursorDemo.vue'), + 'decrypted-text': () => import('../demo/TextAnimations/DecryptedTextDemo.vue'), + 'true-focus': () => import('../demo/TextAnimations/TrueFocusDemo.vue'), + 'scroll-float': () => import('../demo/TextAnimations/ScrollFloatDemo.vue') }; const components = { - 'masonry': () => import("../demo/Components/MasonryDemo.vue"), - 'profile-card': () => import("../demo/Components/ProfileCardDemo.vue"), - 'dock': () => import("../demo/Components/DockDemo.vue"), - 'gooey-nav': () => import("../demo/Components/GooeyNavDemo.vue"), - 'pixel-card': () => import("../demo/Components/PixelCardDemo.vue"), - 'carousel': () => import("../demo/Components/CarouselDemo.vue"), - 'spotlight-card': () => import("../demo/Components/SpotlightCardDemo.vue"), - 'circular-gallery': () => import("../demo/Components/CircularGalleryDemo.vue"), - 'flying-posters': () => import("../demo/Components/FlyingPostersDemo.vue"), - 'card-swap': () => import("../demo/Components/CardSwapDemo.vue"), - 'infinite-scroll': () => import("../demo/Components/InfiniteScrollDemo.vue"), - 'glass-icons': () => import("../demo/Components/GlassIconsDemo.vue"), - 'decay-card': () => import("../demo/Components/DecayCardDemo.vue"), - 'flowing-menu': () => import("../demo/Components/FlowingMenuDemo.vue"), - 'elastic-slider': () => import("../demo/Components/ElasticSliderDemo.vue"), - 'tilted-card': () => import("../demo/Components/TiltedCardDemo.vue"), + masonry: () => import('../demo/Components/MasonryDemo.vue'), + 'profile-card': () => import('../demo/Components/ProfileCardDemo.vue'), + dock: () => import('../demo/Components/DockDemo.vue'), + 'gooey-nav': () => import('../demo/Components/GooeyNavDemo.vue'), + 'pixel-card': () => import('../demo/Components/PixelCardDemo.vue'), + carousel: () => import('../demo/Components/CarouselDemo.vue'), + 'spotlight-card': () => import('../demo/Components/SpotlightCardDemo.vue'), + 'circular-gallery': () => import('../demo/Components/CircularGalleryDemo.vue'), + 'flying-posters': () => import('../demo/Components/FlyingPostersDemo.vue'), + 'card-swap': () => import('../demo/Components/CardSwapDemo.vue'), + 'infinite-scroll': () => import('../demo/Components/InfiniteScrollDemo.vue'), + 'glass-icons': () => import('../demo/Components/GlassIconsDemo.vue'), + 'decay-card': () => import('../demo/Components/DecayCardDemo.vue'), + 'flowing-menu': () => import('../demo/Components/FlowingMenuDemo.vue'), + 'elastic-slider': () => import('../demo/Components/ElasticSliderDemo.vue'), + 'tilted-card': () => import('../demo/Components/TiltedCardDemo.vue') }; const backgrounds = { - 'dot-grid': () => import("../demo/Backgrounds/DotGridDemo.vue"), - 'silk': () => import("../demo/Backgrounds/SilkDemo.vue"), - 'lightning': () => import("../demo/Backgrounds/LightningDemo.vue"), - 'letter-glitch': () => import("../demo/Backgrounds/LetterGlitchDemo.vue"), - 'particles': () => import("../demo/Backgrounds/ParticlesDemo.vue"), - 'waves': () => import("../demo/Backgrounds/WavesDemo.vue"), - 'squares': () => import("../demo/Backgrounds/SquaresDemo.vue"), - 'iridescence': () => import("../demo/Backgrounds/IridescenceDemo.vue"), - 'threads': () => import("../demo/Backgrounds/ThreadsDemo.vue"), - 'aurora': () => import("../demo/Backgrounds/AuroraDemo.vue"), - 'beams': () => import("../demo/Backgrounds/BeamsDemo.vue"), - 'grid-motion': () => import("../demo/Backgrounds/GridMotionDemo.vue"), + 'dot-grid': () => import('../demo/Backgrounds/DotGridDemo.vue'), + silk: () => import('../demo/Backgrounds/SilkDemo.vue'), + lightning: () => import('../demo/Backgrounds/LightningDemo.vue'), + 'letter-glitch': () => import('../demo/Backgrounds/LetterGlitchDemo.vue'), + particles: () => import('../demo/Backgrounds/ParticlesDemo.vue'), + waves: () => import('../demo/Backgrounds/WavesDemo.vue'), + squares: () => import('../demo/Backgrounds/SquaresDemo.vue'), + iridescence: () => import('../demo/Backgrounds/IridescenceDemo.vue'), + threads: () => import('../demo/Backgrounds/ThreadsDemo.vue'), + aurora: () => import('../demo/Backgrounds/AuroraDemo.vue'), + beams: () => import('../demo/Backgrounds/BeamsDemo.vue'), + 'grid-motion': () => import('../demo/Backgrounds/GridMotionDemo.vue') }; export const componentMap = { ...animations, ...textAnimations, ...components, - ...backgrounds, + ...backgrounds }; diff --git a/src/constants/code/Animations/animatedContentCode.ts b/src/constants/code/Animations/animatedContentCode.ts index 11b8113..a371169 100644 --- a/src/constants/code/Animations/animatedContentCode.ts +++ b/src/constants/code/Animations/animatedContentCode.ts @@ -1,5 +1,5 @@ -import code from '@/content/Animations/AnimatedContent/AnimatedContent.vue?raw' -import type { CodeObject } from '@/types/code' +import code from '@/content/Animations/AnimatedContent/AnimatedContent.vue?raw'; +import type { CodeObject } from '@/types/code'; export const animatedContent: CodeObject = { cli: `npx jsrepo add https://vue-bits.dev/ui/Animations/AnimatedContent`, @@ -32,4 +32,4 @@ export const animatedContent: CodeObject = { }; `, code -} \ No newline at end of file +}; diff --git a/src/constants/code/Animations/clickSparkCode.ts b/src/constants/code/Animations/clickSparkCode.ts index 6616a38..e34dbf2 100644 --- a/src/constants/code/Animations/clickSparkCode.ts +++ b/src/constants/code/Animations/clickSparkCode.ts @@ -1,5 +1,5 @@ -import code from '@content/Animations/ClickSpark/ClickSpark.vue?raw' -import type { CodeObject } from '../../../types/code' +import code from '@content/Animations/ClickSpark/ClickSpark.vue?raw'; +import type { CodeObject } from '../../../types/code'; export const clickSpark: CodeObject = { cli: `npx jsrepo add https://vue-bits.dev/ui/Animations/ClickSpark`, @@ -44,4 +44,4 @@ import ClickSpark from '@/content/Animations/ClickSpark/ClickSpark.vue' } `, code -} +}; diff --git a/src/constants/code/Animations/countUpCode.ts b/src/constants/code/Animations/countUpCode.ts index 4253352..bba56d4 100644 --- a/src/constants/code/Animations/countUpCode.ts +++ b/src/constants/code/Animations/countUpCode.ts @@ -1,5 +1,5 @@ -import code from '@/content/Animations/CountUp/CountUp.vue?raw' -import type { CodeObject } from '@/types/code' +import code from '@/content/Animations/CountUp/CountUp.vue?raw'; +import type { CodeObject } from '@/types/code'; export const countup: CodeObject = { cli: `npx jsrepo add https://vue-bits.dev/ui/Animations/CountUp`, @@ -30,4 +30,4 @@ export const countup: CodeObject = { }; `, code -} +}; diff --git a/src/constants/code/Animations/cubesCode.ts b/src/constants/code/Animations/cubesCode.ts index 00e7cb1..a210173 100644 --- a/src/constants/code/Animations/cubesCode.ts +++ b/src/constants/code/Animations/cubesCode.ts @@ -1,5 +1,5 @@ -import code from '@content/Animations/Cubes/Cubes.vue?raw' -import type { CodeObject } from '../../../types/code' +import code from '@content/Animations/Cubes/Cubes.vue?raw'; +import type { CodeObject } from '../../../types/code'; export const cubes: CodeObject = { cli: `npx jsrepo add https://vue-bits.dev/ui/Animations/Cubes`, @@ -29,4 +29,4 @@ export const cubes: CodeObject = { import Cubes from "./Cubes.vue"; `, code -} +}; diff --git a/src/constants/code/Animations/fadeContentCode.ts b/src/constants/code/Animations/fadeContentCode.ts index 711dfb0..740d822 100644 --- a/src/constants/code/Animations/fadeContentCode.ts +++ b/src/constants/code/Animations/fadeContentCode.ts @@ -1,5 +1,5 @@ -import code from '@content/Animations/FadeContent/FadeContent.vue?raw' -import type { CodeObject } from '../../../types/code' +import code from '@content/Animations/FadeContent/FadeContent.vue?raw'; +import type { CodeObject } from '../../../types/code'; export const fadeContent: CodeObject = { cli: `npx jsrepo add https://vue-bits.dev/ui/Animations/FadeContent`, @@ -24,4 +24,4 @@ export const fadeContent: CodeObject = { import FadeContent from "./FadeContent.vue"; `, code -} +}; diff --git a/src/constants/code/Animations/glareHoverCode.ts b/src/constants/code/Animations/glareHoverCode.ts index ee72600..f13d79d 100644 --- a/src/constants/code/Animations/glareHoverCode.ts +++ b/src/constants/code/Animations/glareHoverCode.ts @@ -1,5 +1,5 @@ -import code from '@/content/Animations/GlareHover/GlareHover.vue?raw' -import type { CodeObject } from '@/types/code' +import code from '@/content/Animations/GlareHover/GlareHover.vue?raw'; +import type { CodeObject } from '@/types/code'; export const glareHover: CodeObject = { cli: `npx jsrepo add https://vue-bits.dev/ui/Animations/GlareHover`, @@ -26,4 +26,4 @@ export const glareHover: CodeObject = { import GlareHover from "./GlareHover.vue"; `, code -} +}; diff --git a/src/constants/code/Animations/magnetCode.ts b/src/constants/code/Animations/magnetCode.ts index ae0d169..6c94358 100644 --- a/src/constants/code/Animations/magnetCode.ts +++ b/src/constants/code/Animations/magnetCode.ts @@ -1,5 +1,5 @@ -import code from '@content/Animations/Magnet/Magnet.vue?raw' -import type { CodeObject } from '../../../types/code' +import code from '@content/Animations/Magnet/Magnet.vue?raw'; +import type { CodeObject } from '../../../types/code'; export const magnet: CodeObject = { cli: `npx jsrepo add https://vue-bits.dev/ui/Animations/Magnet`, @@ -45,4 +45,4 @@ import Magnet from '@/content/Animations/Magnet/Magnet.vue' } `, code -} +}; diff --git a/src/constants/code/Animations/magnetLinesCode.ts b/src/constants/code/Animations/magnetLinesCode.ts index a469c87..d753422 100644 --- a/src/constants/code/Animations/magnetLinesCode.ts +++ b/src/constants/code/Animations/magnetLinesCode.ts @@ -1,5 +1,5 @@ -import code from '@/content/Animations/MagnetLines/MagnetLines.vue?raw' -import type { CodeObject } from '@/types/code' +import code from '@/content/Animations/MagnetLines/MagnetLines.vue?raw'; +import type { CodeObject } from '@/types/code'; export const magnetLines: CodeObject = { cli: `npx jsrepo add https://vue-bits.dev/ui/Animations/MagnetLines`, @@ -19,4 +19,4 @@ export const magnetLines: CodeObject = { import MagnetLines from "./MagnetLines.vue"; `, code -} +}; diff --git a/src/constants/code/Animations/pixelTransitionCode.ts b/src/constants/code/Animations/pixelTransitionCode.ts index e58acd3..737e708 100644 --- a/src/constants/code/Animations/pixelTransitionCode.ts +++ b/src/constants/code/Animations/pixelTransitionCode.ts @@ -1,5 +1,5 @@ -import code from '@/content/Animations/PixelTransition/PixelTransition.vue?raw' -import type { CodeObject } from '@/types/code' +import code from '@/content/Animations/PixelTransition/PixelTransition.vue?raw'; +import type { CodeObject } from '@/types/code'; export const pixelTransition: CodeObject = { cli: `npx jsrepo add https://vue-bits.dev/ui/Animations/PixelTransition`, @@ -26,4 +26,4 @@ export const pixelTransition: CodeObject = { import PixelTransition from './PixelTransition.vue'; `, code -} +}; diff --git a/src/constants/code/Backgrounds/auroraCode.ts b/src/constants/code/Backgrounds/auroraCode.ts index f8d9f04..5a00daf 100644 --- a/src/constants/code/Backgrounds/auroraCode.ts +++ b/src/constants/code/Backgrounds/auroraCode.ts @@ -1,5 +1,5 @@ -import code from '@content/Backgrounds/Aurora/Aurora.vue?raw' -import type { CodeObject } from '../../../types/code' +import code from '@content/Backgrounds/Aurora/Aurora.vue?raw'; +import type { CodeObject } from '../../../types/code'; export const aurora: CodeObject = { cli: `npx jsrepo add https://vue-bits.dev/ui/Backgrounds/Aurora`, @@ -30,4 +30,4 @@ export const aurora: CodeObject = { } `, code -} \ No newline at end of file +}; diff --git a/src/constants/code/Backgrounds/beamsCode.ts b/src/constants/code/Backgrounds/beamsCode.ts index 753e6d9..96e9cf4 100644 --- a/src/constants/code/Backgrounds/beamsCode.ts +++ b/src/constants/code/Backgrounds/beamsCode.ts @@ -1,5 +1,5 @@ -import code from '@content/Backgrounds/Beams/Beams.vue?raw' -import type { CodeObject } from '../../../types/code' +import code from '@content/Backgrounds/Beams/Beams.vue?raw'; +import type { CodeObject } from '../../../types/code'; export const beams: CodeObject = { cli: `npx jsrepo add https://vue-bits.dev/ui/Backgrounds/Beams`, @@ -33,4 +33,4 @@ export const beams: CodeObject = { } `, code -} +}; diff --git a/src/constants/code/Backgrounds/dotGridCode.ts b/src/constants/code/Backgrounds/dotGridCode.ts index d1e4b5a..798ba4c 100644 --- a/src/constants/code/Backgrounds/dotGridCode.ts +++ b/src/constants/code/Backgrounds/dotGridCode.ts @@ -1,5 +1,5 @@ -import code from '@content/Backgrounds/DotGrid/DotGrid.vue?raw' -import type { CodeObject } from '../../../types/code' +import code from '@content/Backgrounds/DotGrid/DotGrid.vue?raw'; +import type { CodeObject } from '../../../types/code'; export const dotGrid: CodeObject = { cli: `npx jsrepo add https://vue-bits.dev/ui/Backgrounds/DotGrid`, @@ -36,4 +36,4 @@ export const dotGrid: CodeObject = { } `, code -} +}; diff --git a/src/constants/code/Backgrounds/iridescenceCode.ts b/src/constants/code/Backgrounds/iridescenceCode.ts index 547da77..46e60ad 100644 --- a/src/constants/code/Backgrounds/iridescenceCode.ts +++ b/src/constants/code/Backgrounds/iridescenceCode.ts @@ -1,5 +1,5 @@ -import code from '@content/Backgrounds/Iridescence/Iridescence.vue?raw' -import type { CodeObject } from '../../../types/code' +import code from '@content/Backgrounds/Iridescence/Iridescence.vue?raw'; +import type { CodeObject } from '../../../types/code'; export const iridescence: CodeObject = { cli: `npx jsrepo add https://vue-bits.dev/ui/Backgrounds/Iridescence`, @@ -19,4 +19,4 @@ export const iridescence: CodeObject = { import Iridescence from "./Iridescence.vue"; `, code -} \ No newline at end of file +}; diff --git a/src/constants/code/Backgrounds/letterGlitchCode.ts b/src/constants/code/Backgrounds/letterGlitchCode.ts index 50d09c4..5dc7cf5 100644 --- a/src/constants/code/Backgrounds/letterGlitchCode.ts +++ b/src/constants/code/Backgrounds/letterGlitchCode.ts @@ -1,5 +1,5 @@ -import code from '@content/Backgrounds/LetterGlitch/LetterGlitch.vue?raw' -import type { CodeObject } from '../../../types/code' +import code from '@content/Backgrounds/LetterGlitch/LetterGlitch.vue?raw'; +import type { CodeObject } from '../../../types/code'; export const letterGlitch: CodeObject = { cli: `npx jsrepo add https://vue-bits.dev/ui/Backgrounds/LetterGlitch`, @@ -29,4 +29,4 @@ export const letterGlitch: CodeObject = { } `, code -} +}; diff --git a/src/constants/code/Backgrounds/lightningCode.ts b/src/constants/code/Backgrounds/lightningCode.ts index b444c69..843e1ef 100644 --- a/src/constants/code/Backgrounds/lightningCode.ts +++ b/src/constants/code/Backgrounds/lightningCode.ts @@ -1,5 +1,5 @@ -import code from '@content/Backgrounds/Lightning/Lightning.vue?raw' -import type { CodeObject } from '../../../types/code' +import code from '@content/Backgrounds/Lightning/Lightning.vue?raw'; +import type { CodeObject } from '../../../types/code'; export const lightning: CodeObject = { cli: `npx jsrepo add https://vue-bits.dev/ui/Backgrounds/Lightning`, @@ -30,4 +30,4 @@ export const lightning: CodeObject = { } `, code -} +}; diff --git a/src/constants/code/Backgrounds/particlesCode.ts b/src/constants/code/Backgrounds/particlesCode.ts index adbd599..e0d2c35 100644 --- a/src/constants/code/Backgrounds/particlesCode.ts +++ b/src/constants/code/Backgrounds/particlesCode.ts @@ -1,5 +1,5 @@ -import code from '@content/Backgrounds/Particles/Particles.vue?raw' -import type { CodeObject } from '../../../types/code' +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`, @@ -36,4 +36,4 @@ export const particles: CodeObject = { } `, code -} +}; diff --git a/src/constants/code/Backgrounds/silkCode.ts b/src/constants/code/Backgrounds/silkCode.ts index 3946b91..18291ab 100644 --- a/src/constants/code/Backgrounds/silkCode.ts +++ b/src/constants/code/Backgrounds/silkCode.ts @@ -1,5 +1,5 @@ -import code from '@content/Backgrounds/Silk/Silk.vue?raw' -import type { CodeObject } from '../../../types/code' +import code from '@content/Backgrounds/Silk/Silk.vue?raw'; +import type { CodeObject } from '../../../types/code'; export const silk: CodeObject = { cli: `npx jsrepo add https://vue-bits.dev/ui/Backgrounds/Silk`, @@ -30,4 +30,4 @@ export const silk: CodeObject = { } `, code -} +}; diff --git a/src/constants/code/Backgrounds/squaresCode.ts b/src/constants/code/Backgrounds/squaresCode.ts index 6e4daae..3cff934 100644 --- a/src/constants/code/Backgrounds/squaresCode.ts +++ b/src/constants/code/Backgrounds/squaresCode.ts @@ -1,5 +1,5 @@ -import code from '@content/Backgrounds/Squares/Squares.vue?raw' -import type { CodeObject } from '../../../types/code' +import code from '@content/Backgrounds/Squares/Squares.vue?raw'; +import type { CodeObject } from '../../../types/code'; export const squares: CodeObject = { cli: `npx jsrepo add https://vue-bits.dev/ui/Backgrounds/Squares`, @@ -19,4 +19,4 @@ export const squares: CodeObject = { import Squares from "./Squares.vue"; `, code -} \ No newline at end of file +}; diff --git a/src/constants/code/Backgrounds/threadsCode.ts b/src/constants/code/Backgrounds/threadsCode.ts index 86dfe06..5593a1b 100644 --- a/src/constants/code/Backgrounds/threadsCode.ts +++ b/src/constants/code/Backgrounds/threadsCode.ts @@ -1,5 +1,5 @@ -import code from '@content/Backgrounds/Threads/Threads.vue?raw' -import type { CodeObject } from '../../../types/code' +import code from '@content/Backgrounds/Threads/Threads.vue?raw'; +import type { CodeObject } from '../../../types/code'; export const threads: CodeObject = { cli: `npx jsrepo add https://vue-bits.dev/ui/Backgrounds/Threads`, @@ -19,4 +19,4 @@ export const threads: CodeObject = { import Threads from "./Threads.vue"; `, code -} \ No newline at end of file +}; diff --git a/src/constants/code/Backgrounds/wavesCode.ts b/src/constants/code/Backgrounds/wavesCode.ts index c576678..806c20e 100644 --- a/src/constants/code/Backgrounds/wavesCode.ts +++ b/src/constants/code/Backgrounds/wavesCode.ts @@ -1,5 +1,5 @@ -import code from '@content/Backgrounds/Waves/Waves.vue?raw' -import type { CodeObject } from '../../../types/code' +import code from '@content/Backgrounds/Waves/Waves.vue?raw'; +import type { CodeObject } from '../../../types/code'; export const waves: CodeObject = { cli: `npx jsrepo add https://vue-bits.dev/ui/Backgrounds/Waves`, @@ -35,4 +35,4 @@ export const waves: CodeObject = { } `, code -} +}; diff --git a/src/constants/code/Components/cardSwapCode.ts b/src/constants/code/Components/cardSwapCode.ts index a012bd3..2bfbb41 100644 --- a/src/constants/code/Components/cardSwapCode.ts +++ b/src/constants/code/Components/cardSwapCode.ts @@ -1,5 +1,5 @@ -import code from '@content/Components/CardSwap/CardSwap.vue?raw' -import type { CodeObject } from '../../../types/code' +import code from '@content/Components/CardSwap/CardSwap.vue?raw'; +import type { CodeObject } from '../../../types/code'; export const cardSwap: CodeObject = { cli: `npx jsrepo add https://vue-bits.dev/ui/Components/CardSwap`, @@ -51,4 +51,4 @@ export const cardSwap: CodeObject = { }; `, code -} +}; diff --git a/src/constants/code/Components/carouselCode.ts b/src/constants/code/Components/carouselCode.ts index 907c1bd..29c9c4e 100644 --- a/src/constants/code/Components/carouselCode.ts +++ b/src/constants/code/Components/carouselCode.ts @@ -1,5 +1,5 @@ -import code from '@content/Components/Carousel/Carousel.vue?raw' -import type { CodeObject } from '../../../types/code' +import code from '@content/Components/Carousel/Carousel.vue?raw'; +import type { CodeObject } from '../../../types/code'; export const carousel: CodeObject = { cli: `npx jsrepo add https://vue-bits.dev/ui/Components/Carousel`, @@ -37,4 +37,4 @@ export const carousel: CodeObject = { ]; `, code -} +}; diff --git a/src/constants/code/Components/circularGalleryCode.ts b/src/constants/code/Components/circularGalleryCode.ts index 7c7efbd..ebf4715 100644 --- a/src/constants/code/Components/circularGalleryCode.ts +++ b/src/constants/code/Components/circularGalleryCode.ts @@ -1,5 +1,5 @@ -import code from '@content/Components/CircularGallery/CircularGallery.vue?raw' -import type { CodeObject } from '../../../types/code' +import code from '@content/Components/CircularGallery/CircularGallery.vue?raw'; +import type { CodeObject } from '../../../types/code'; export const circularGallery: CodeObject = { cli: `npx jsrepo add https://vue-bits.dev/ui/Components/CircularGallery`, @@ -24,4 +24,4 @@ export const circularGallery: CodeObject = { import CircularGallery from "./CircularGallery.vue"; `, code -} +}; diff --git a/src/constants/code/Components/decayCardCode.ts b/src/constants/code/Components/decayCardCode.ts index 674157f..5a723e8 100644 --- a/src/constants/code/Components/decayCardCode.ts +++ b/src/constants/code/Components/decayCardCode.ts @@ -1,5 +1,5 @@ -import code from '@content/Components/DecayCard/DecayCard.vue?raw' -import type { CodeObject } from '../../../types/code' +import code from '@content/Components/DecayCard/DecayCard.vue?raw'; +import type { CodeObject } from '../../../types/code'; export const decayCard: CodeObject = { cli: `npx jsrepo add https://vue-bits.dev/ui/Components/DecayCard`, @@ -20,4 +20,4 @@ export const decayCard: CodeObject = { import DecayCard from "./DecayCard.vue"; `, code -} +}; diff --git a/src/constants/code/Components/dockCode.ts b/src/constants/code/Components/dockCode.ts index 7651bc2..c6f16ab 100644 --- a/src/constants/code/Components/dockCode.ts +++ b/src/constants/code/Components/dockCode.ts @@ -1,5 +1,5 @@ -import code from '@content/Components/Dock/Dock.vue?raw' -import type { CodeObject } from '../../../types/code' +import code from '@content/Components/Dock/Dock.vue?raw'; +import type { CodeObject } from '../../../types/code'; export const dock: CodeObject = { cli: `npx jsrepo add https://vue-bits.dev/ui/Components/Dock`, @@ -44,4 +44,4 @@ export const dock: CodeObject = { ]; `, code -} \ No newline at end of file +}; diff --git a/src/constants/code/Components/elasticSliderCode.ts b/src/constants/code/Components/elasticSliderCode.ts index 6f94a99..1ca7731 100644 --- a/src/constants/code/Components/elasticSliderCode.ts +++ b/src/constants/code/Components/elasticSliderCode.ts @@ -1,5 +1,5 @@ -import code from '@content/Components/ElasticSlider/ElasticSlider.vue?raw' -import type { CodeObject } from '../../../types/code' +import code from '@content/Components/ElasticSlider/ElasticSlider.vue?raw'; +import type { CodeObject } from '../../../types/code'; export const elasticSlider: CodeObject = { cli: `npx jsrepo add https://vue-bits.dev/ui/Components/ElasticSlider`, @@ -27,4 +27,4 @@ export const elasticSlider: CodeObject = { import ElasticSlider from "./ElasticSlider.vue"; `, code -} +}; diff --git a/src/constants/code/Components/flowingMenuCode.ts b/src/constants/code/Components/flowingMenuCode.ts index 0a3f4d7..fd18c57 100644 --- a/src/constants/code/Components/flowingMenuCode.ts +++ b/src/constants/code/Components/flowingMenuCode.ts @@ -1,5 +1,5 @@ -import code from '@content/Components/FlowingMenu/FlowingMenu.vue?raw' -import type { CodeObject } from '../../../types/code' +import code from '@content/Components/FlowingMenu/FlowingMenu.vue?raw'; +import type { CodeObject } from '../../../types/code'; export const flowingMenu: CodeObject = { cli: `npx jsrepo add https://vue-bits.dev/ui/Components/FlowingMenu`, @@ -19,4 +19,4 @@ export const flowingMenu: CodeObject = { ]; `, code -} +}; diff --git a/src/constants/code/Components/flyingPostersCode.ts b/src/constants/code/Components/flyingPostersCode.ts index 0399a7c..658dd24 100644 --- a/src/constants/code/Components/flyingPostersCode.ts +++ b/src/constants/code/Components/flyingPostersCode.ts @@ -1,5 +1,5 @@ -import code from '@content/Components/FlyingPosters/FlyingPosters.vue?raw' -import type { CodeObject } from '../../../types/code' +import code from '@content/Components/FlyingPosters/FlyingPosters.vue?raw'; +import type { CodeObject } from '../../../types/code'; export const flyingPosters: CodeObject = { cli: `npx jsrepo add https://vue-bits.dev/ui/Components/FlyingPosters`, @@ -34,4 +34,4 @@ export const flyingPosters: CodeObject = { ]; `, code -} +}; diff --git a/src/constants/code/Components/glassIconsCode.ts b/src/constants/code/Components/glassIconsCode.ts index 8a3b0fc..a0c0e68 100644 --- a/src/constants/code/Components/glassIconsCode.ts +++ b/src/constants/code/Components/glassIconsCode.ts @@ -1,5 +1,5 @@ -import code from '@content/Components/GlassIcons/GlassIcons.vue?raw' -import type { CodeObject } from '../../../types/code' +import code from '@content/Components/GlassIcons/GlassIcons.vue?raw'; +import type { CodeObject } from '../../../types/code'; export const glassIcons: CodeObject = { cli: `npx jsrepo add https://vue-bits.dev/ui/Components/GlassIcons`, @@ -20,4 +20,4 @@ export const glassIcons: CodeObject = { ]; `, code -} +}; diff --git a/src/constants/code/Components/gooeyNavCode.ts b/src/constants/code/Components/gooeyNavCode.ts index 34e7cee..47dede4 100644 --- a/src/constants/code/Components/gooeyNavCode.ts +++ b/src/constants/code/Components/gooeyNavCode.ts @@ -1,5 +1,5 @@ -import code from '@content/Components/GooeyNav/GooeyNav.vue?raw' -import type { CodeObject } from '../../../types/code' +import code from '@content/Components/GooeyNav/GooeyNav.vue?raw'; +import type { CodeObject } from '../../../types/code'; export const gooeyNav: CodeObject = { cli: `npx jsrepo add https://vue-bits.dev/ui/Components/GooeyNav`, @@ -37,4 +37,4 @@ export const gooeyNav: CodeObject = { } `, code -} +}; diff --git a/src/constants/code/Components/infiniteScrollCode.ts b/src/constants/code/Components/infiniteScrollCode.ts index 530700c..87c8a2d 100644 --- a/src/constants/code/Components/infiniteScrollCode.ts +++ b/src/constants/code/Components/infiniteScrollCode.ts @@ -1,5 +1,5 @@ -import code from '@content/Components/InfiniteScroll/InfiniteScroll.vue?raw' -import type { CodeObject } from '../../../types/code' +import code from '@content/Components/InfiniteScroll/InfiniteScroll.vue?raw'; +import type { CodeObject } from '../../../types/code'; export const infiniteScroll: CodeObject = { cli: `npx jsrepo add https://vue-bits.dev/ui/Components/InfiniteScroll`, @@ -31,4 +31,4 @@ export const infiniteScroll: CodeObject = { ]; `, code -} +}; diff --git a/src/constants/code/Components/masonryCode.ts b/src/constants/code/Components/masonryCode.ts index 41657da..b207d46 100644 --- a/src/constants/code/Components/masonryCode.ts +++ b/src/constants/code/Components/masonryCode.ts @@ -1,5 +1,5 @@ -import code from '@content/Components/Masonry/Masonry.vue?raw' -import type { CodeObject } from '../../../types/code' +import code from '@content/Components/Masonry/Masonry.vue?raw'; +import type { CodeObject } from '../../../types/code'; export const masonry: CodeObject = { cli: `npx jsrepo add https://vue-bits.dev/ui/Components/Masonry`, @@ -29,4 +29,4 @@ const items = ref([ ]) `, code -} +}; diff --git a/src/constants/code/Components/pixelCardCode.ts b/src/constants/code/Components/pixelCardCode.ts index 636d44d..25738f7 100644 --- a/src/constants/code/Components/pixelCardCode.ts +++ b/src/constants/code/Components/pixelCardCode.ts @@ -1,5 +1,5 @@ -import code from '@content/Components/PixelCard/PixelCard.vue?raw' -import type { CodeObject } from '../../../types/code' +import code from '@content/Components/PixelCard/PixelCard.vue?raw'; +import type { CodeObject } from '../../../types/code'; export const pixelCard: CodeObject = { cli: `npx jsrepo add https://vue-bits.dev/ui/Components/PixelCard`, @@ -18,4 +18,4 @@ export const pixelCard: CodeObject = { import PixelCard from "./PixelCard.vue"; `, code -} +}; diff --git a/src/constants/code/Components/profileCardCode.ts b/src/constants/code/Components/profileCardCode.ts index d0e1de8..fe2cd1d 100644 --- a/src/constants/code/Components/profileCardCode.ts +++ b/src/constants/code/Components/profileCardCode.ts @@ -1,5 +1,5 @@ -import code from '@content/Components/ProfileCard/ProfileCard.vue?raw' -import type { CodeObject } from '../../../types/code' +import code from '@content/Components/ProfileCard/ProfileCard.vue?raw'; +import type { CodeObject } from '../../../types/code'; export const profileCard: CodeObject = { cli: `npx jsrepo add https://vue-bits.dev/ui/Components/ProfileCard`, @@ -28,4 +28,4 @@ export const profileCard: CodeObject = { }; `, code -} \ No newline at end of file +}; diff --git a/src/constants/code/Components/spotlightCardCode.ts b/src/constants/code/Components/spotlightCardCode.ts index 1bf7e08..e479b24 100644 --- a/src/constants/code/Components/spotlightCardCode.ts +++ b/src/constants/code/Components/spotlightCardCode.ts @@ -1,5 +1,5 @@ -import code from '@content/Components/SpotlightCard/SpotlightCard.vue?raw' -import type { CodeObject } from '../../../types/code' +import code from '@content/Components/SpotlightCard/SpotlightCard.vue?raw'; +import type { CodeObject } from '../../../types/code'; export const spotlightCard: CodeObject = { cli: `npx jsrepo add https://vue-bits.dev/ui/Components/SpotlightCard`, @@ -16,4 +16,4 @@ export const spotlightCard: CodeObject = { import SpotlightCard from "./SpotlightCard.vue"; `, code -} +}; diff --git a/src/constants/code/Components/tiltedCardCode.ts b/src/constants/code/Components/tiltedCardCode.ts index 84e331b..936a40a 100644 --- a/src/constants/code/Components/tiltedCardCode.ts +++ b/src/constants/code/Components/tiltedCardCode.ts @@ -1,5 +1,5 @@ -import code from '@content/Components/TiltedCard/TiltedCard.vue?raw' -import type { CodeObject } from '../../../types/code' +import code from '@content/Components/TiltedCard/TiltedCard.vue?raw'; +import type { CodeObject } from '../../../types/code'; export const tiltedCard: CodeObject = { cli: `npx jsrepo add https://vue-bits.dev/ui/Components/TiltedCard`, @@ -31,4 +31,4 @@ export const tiltedCard: CodeObject = { import TiltedCard from "./TiltedCard.vue"; `, code -} \ No newline at end of file +}; diff --git a/src/constants/code/TextAnimations/blurTextCode.ts b/src/constants/code/TextAnimations/blurTextCode.ts index 5e99363..cb45462 100644 --- a/src/constants/code/TextAnimations/blurTextCode.ts +++ b/src/constants/code/TextAnimations/blurTextCode.ts @@ -1,5 +1,5 @@ -import code from '@content/TextAnimations/BlurText/BlurText.vue?raw' -import type { CodeObject } from '../../../types/code' +import code from '@content/TextAnimations/BlurText/BlurText.vue?raw'; +import type { CodeObject } from '../../../types/code'; export const blurText: CodeObject = { cli: `npx jsrepo add https://vue-bits.dev/ui/TextAnimations/BlurText`, @@ -26,4 +26,4 @@ export const blurText: CodeObject = { }; `, code -} +}; diff --git a/src/constants/code/TextAnimations/circularTextCode.ts b/src/constants/code/TextAnimations/circularTextCode.ts index a12d88e..a423cdc 100644 --- a/src/constants/code/TextAnimations/circularTextCode.ts +++ b/src/constants/code/TextAnimations/circularTextCode.ts @@ -1,5 +1,5 @@ -import code from '@content/TextAnimations/CircularText/CircularText.vue?raw' -import type { CodeObject } from '../../../types/code' +import code from '@content/TextAnimations/CircularText/CircularText.vue?raw'; +import type { CodeObject } from '../../../types/code'; export const circularText: CodeObject = { cli: `npx jsrepo add https://vue-bits.dev/ui/TextAnimations/CircularText`, @@ -17,4 +17,4 @@ export const circularText: CodeObject = { import CircularText from "./CircularText.vue"; `, code -} +}; diff --git a/src/constants/code/TextAnimations/curvedLoopCode.ts b/src/constants/code/TextAnimations/curvedLoopCode.ts index 19c4abd..6d6a039 100644 --- a/src/constants/code/TextAnimations/curvedLoopCode.ts +++ b/src/constants/code/TextAnimations/curvedLoopCode.ts @@ -1,5 +1,5 @@ -import code from '@content/TextAnimations/CurvedLoop/CurvedLoop.vue?raw' -import type { CodeObject } from '../../../types/code' +import code from '@content/TextAnimations/CurvedLoop/CurvedLoop.vue?raw'; +import type { CodeObject } from '../../../types/code'; export const curvedLoop: CodeObject = { cli: `npx jsrepo add https://vue-bits.dev/ui/TextAnimations/CurvedLoop`, @@ -17,4 +17,4 @@ export const curvedLoop: CodeObject = { import CurvedLoop from "./CurvedLoop.vue"; `, code -} +}; diff --git a/src/constants/code/TextAnimations/decryptedTextCode.ts b/src/constants/code/TextAnimations/decryptedTextCode.ts index 5a363a0..f5b6ff6 100644 --- a/src/constants/code/TextAnimations/decryptedTextCode.ts +++ b/src/constants/code/TextAnimations/decryptedTextCode.ts @@ -1,5 +1,5 @@ -import code from '@/content/TextAnimations/DecryptedText/DecryptedText.vue?raw' -import type { CodeObject } from '@/types/code' +import code from '@/content/TextAnimations/DecryptedText/DecryptedText.vue?raw'; +import type { CodeObject } from '@/types/code'; export const decryptedText: CodeObject = { cli: `npx jsrepo add https://vue-bits.dev/ui/TextAnimations/DecryptedText`, @@ -21,4 +21,4 @@ export const decryptedText: CodeObject = { import DecryptedText from "./DecryptedText.vue"; `, code -} +}; diff --git a/src/constants/code/TextAnimations/fallingTextCode.ts b/src/constants/code/TextAnimations/fallingTextCode.ts index 390ea19..8f25b06 100644 --- a/src/constants/code/TextAnimations/fallingTextCode.ts +++ b/src/constants/code/TextAnimations/fallingTextCode.ts @@ -1,5 +1,5 @@ -import code from '@/content/TextAnimations/FallingText/FallingText.vue?raw' -import type { CodeObject } from '@/types/code' +import code from '@/content/TextAnimations/FallingText/FallingText.vue?raw'; +import type { CodeObject } from '@/types/code'; export const fallingText: CodeObject = { cli: `npx jsrepo add https://vue-bits.dev/ui/TextAnimations/FallingText`, @@ -19,4 +19,4 @@ export const fallingText: CodeObject = { import FallingText from "./FallingText.vue"; `, code -} +}; diff --git a/src/constants/code/TextAnimations/fuzzyTextCode.ts b/src/constants/code/TextAnimations/fuzzyTextCode.ts index f329b01..61746ed 100644 --- a/src/constants/code/TextAnimations/fuzzyTextCode.ts +++ b/src/constants/code/TextAnimations/fuzzyTextCode.ts @@ -1,5 +1,5 @@ -import code from '@content/TextAnimations/FuzzyText/FuzzyText.vue?raw' -import type { CodeObject } from '../../../types/code' +import code from '@content/TextAnimations/FuzzyText/FuzzyText.vue?raw'; +import type { CodeObject } from '../../../types/code'; export const fuzzyText: CodeObject = { cli: `npx jsrepo add https://vue-bits.dev/ui/TextAnimations/FuzzyText`, @@ -19,4 +19,4 @@ export const fuzzyText: CodeObject = { import FuzzyText from "./FuzzyText.vue"; `, code -} +}; diff --git a/src/constants/code/TextAnimations/gradientTextCode.ts b/src/constants/code/TextAnimations/gradientTextCode.ts index 44a2e70..fc1dd32 100644 --- a/src/constants/code/TextAnimations/gradientTextCode.ts +++ b/src/constants/code/TextAnimations/gradientTextCode.ts @@ -1,5 +1,5 @@ -import code from '@content/TextAnimations/GradientText/GradientText.vue?raw' -import type { CodeObject } from '../../../types/code' +import code from '@content/TextAnimations/GradientText/GradientText.vue?raw'; +import type { CodeObject } from '../../../types/code'; export const gradientText: CodeObject = { cli: `npx jsrepo add https://vue-bits.dev/ui/TextAnimations/GradientText`, @@ -17,4 +17,4 @@ export const gradientText: CodeObject = { import GradientText from "./GradientText.vue"; `, code -} +}; diff --git a/src/constants/code/TextAnimations/scrollFloatCode.ts b/src/constants/code/TextAnimations/scrollFloatCode.ts index f7bba6c..a659927 100644 --- a/src/constants/code/TextAnimations/scrollFloatCode.ts +++ b/src/constants/code/TextAnimations/scrollFloatCode.ts @@ -1,5 +1,5 @@ -import code from '@content/TextAnimations/ScrollFloat/ScrollFloat.vue?raw' -import type { CodeObject } from '../../../types/code' +import code from '@content/TextAnimations/ScrollFloat/ScrollFloat.vue?raw'; +import type { CodeObject } from '../../../types/code'; export const scrollFloatCode: CodeObject = { cli: `npx jsrepo add https://vue-bits.dev/ui/TextAnimations/ScrollFloat`, @@ -22,4 +22,4 @@ export const scrollFloatCode: CodeObject = { import ScrollFloat from "./ScrollFloat.vue"; `, code -} \ No newline at end of file +}; diff --git a/src/constants/code/TextAnimations/shinyTextCode.ts b/src/constants/code/TextAnimations/shinyTextCode.ts index 7cf718b..1b02686 100644 --- a/src/constants/code/TextAnimations/shinyTextCode.ts +++ b/src/constants/code/TextAnimations/shinyTextCode.ts @@ -1,5 +1,5 @@ -import code from '@content/TextAnimations/ShinyText/ShinyText.vue?raw' -import type { CodeObject } from '../../../types/code' +import code from '@content/TextAnimations/ShinyText/ShinyText.vue?raw'; +import type { CodeObject } from '../../../types/code'; export const shinyText: CodeObject = { cli: `npx jsrepo add https://vue-bits.dev/ui/TextAnimations/ShinyText`, @@ -16,4 +16,4 @@ export const shinyText: CodeObject = { import ShinyText from "./ShinyText.vue"; `, code -} +}; diff --git a/src/constants/code/TextAnimations/splitTextCode.ts b/src/constants/code/TextAnimations/splitTextCode.ts index 6e1b354..5bbe926 100644 --- a/src/constants/code/TextAnimations/splitTextCode.ts +++ b/src/constants/code/TextAnimations/splitTextCode.ts @@ -1,6 +1,6 @@ // Fun fact: this is the first component ever made for Vue Bits! -import code from '@content/TextAnimations/SplitText/SplitText.vue?raw' -import type { CodeObject } from '../../../types/code' +import code from '@content/TextAnimations/SplitText/SplitText.vue?raw'; +import type { CodeObject } from '../../../types/code'; export const splitText: CodeObject = { cli: `npx jsrepo add https://vue-bits.dev/ui/TextAnimations/SplitText`, @@ -30,4 +30,4 @@ export const splitText: CodeObject = { }; `, code -} \ No newline at end of file +}; diff --git a/src/constants/code/TextAnimations/textCursorCode.ts b/src/constants/code/TextAnimations/textCursorCode.ts index 358fa70..7642cb1 100644 --- a/src/constants/code/TextAnimations/textCursorCode.ts +++ b/src/constants/code/TextAnimations/textCursorCode.ts @@ -1,5 +1,5 @@ -import code from '@/content/TextAnimations/TextCursor/TextCursor.vue?raw' -import type { CodeObject } from '@/types/code' +import code from '@/content/TextAnimations/TextCursor/TextCursor.vue?raw'; +import type { CodeObject } from '@/types/code'; export const textCursor: CodeObject = { cli: `npx jsrepo add https://vue-bits.dev/ui/TextAnimations/TextCursor`, @@ -21,4 +21,4 @@ export const textCursor: CodeObject = { import TextCursor from "./TextCursor.vue"; `, code -} +}; diff --git a/src/constants/code/TextAnimations/textPressureCode.ts b/src/constants/code/TextAnimations/textPressureCode.ts index 292ea4d..c014493 100644 --- a/src/constants/code/TextAnimations/textPressureCode.ts +++ b/src/constants/code/TextAnimations/textPressureCode.ts @@ -1,5 +1,5 @@ -import code from '@content/TextAnimations/TextPressure/TextPressure.vue?raw' -import type { CodeObject } from '../../../types/code' +import code from '@content/TextAnimations/TextPressure/TextPressure.vue?raw'; +import type { CodeObject } from '../../../types/code'; export const textPressure: CodeObject = { cli: `npx jsrepo add https://vue-bits.dev/ui/TextAnimations/TextPressure`, @@ -22,4 +22,4 @@ export const textPressure: CodeObject = { import TextPressure from "./TextPressure.vue"; `, code -} +}; diff --git a/src/constants/code/TextAnimations/textTrailCode.ts b/src/constants/code/TextAnimations/textTrailCode.ts index 9f1dc23..6d59f67 100644 --- a/src/constants/code/TextAnimations/textTrailCode.ts +++ b/src/constants/code/TextAnimations/textTrailCode.ts @@ -1,5 +1,5 @@ -import code from '@/content/TextAnimations/TextTrail/TextTrail.vue?raw' -import type { CodeObject } from '@/types/code' +import code from '@/content/TextAnimations/TextTrail/TextTrail.vue?raw'; +import type { CodeObject } from '@/types/code'; export const textTrail: CodeObject = { cli: `npx jsrepo add https://vue-bits.dev/ui/TextAnimations/TextTrail`, @@ -20,4 +20,4 @@ export const textTrail: CodeObject = { import TextTrail from "./TextTrail.vue"; `, code -} +}; diff --git a/src/constants/code/TextAnimations/trueFocusCode.ts b/src/constants/code/TextAnimations/trueFocusCode.ts index 603d42c..98ed43b 100644 --- a/src/constants/code/TextAnimations/trueFocusCode.ts +++ b/src/constants/code/TextAnimations/trueFocusCode.ts @@ -1,5 +1,5 @@ -import code from "@/content/TextAnimations/TrueFocus/TrueFocus.vue?raw"; -import type { CodeObject } from "../../../types/code"; +import code from '@/content/TextAnimations/TrueFocus/TrueFocus.vue?raw'; +import type { CodeObject } from '../../../types/code'; export const trueFocus: CodeObject = { cli: `npx jsrepo add https://vue-bits.dev/ui/TextAnimations/TrueFocus`, @@ -18,5 +18,5 @@ export const trueFocus: CodeObject = { `, - code, + code }; diff --git a/src/content/Animations/AnimatedContent/AnimatedContent.vue b/src/content/Animations/AnimatedContent/AnimatedContent.vue index d65f1ac..c51c8c5 100644 --- a/src/content/Animations/AnimatedContent/AnimatedContent.vue +++ b/src/content/Animations/AnimatedContent/AnimatedContent.vue @@ -1,22 +1,22 @@ diff --git a/src/content/Animations/ClickSpark/ClickSpark.vue b/src/content/Animations/ClickSpark/ClickSpark.vue index 962ed0a..a8d5f1c 100644 --- a/src/content/Animations/ClickSpark/ClickSpark.vue +++ b/src/content/Animations/ClickSpark/ClickSpark.vue @@ -1,35 +1,29 @@ diff --git a/src/content/Animations/CountUp/CountUp.vue b/src/content/Animations/CountUp/CountUp.vue index 2c8717a..1975607 100644 --- a/src/content/Animations/CountUp/CountUp.vue +++ b/src/content/Animations/CountUp/CountUp.vue @@ -3,161 +3,164 @@ \ No newline at end of file + cleanup(); +}); + diff --git a/src/content/Animations/Cubes/Cubes.vue b/src/content/Animations/Cubes/Cubes.vue index 6df1951..376c7ad 100644 --- a/src/content/Animations/Cubes/Cubes.vue +++ b/src/content/Animations/Cubes/Cubes.vue @@ -2,46 +2,74 @@
@@ -49,34 +77,34 @@ diff --git a/src/content/Animations/FadeContent/FadeContent.vue b/src/content/Animations/FadeContent/FadeContent.vue index 1279e3c..844708c 100644 --- a/src/content/Animations/FadeContent/FadeContent.vue +++ b/src/content/Animations/FadeContent/FadeContent.vue @@ -5,7 +5,7 @@ :style="{ opacity: inView ? 1 : initialOpacity, transition: `opacity ${duration}ms ${easing}, filter ${duration}ms ${easing}`, - filter: blur ? (inView ? 'blur(0px)' : 'blur(10px)') : 'none', + filter: blur ? (inView ? 'blur(0px)' : 'blur(10px)') : 'none' }" > @@ -13,16 +13,16 @@ \ No newline at end of file +}); + diff --git a/src/content/Animations/GlareHover/GlareHover.vue b/src/content/Animations/GlareHover/GlareHover.vue index f4c242e..30cf3ab 100644 --- a/src/content/Animations/GlareHover/GlareHover.vue +++ b/src/content/Animations/GlareHover/GlareHover.vue @@ -1,20 +1,20 @@ diff --git a/src/content/Animations/Magnet/Magnet.vue b/src/content/Animations/Magnet/Magnet.vue index 989354f..e076e13 100644 --- a/src/content/Animations/Magnet/Magnet.vue +++ b/src/content/Animations/Magnet/Magnet.vue @@ -1,27 +1,34 @@ diff --git a/src/content/Animations/MagnetLines/MagnetLines.vue b/src/content/Animations/MagnetLines/MagnetLines.vue index 1889cd2..9ea0d84 100644 --- a/src/content/Animations/MagnetLines/MagnetLines.vue +++ b/src/content/Animations/MagnetLines/MagnetLines.vue @@ -1,16 +1,16 @@ \ No newline at end of file + diff --git a/src/content/Backgrounds/Beams/Beams.vue b/src/content/Backgrounds/Beams/Beams.vue index 4cfde5e..ae93ab3 100644 --- a/src/content/Backgrounds/Beams/Beams.vue +++ b/src/content/Backgrounds/Beams/Beams.vue @@ -3,19 +3,19 @@ diff --git a/src/content/Backgrounds/DotGrid/DotGrid.vue b/src/content/Backgrounds/DotGrid/DotGrid.vue index 4591dfa..d78600b 100644 --- a/src/content/Backgrounds/DotGrid/DotGrid.vue +++ b/src/content/Backgrounds/DotGrid/DotGrid.vue @@ -7,45 +7,45 @@ \ No newline at end of file +}); + diff --git a/src/content/Backgrounds/GridMotion/GridMotion.vue b/src/content/Backgrounds/GridMotion/GridMotion.vue index 5ae8f86..4740bca 100644 --- a/src/content/Backgrounds/GridMotion/GridMotion.vue +++ b/src/content/Backgrounds/GridMotion/GridMotion.vue @@ -1,6 +1,6 @@ \ No newline at end of file +); + diff --git a/src/content/Backgrounds/LetterGlitch/LetterGlitch.vue b/src/content/Backgrounds/LetterGlitch/LetterGlitch.vue index 64e6895..0f8e5d6 100644 --- a/src/content/Backgrounds/LetterGlitch/LetterGlitch.vue +++ b/src/content/Backgrounds/LetterGlitch/LetterGlitch.vue @@ -1,79 +1,140 @@ \ No newline at end of file + diff --git a/src/content/Backgrounds/Lightning/Lightning.vue b/src/content/Backgrounds/Lightning/Lightning.vue index 5663561..8ab32d6 100644 --- a/src/content/Backgrounds/Lightning/Lightning.vue +++ b/src/content/Backgrounds/Lightning/Lightning.vue @@ -3,14 +3,14 @@ \ No newline at end of file + diff --git a/src/content/Components/InfiniteScroll/InfiniteScroll.vue b/src/content/Components/InfiniteScroll/InfiniteScroll.vue index cdb8844..25993ef 100644 --- a/src/content/Components/InfiniteScroll/InfiniteScroll.vue +++ b/src/content/Components/InfiniteScroll/InfiniteScroll.vue @@ -1,24 +1,35 @@ \ No newline at end of file + diff --git a/src/content/Components/SpotlightCard/SpotlightCard.vue b/src/content/Components/SpotlightCard/SpotlightCard.vue index f2eacb3..04933c0 100644 --- a/src/content/Components/SpotlightCard/SpotlightCard.vue +++ b/src/content/Components/SpotlightCard/SpotlightCard.vue @@ -1,59 +1,67 @@ \ No newline at end of file + opacity.value = 0; +}; + diff --git a/src/content/Components/TiltedCard/TiltedCard.vue b/src/content/Components/TiltedCard/TiltedCard.vue index 8516b8f..7f70d65 100644 --- a/src/content/Components/TiltedCard/TiltedCard.vue +++ b/src/content/Components/TiltedCard/TiltedCard.vue @@ -1,65 +1,87 @@ \ No newline at end of file + diff --git a/src/content/TextAnimations/BlurText/BlurText.vue b/src/content/TextAnimations/BlurText/BlurText.vue index 04cebd7..d430a8e 100644 --- a/src/content/TextAnimations/BlurText/BlurText.vue +++ b/src/content/TextAnimations/BlurText/BlurText.vue @@ -1,20 +1,20 @@ diff --git a/src/content/TextAnimations/CircularText/CircularText.vue b/src/content/TextAnimations/CircularText/CircularText.vue index ebe59ea..5daea6e 100644 --- a/src/content/TextAnimations/CircularText/CircularText.vue +++ b/src/content/TextAnimations/CircularText/CircularText.vue @@ -1,12 +1,12 @@ \ No newline at end of file + diff --git a/src/content/TextAnimations/CurvedLoop/CurvedLoop.vue b/src/content/TextAnimations/CurvedLoop/CurvedLoop.vue index d46011a..0a05995 100644 --- a/src/content/TextAnimations/CurvedLoop/CurvedLoop.vue +++ b/src/content/TextAnimations/CurvedLoop/CurvedLoop.vue @@ -1,13 +1,13 @@ @@ -66,58 +63,88 @@ \ No newline at end of file + diff --git a/src/demo/Backgrounds/ThreadsDemo.vue b/src/demo/Backgrounds/ThreadsDemo.vue index b8c7bf9..3c11734 100644 --- a/src/demo/Backgrounds/ThreadsDemo.vue +++ b/src/demo/Backgrounds/ThreadsDemo.vue @@ -2,8 +2,12 @@ @@ -29,48 +34,48 @@ \ No newline at end of file + diff --git a/src/demo/Backgrounds/WavesDemo.vue b/src/demo/Backgrounds/WavesDemo.vue index ba87eee..02cb723 100644 --- a/src/demo/Backgrounds/WavesDemo.vue +++ b/src/demo/Backgrounds/WavesDemo.vue @@ -7,8 +7,14 @@
- +
@@ -16,6 +22,7 @@ + @@ -31,36 +38,76 @@ \ No newline at end of file + diff --git a/src/demo/Components/ElasticSliderDemo.vue b/src/demo/Components/ElasticSliderDemo.vue index 43f7e10..fe4c427 100644 --- a/src/demo/Components/ElasticSliderDemo.vue +++ b/src/demo/Components/ElasticSliderDemo.vue @@ -10,6 +10,7 @@

Using Steps

+
@@ -17,11 +18,13 @@

Custom Range & Icons

+
+ @@ -44,12 +47,12 @@ \ No newline at end of file + diff --git a/src/demo/Components/FlowingMenuDemo.vue b/src/demo/Components/FlowingMenuDemo.vue index 871a257..5640b52 100644 --- a/src/demo/Components/FlowingMenuDemo.vue +++ b/src/demo/Components/FlowingMenuDemo.vue @@ -2,11 +2,12 @@
@@ -22,13 +23,13 @@ diff --git a/src/demo/Components/FlyingPostersDemo.vue b/src/demo/Components/FlyingPostersDemo.vue index 7c52d75..4b5d774 100644 --- a/src/demo/Components/FlyingPostersDemo.vue +++ b/src/demo/Components/FlyingPostersDemo.vue @@ -3,37 +3,83 @@ @@ -49,26 +95,26 @@ diff --git a/src/demo/Components/GlassIconsDemo.vue b/src/demo/Components/GlassIconsDemo.vue index b1237b0..12db255 100644 --- a/src/demo/Components/GlassIconsDemo.vue +++ b/src/demo/Components/GlassIconsDemo.vue @@ -2,7 +2,7 @@
diff --git a/src/demo/Components/GooeyNavDemo.vue b/src/demo/Components/GooeyNavDemo.vue index d4e4962..cbcf11d 100644 --- a/src/demo/Components/GooeyNavDemo.vue +++ b/src/demo/Components/GooeyNavDemo.vue @@ -2,7 +2,9 @@
\ No newline at end of file + diff --git a/src/demo/TextAnimations/BlurTextDemo.vue b/src/demo/TextAnimations/BlurTextDemo.vue index 9e5a875..e54544c 100644 --- a/src/demo/TextAnimations/BlurTextDemo.vue +++ b/src/demo/TextAnimations/BlurTextDemo.vue @@ -5,10 +5,22 @@
- +
@@ -17,27 +29,51 @@
+
- + - + - + + @@ -53,61 +89,96 @@ diff --git a/src/demo/TextAnimations/CircularTextDemo.vue b/src/demo/TextAnimations/CircularTextDemo.vue index 09eb7fc..37a2adf 100644 --- a/src/demo/TextAnimations/CircularTextDemo.vue +++ b/src/demo/TextAnimations/CircularTextDemo.vue @@ -3,24 +3,38 @@ @@ -36,40 +50,45 @@ diff --git a/src/demo/TextAnimations/CurvedLoopDemo.vue b/src/demo/TextAnimations/CurvedLoopDemo.vue index 9380ddb..26b4961 100644 --- a/src/demo/TextAnimations/CurvedLoopDemo.vue +++ b/src/demo/TextAnimations/CurvedLoopDemo.vue @@ -3,26 +3,57 @@ diff --git a/src/demo/TextAnimations/DecryptedTextDemo.vue b/src/demo/TextAnimations/DecryptedTextDemo.vue index 29c70e4..262714e 100644 --- a/src/demo/TextAnimations/DecryptedTextDemo.vue +++ b/src/demo/TextAnimations/DecryptedTextDemo.vue @@ -4,20 +4,52 @@ diff --git a/src/demo/TextAnimations/FuzzyTextDemo.vue b/src/demo/TextAnimations/FuzzyTextDemo.vue index d031243..06a4fcc 100644 --- a/src/demo/TextAnimations/FuzzyTextDemo.vue +++ b/src/demo/TextAnimations/FuzzyTextDemo.vue @@ -4,23 +4,58 @@ diff --git a/src/demo/TextAnimations/GradientTextDemo.vue b/src/demo/TextAnimations/GradientTextDemo.vue index 23447d3..22507f6 100644 --- a/src/demo/TextAnimations/GradientTextDemo.vue +++ b/src/demo/TextAnimations/GradientTextDemo.vue @@ -3,18 +3,29 @@ \ No newline at end of file + diff --git a/src/demo/TextAnimations/ShinyTextDemo.vue b/src/demo/TextAnimations/ShinyTextDemo.vue index 60f8575..4c47c34 100644 --- a/src/demo/TextAnimations/ShinyTextDemo.vue +++ b/src/demo/TextAnimations/ShinyTextDemo.vue @@ -3,11 +3,13 @@