Added <GradualBlur /> Animation

src/constants/Categories.ts

@@ -1,5 +1,5 @@
 // Highlighted sidebar items
-export const NEW = ['Gradient Blinds', 'Bubble Menu', 'Prism', 'Plasma', 'Electric Border', 'Target Cursor', 'Pill Nav', 'Card Nav', 'Logo Loop', 'Prismatic Burst'];
+export const NEW = ['Gradual Blur', 'Gradient Blinds', 'Bubble Menu', 'Prism', 'Plasma', 'Electric Border', 'Target Cursor', 'Pill Nav', 'Card Nav', 'Logo Loop', 'Prismatic Burst'];
 export const UPDATED = [];
 
 // Used for main sidebar navigation
@@ -36,6 +36,7 @@ export const CATEGORIES = [
     subcategories: [
       'Animated Content',
       'Fade Content',
+      'Gradual Blur',
       'Noise',
       'Splash Cursor',
       'Logo Loop',

src/constants/Components.ts

@@ -22,6 +22,7 @@ const animations = {
   'crosshair': () => import('../demo/Animations/CrosshairDemo.vue'),
   'sticker-peel': () => import('../demo/Animations/StickerPeelDemo.vue'),
   'electric-border': () => import('../demo/Animations/ElectricBorderDemo.vue'),
+  'gradual-blur': () => import('../demo/Animations/GradualBlurDemo.vue'),
 };
 
 const textAnimations = {

src/constants/code/Animations/gradualBlurCode.ts

@@ -0,0 +1,11 @@
+import code from '@/content/Animations/GradualBlur/GradualBlur.vue?raw';
+import { createCodeObject } from '@/types/code';
+
+export const gradualBlur = createCodeObject(code, 'Animations/GradualBlur', {
+  installation: `npm install mathjs`,
+  usage: `
+
+<script setup lang="ts">
+  import GradualBlur from "./GradualBlur.vue";
+</script>`
+});