From 7989aa90d40932753968f46ce44dae630d7f3c15 Mon Sep 17 00:00:00 2001
From: Dennis Chen <41879777+chennisden@users.noreply.github.com>
Date: Thu, 30 May 2024 22:40:24 -0700
Subject: [PATCH] Adjust footer to not cover content (#29)

In particular, when the screen isn't big enough and a vertical scrollbar
is necessary. We did this by introducing a bottom margin on the content
---
 frontend/src/App.css |  4 ++++
 frontend/src/App.tsx | 16 ++++++++--------
 2 files changed, 12 insertions(+), 8 deletions(-)

diff --git a/frontend/src/App.css b/frontend/src/App.css
index e69de29b..fa5b845b 100644
--- a/frontend/src/App.css
+++ b/frontend/src/App.css
@@ -0,0 +1,4 @@
+div.content {
+  margin-top: 16px;
+  margin-bottom: 56px;
+}
diff --git a/frontend/src/App.tsx b/frontend/src/App.tsx
index 0264089a..8376402b 100644
--- a/frontend/src/App.tsx
+++ b/frontend/src/App.tsx
@@ -18,7 +18,7 @@ const App = () => {
       <BrowserRouter>
         <TopNavbar />
 
-        <Container className="mt-3">
+        <Container className="content">
           <Routes>
             <Route path="/" element={<Home />} />
             <Route path="/robots/" element={<Robots />} />
@@ -28,14 +28,14 @@ const App = () => {
             <Route path="/404" element={<NotFound />} />
             <Route path="*" element={<NotFoundRedirect />} />
           </Routes>
-
-          <footer className="fixed-bottom">
-            {/* Solid background */}
-            <div className="text-center bg-body-tertiary p-2">
-              <a href="mailto:support@robolist.xyz">support@robolist.xyz</a>
-            </div>
-          </footer>
         </Container>
+
+        <footer className="fixed-bottom">
+          {/* Solid background */}
+          <div className="text-center bg-body-tertiary p-2">
+            <a href="mailto:support@robolist.xyz">support@robolist.xyz</a>
+          </div>
+        </footer>
       </BrowserRouter>
     </ThemeProvider>
   );