From 650fbe88f6c61dc42d9e4e27a0d734786fd0bb9c Mon Sep 17 00:00:00 2001
From: Kory Anderson <koryanderson1909@gmail.com>
Date: Wed, 4 Sep 2024 16:20:10 +0100
Subject: [PATCH 1/2] Moves footer into nav to fix main body size issues

---
 app/(authenticated)/layout.tsx |  5 -----
 components/Nav.tsx             | 29 +++++++++++++++++++++++++----
 2 files changed, 25 insertions(+), 9 deletions(-)

diff --git a/app/(authenticated)/layout.tsx b/app/(authenticated)/layout.tsx
index c937d538..919a1946 100644
--- a/app/(authenticated)/layout.tsx
+++ b/app/(authenticated)/layout.tsx
@@ -38,11 +38,6 @@ export default async function AuthenticatedLayout({
           <main className="mx-2 max-w-[min(theme(maxWidth.6xl),theme(maxWidth.full))] overflow-x-hidden md:mx-6 [@media(min-width:calc(theme(maxWidth.6xl)+theme(margin.6)*2))]:mx-auto">
             {children}
           </main>
-          <br />
-          <footer className="mt-8 text-center text-sm text-gray-500">
-            Calendar version {process.env.NEXT_PUBLIC_RELEASE}. Built and
-            maintained by the YSTV Computing Team. <FeedbackPrompt />
-          </footer>
           <style
             dangerouslySetInnerHTML={{
               __html: `
diff --git a/components/Nav.tsx b/components/Nav.tsx
index 3f588750..2c26a30e 100644
--- a/components/Nav.tsx
+++ b/components/Nav.tsx
@@ -1,5 +1,5 @@
 "use client";
-import { AppShell, Group, rem } from "@mantine/core";
+import { Anchor, AppShell, Group, rem, Text } from "@mantine/core";
 import { useHeadroom } from "@mantine/hooks";
 import Image from "next/image";
 import Link from "next/link";
@@ -14,10 +14,13 @@ interface NavProps {
 }
 
 export default function Nav({ children, user }: NavProps) {
-  const pinned = useHeadroom({ fixedAt: 100 });
+  const headerPinned = useHeadroom({ fixedAt: 100 });
+  const footerPinned = useHeadroom({ fixedAt: 100 });
+
   return (
     <AppShell
-      header={{ height: 80, collapsed: !pinned, offset: false }}
+      header={{ height: 80, collapsed: !headerPinned, offset: false }}
+      footer={{ height: 60, collapsed: !headerPinned, offset: false }}
       padding="md"
       classNames={{ header: styles.header }}
     >
@@ -39,9 +42,27 @@ export default function Nav({ children, user }: NavProps) {
         </Group>
       </AppShell.Header>
 
-      <AppShell.Main pt={`calc(${rem(80)} + var(--mantine-spacing-md))`}>
+      <AppShell.Main
+        pt={`calc(${rem(80)} + var(--mantine-spacing-md))`}
+        h={`10vh - ${rem(80)} - var(--mantine-spacing-md)`}
+      >
         {children}
       </AppShell.Main>
+      <AppShell.Footer bg-dark="true">
+        <div className="flex h-full items-center justify-center">
+          <Text ta="center">
+            Calendar version {process.env.NEXT_PUBLIC_RELEASE}. Built and
+            maintained by the{" "}
+            <Anchor
+              href="https://ystv.slack.com/archives/C05UATQKUMA"
+              className="underline"
+            >
+              YSTV Computing Team
+            </Anchor>
+            .
+          </Text>
+        </div>
+      </AppShell.Footer>
     </AppShell>
   );
 }

From 6e987b5d35f36cd45279c70841c517d3e0a9bb34 Mon Sep 17 00:00:00 2001
From: Kory Anderson <koryanderson1909@gmail.com>
Date: Wed, 4 Sep 2024 16:28:37 +0100
Subject: [PATCH 2/2] Integrate FeedbackPrompt

---
 components/FeedbackPrompt.tsx |  5 +++--
 components/Nav.tsx            | 12 +++---------
 2 files changed, 6 insertions(+), 11 deletions(-)

diff --git a/components/FeedbackPrompt.tsx b/components/FeedbackPrompt.tsx
index 39e9bf80..ec9ddedf 100644
--- a/components/FeedbackPrompt.tsx
+++ b/components/FeedbackPrompt.tsx
@@ -1,5 +1,6 @@
 "use client";
 
+import { Anchor } from "@mantine/core";
 import Link from "next/link";
 import { usePathname } from "next/navigation";
 
@@ -7,8 +8,8 @@ export function FeedbackPrompt() {
   const pathname = usePathname();
 
   return (
-    <Link href={`/feedback?return_to=${encodeURIComponent(pathname)}`}>
+    <Anchor href={`/feedback?return_to=${encodeURIComponent(pathname)}`}>
       Got an idea or found something broken?
-    </Link>
+    </Anchor>
   );
 }
diff --git a/components/Nav.tsx b/components/Nav.tsx
index 2c26a30e..90b0d821 100644
--- a/components/Nav.tsx
+++ b/components/Nav.tsx
@@ -7,6 +7,7 @@ import Logo from "@/app/_assets/logo.png";
 import { UserMenu } from "@/components/UserMenu";
 import styles from "@/styles/Nav.module.css";
 import YSTVBreadcrumbs from "@/components/Breadcrumbs";
+import { FeedbackPrompt } from "./FeedbackPrompt";
 
 interface NavProps {
   children: React.ReactNode;
@@ -20,7 +21,7 @@ export default function Nav({ children, user }: NavProps) {
   return (
     <AppShell
       header={{ height: 80, collapsed: !headerPinned, offset: false }}
-      footer={{ height: 60, collapsed: !headerPinned, offset: false }}
+      footer={{ height: 80, collapsed: !headerPinned, offset: false }}
       padding="md"
       classNames={{ header: styles.header }}
     >
@@ -52,14 +53,7 @@ export default function Nav({ children, user }: NavProps) {
         <div className="flex h-full items-center justify-center">
           <Text ta="center">
             Calendar version {process.env.NEXT_PUBLIC_RELEASE}. Built and
-            maintained by the{" "}
-            <Anchor
-              href="https://ystv.slack.com/archives/C05UATQKUMA"
-              className="underline"
-            >
-              YSTV Computing Team
-            </Anchor>
-            .
+            maintained by the YSTV Computing Team. <FeedbackPrompt />
           </Text>
         </div>
       </AppShell.Footer>