Add prettier config, format codebase

src/content/TextAnimations/GradientText/GradientText.vue

@@ -1,12 +1,12 @@
 <script setup lang="ts">
-import { computed } from 'vue'
+import { computed } from 'vue';
 
 interface GradientTextProps {
-  text: string
-  className?: string
-  colors?: string[]
-  animationSpeed?: number
-  showBorder?: boolean
+  text: string;
+  className?: string;
+  colors?: string[];
+  animationSpeed?: number;
+  showBorder?: boolean;
 }
 
 const props = withDefaults(defineProps<GradientTextProps>(), {
@@ -15,24 +15,24 @@ const props = withDefaults(defineProps<GradientTextProps>(), {
   colors: () => ['#ffaa40', '#9c40ff', '#ffaa40'],
   animationSpeed: 8,
   showBorder: false
-})
+});
 
 const gradientStyle = computed(() => ({
   backgroundImage: `linear-gradient(to right, ${props.colors.join(', ')})`,
   animationDuration: `${props.animationSpeed}s`,
   backgroundSize: '300% 100%',
   '--animation-duration': `${props.animationSpeed}s`
-}))
+}));
 
 const borderStyle = computed(() => ({
   ...gradientStyle.value
-}))
+}));
 
 const textStyle = computed(() => ({
   ...gradientStyle.value,
   backgroundClip: 'text',
   WebkitBackgroundClip: 'text'
-}))
+}));
 </script>
 
 <template>
@@ -46,20 +46,11 @@ const textStyle = computed(() => ({
     >
       <div
         class="absolute inset-0 bg-black rounded-[1.25rem] z-[-1]"
-        style="
-          width: calc(100% - 2px);
-          height: calc(100% - 2px);
-          left: 50%;
-          top: 50%;
-          transform: translate(-50%, -50%);
-        "
+        style="width: calc(100% - 2px); height: calc(100% - 2px); left: 50%; top: 50%; transform: translate(-50%, -50%)"
       />
     </div>
-    
-    <div
-      class="inline-block relative z-2 text-transparent bg-cover animate-gradient"
-      :style="textStyle"
-    >
+
+    <div class="inline-block relative z-2 text-transparent bg-cover animate-gradient" :style="textStyle">
       {{ text }}
     </div>
   </div>