Page footer

Author: quicklywilliam

src/App.jsx

@@ -5,6 +5,7 @@ import DetailChart from './components/DetailChart';
 import ModelListingsView from './components/ModelListingsView';
 import NewListings from './components/NewListings';
 import NoTeslaToggle from './components/NoTeslaToggle';
+import Footer from './components/Footer';
 
 function App() {
   const [data, setData] = useState([]);
@@ -186,6 +187,7 @@ function App() {
           </>
         )}
       </main>
+      <Footer />
     </div>
   );
 }

src/components/Footer.css

@@ -0,0 +1,30 @@
+.footer {
+  background: var(--bg-secondary);
+  border-top: 1px solid var(--border-color);
+  padding: 2rem 0;
+  margin-top: 4rem;
+}
+
+.footer-content {
+  max-width: 1200px;
+  margin: 0 auto;
+  padding: 0 1rem;
+  text-align: center;
+}
+
+.footer-content p {
+  margin: 0;
+  color: var(--text-secondary);
+  font-size: 0.9rem;
+}
+
+.footer-content a {
+  color: var(--primary-color);
+  text-decoration: none;
+  transition: opacity 0.2s;
+}
+
+.footer-content a:hover {
+  opacity: 0.8;
+  text-decoration: underline;
+}

src/components/Footer.jsx

@@ -0,0 +1,22 @@
+import React from 'react';
+import './Footer.css';
+
+function Footer() {
+  return (
+    <footer className="footer">
+      <div className="footer-content">
+        <p>
+          <a
+            href="https://github.com/quicklywilliam/usedevpricetracker"
+            target="_blank"
+            rel="noopener noreferrer"
+          >
+            View on GitHub
+          </a>
+        </p>
+      </div>
+    </footer>
+  );
+}
+
+export default Footer;