NoSys pages initial commit

src/components/Footer.vue

@@ -0,0 +1,117 @@
+<script setup>
+import { RouterLink } from "vue-router"
+import { Github, Heart } from "lucide-vue-next"
+
+const currentYear = new Date().getFullYear()
+</script>
+
+<template>
+  <footer class="border-t border-border bg-card">
+    <div class="container py-12">
+      <div class="grid grid-cols-1 md:grid-cols-4 gap-8">
+        <!-- Brand -->
+        <div>
+          <div class="flex items-center gap-2 mb-4">
+            <div class="h-8 w-8 rounded-lg bg-primary flex items-center justify-center">
+              <div class="h-4 w-4 rounded-full border-2 border-primary-foreground" />
+            </div>
+            <span class="font-bold text-lg">NoSys</span>
+          </div>
+          <p class="text-sm text-muted-foreground">
+            A social network no one can control. 100% decentralized.
+          </p>
+        </div>
+
+        <!-- Product -->
+        <div>
+          <h3 class="font-semibold mb-4">Product</h3>
+          <ul class="space-y-3">
+            <li>
+              <RouterLink to="/about" class="text-sm text-muted-foreground hover:text-foreground transition-colors">
+                About
+              </RouterLink>
+            </li>
+            <li>
+              <RouterLink to="/how-it-works" class="text-sm text-muted-foreground hover:text-foreground transition-colors">
+                How It Works
+              </RouterLink>
+            </li>
+            <li>
+              <RouterLink to="/downloads" class="text-sm text-muted-foreground hover:text-foreground transition-colors">
+                Downloads
+              </RouterLink>
+            </li>
+          </ul>
+        </div>
+
+        <!-- Resources -->
+        <div>
+          <h3 class="font-semibold mb-4">Resources</h3>
+          <ul class="space-y-3">
+            <li>
+              <RouterLink to="/documentation" class="text-sm text-muted-foreground hover:text-foreground transition-colors">
+                Documentation
+              </RouterLink>
+            </li>
+            <li>
+              <RouterLink to="/community" class="text-sm text-muted-foreground hover:text-foreground transition-colors">
+                Community
+              </RouterLink>
+            </li>
+            <li>
+              <RouterLink to="/blog" class="text-sm text-muted-foreground hover:text-foreground transition-colors">
+                Blog
+              </RouterLink>
+            </li>
+            <li>
+              <RouterLink to="/support" class="text-sm text-muted-foreground hover:text-foreground transition-colors">
+                Support
+              </RouterLink>
+            </li>
+          </ul>
+        </div>
+
+        <!-- Legal -->
+        <div>
+          <h3 class="font-semibold mb-4">Legal</h3>
+          <ul class="space-y-3">
+            <li>
+              <RouterLink to="/privacy" class="text-sm text-muted-foreground hover:text-foreground transition-colors">
+                Privacy Policy
+              </RouterLink>
+            </li>
+            <li>
+              <RouterLink to="/license" class="text-sm text-muted-foreground hover:text-foreground transition-colors">
+                Open Source License
+              </RouterLink>
+            </li>
+            <li>
+              <RouterLink
+                to="/community#donate"
+                class="text-sm text-muted-foreground hover:text-foreground transition-colors flex items-center gap-2"
+              >
+                <Heart class="h-4 w-4" />
+                Donate
+              </RouterLink>
+            </li>
+            <li>
+              <a
+                href="https://github.com"
+                target="_blank"
+                rel="noopener noreferrer"
+                class="text-sm text-muted-foreground hover:text-foreground transition-colors flex items-center gap-2"
+              >
+                <Github class="h-4 w-4" />
+                GitHub
+              </a>
+            </li>
+          </ul>
+        </div>
+      </div>
+
+      <div class="mt-8 pt-8 border-t border-border text-center text-sm text-muted-foreground">
+        <p>© {{ currentYear }} NoSys. Open source and decentralized.</p>
+      </div>
+    </div>
+  </footer>
+</template>