Upload components/Footer.js with huggingface_hub

components/Footer.js

@@ -0,0 +1,63 @@
+import Link from 'next/link'
+import { Terminal } from 'lucide-react'
+
+export default function Footer() {
+  return (
+    <footer className="bg-black border-t border-gray-800 py-12">
+      <div className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
+        <div className="grid grid-cols-2 md:grid-cols-4 gap-8 mb-8">
+          <div className="col-span-2 md:col-span-1">
+            <Link href="/" className="flex items-center gap-2 text-white font-bold text-xl tracking-tight mb-4">
+              <div className="bg-white text-black p-1 rounded">
+                <Terminal size={16} strokeWidth={2.5} />
+              </div>
+              <span>Deepnote<span className="text-brand-accent">.</span></span>
+            </Link>
+            <p className="text-gray-500 text-sm">
+              The AI-powered workspace for the next generation of developers.
+            </p>
+          </div>
+          
+          <div>
+            <h4 className="text-white font-bold mb-4">Product</h4>
+            <ul className="space-y-2 text-sm text-gray-400">
+              <li><a href="#" className="hover:text-brand-accent transition-colors">Features</a></li>
+              <li><a href="#" className="hover:text-brand-accent transition-colors">Integrations</a></li>
+              <li><a href="#" className="hover:text-brand-accent transition-colors">Enterprise</a></li>
+              <li><a href="#" className="hover:text-brand-accent transition-colors">Changelog</a></li>
+            </ul>
+          </div>
+
+          <div>
+            <h4 className="text-white font-bold mb-4">Resources</h4>
+            <ul className="space-y-2 text-sm text-gray-400">
+              <li><a href="#" className="hover:text-brand-accent transition-colors">Documentation</a></li>
+              <li><a href="#" className="hover:text-brand-accent transition-colors">API Reference</a></li>
+              <li><a href="#" className="hover:text-brand-accent transition-colors">Community</a></li>
+              <li><a href="#" className="hover:text-brand-accent transition-colors">Blog</a></li>
+            </ul>
+          </div>
+
+          <div>
+            <h4 className="text-white font-bold mb-4">Legal</h4>
+            <ul className="space-y-2 text-sm text-gray-400">
+              <li><a href="#" className="hover:text-brand-accent transition-colors">Privacy Policy</a></li>
+              <li><a href="#" className="hover:text-brand-accent transition-colors">Terms of Service</a></li>
+              <li><a href="#" className="hover:text-brand-accent transition-colors">Cookie Policy</a></li>
+            </ul>
+          </div>
+        </div>
+        
+        <div className="border-t border-gray-800 pt-8 flex flex-col md:flex-row justify-between items-center gap-4">
+          <p className="text-gray-500 text-sm">© 2024 Deepnote Inc. All rights reserved.</p>
+          <div className="flex items-center gap-2 text-gray-500 text-sm">
+            <span>Built with</span>
+            <a href="https://huggingface.co/spaces/akhaliq/anycoder" className="text-brand-accent hover:underline font-medium">
+              Anycoder
+            </a>
+          </div>
+        </div>
+      </div>
+    </footer>
+  )
+}