From 46ee42829b02147449ee3340fe7674c28157eb84 Mon Sep 17 00:00:00 2001
From: "plebeius.eth" <mottoes_recap0u@icloud.com>
Date: Sat, 16 Mar 2024 13:35:41 +0100
Subject: [PATCH] style(home): add mobile styling to footer

---
 src/views/home/home.module.css | 75 ++++++++++++++++++++++------------
 1 file changed, 48 insertions(+), 27 deletions(-)

diff --git a/src/views/home/home.module.css b/src/views/home/home.module.css
index 792758f4..d88aeda2 100644
--- a/src/views/home/home.module.css
+++ b/src/views/home/home.module.css
@@ -154,37 +154,58 @@
   color: var(--text-color-on-color2);
 }
 
-.footer {
-  border-top: 1px solid;
-  width: 750px;
-  display: inline-flex;
-  align-items: center;
-  font-size: 12px;
-  justify-content: center;
-}
-
-.footer li {
-  background: var(--color3);
-  border: 1px solid;
-  padding: 2px 1em 2px 1em;
-  border-left: none;
-  margin-top: -1px;
-  list-style: none;
-}
-
-.footer li:first-child {
-  border-left: 1px solid !important;
-}
-
-a {
-  color: var(--text-color-on-color2);
-  text-decoration: none;
-}
-
 @media (max-width: 768px) {
   .content {
     min-width: 0;
     width: auto;
     padding: 10px;
   }
+  
+  .footer {
+    text-align: center;
+  }
+
+  .footer ul {
+    margin: auto;
+  }
+
+  .footer li {
+    display: inline-table;
+    line-height: 1.7;
+    white-space: nowrap;
+    padding: 2px 1em 2px 1em;
+  }
+
+  .footer a {
+    color: var(--external-link-text-color);
+    text-decoration: underline;
+  }
+}
+
+@media (min-width: 640px) {
+  .footer {
+    border-top: 1px solid;
+    width: 750px;
+    display: inline-flex;
+    justify-content: center;
+    font-size: 12px;
+  }
+
+  .footer li {
+    background: var(--color3);
+    border: 1px solid;
+    padding: 2px 1em 2px 1em;
+    border-left: none;
+    margin-top: -1px;
+    list-style: none;
+  }
+
+  .footer li:first-child {
+    border-left: 1px solid !important;
+  }
+
+  .footer a {
+    color: var(--text-color-on-color2);
+    text-decoration: none;
+  }
 }
\ No newline at end of file