From a5c1223f7d283b074ecd96e240d3a8519e1435f4 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Tr=C3=A8sAbhi?= <43380238+tresabhi@users.noreply.github.com>
Date: Sat, 20 Apr 2024 11:20:52 -0500
Subject: [PATCH] feat: simpler footer

---
 docs/guide/{creators.md => credits.md} |  9 ++++----
 src/components/Footer/index.tsx        | 32 +++++++++++++++++++-------
 2 files changed, 29 insertions(+), 12 deletions(-)
 rename docs/guide/{creators.md => credits.md} (52%)

diff --git a/docs/guide/creators.md b/docs/guide/credits.md
similarity index 52%
rename from docs/guide/creators.md
rename to docs/guide/credits.md
index 18e4a7669..3a7daa7d4 100644
--- a/docs/guide/creators.md
+++ b/docs/guide/credits.md
@@ -1,15 +1,16 @@
 # Team
 
 - TrèsAbhi: creator & programmer
-- Prince_NA: game advisor & tester
 
 # Contributors
 
-- S0AP: bot verification process & initial advertizement platform
+- Prince_NA: general game advisor and tester
+- S0AP: bot verification and initial advertizement platform
 - Vovko: discord bot rendering pipeline
 - Maddox: game file decompression
-- Pyogenics: tank model decompression
+- Pyogenics: tank model parsing
 - Aeson: game files layout
 - Minitelrose, ChickenMan7777: 3-caliber rule edge cases
 - \_34, HisRoyalFatness, Synx, xkdkw: embed UX
-- [OPTML], Aeson, \_34, Droodles: beta testing tankopedia
+- [OPTML], Aeson, \_34, Droodles: beta testing Tankopedia
+- [OPTML], Droodles: beta testing Compare
diff --git a/src/components/Footer/index.tsx b/src/components/Footer/index.tsx
index 0d1da94e1..1c816629a 100644
--- a/src/components/Footer/index.tsx
+++ b/src/components/Footer/index.tsx
@@ -5,21 +5,23 @@ import { useWideFormat } from '../../hooks/useWideFormat';
 import { WoTBVersion } from './components/WoTBVersion';
 
 export function Footer() {
-  const wideFormat = useWideFormat();
+  const wideFormat = useWideFormat(640);
 
   return (
     <Theme radius="none">
       <Card>
-        <Flex justify="center">
+        <Flex align="center" direction="column" gap="3" justify="center">
           <Flex
+            align="center"
             justify={wideFormat ? 'between' : 'center'}
+            wrap="wrap"
             style={{
-              flex: 1,
+              width: '100%',
               maxWidth: 800,
               padding: '0 16px',
             }}
           >
-            <Flex gap="1">
+            <Flex gap="1" justify="center" align="center">
               <Text color="gray" size="2">
                 Blitzkrieg
               </Text>
@@ -37,15 +39,29 @@ export function Footer() {
               </Suspense>
             </Flex>
 
-            {wideFormat && (
+            <Flex
+              justify="center"
+              align="center"
+              gap="2"
+              style={{
+                maxWidth: 800,
+                padding: '0 16px',
+              }}
+            >
+              <Link size="2" href="https://tresabhi.github.io/" target="_blank">
+                Made by TrèsAbhi
+              </Link>
+
+              <Text color="gray">•</Text>
+
               <Link
                 size="2"
-                href="https://www.patreon.com/tresabhi"
+                href="https://tresabhi.github.io/blitzkrieg/guide/credits.html"
                 target="_blank"
               >
-                Consider donating on Patreon
+                Full credits
               </Link>
-            )}
+            </Flex>
           </Flex>
         </Flex>
       </Card>