Landing Page

src/components/landing/Footer/Footer.vue

@@ -0,0 +1,37 @@
+<template>
+  <FadeContent :blur="true" :duration="600">
+    <footer class="landing-footer">
+      <div class="footer-content">
+        <div class="footer-left">
+          <img :src="vueBitsLogo" alt="Vue Bits" class="footer-logo" />
+          <p class="footer-description">
+            A library created with <i class="pi pi-heart-fill footer-heart"></i> by
+            <a href="https://davidhaz.com/" target="_blank" class="footer-creator-link">this guy</a>
+          </p>
+          <p class="footer-copyright">© {{ currentYear }} Vue Bits</p>
+        </div>
+
+        <div class="footer-links">
+          <a href="https://github.com/DavidHDev/vue-bits" target="_blank" rel="noopener noreferrer" class="footer-link">
+            GitHub
+          </a>
+          <router-link to="/text-animations/split-text" class="footer-link">
+            Docs
+          </router-link>
+          <a href="https://www.jsrepo.com/" target="_blank" class="footer-link">
+            CLI
+          </a>
+        </div>
+      </div>
+    </footer>
+  </FadeContent>
+</template>
+
+<script setup lang="ts">
+import { computed } from 'vue'
+import vueBitsLogo from '../../../assets/logos/vue-bits-logo.svg'
+import FadeContent from '@/content/Animations/FadeContent/FadeContent.vue'
+import './Footer.css'
+
+const currentYear = computed(() => new Date().getFullYear())
+</script>