fix: fix global layout overscroll + link colors (#404)

www/app/(app)/browse/page.tsx

@@ -128,13 +128,13 @@ export default function TranscriptBrowser() {
       gap={2}
       overflowY="auto"
       minH="100%"
-      mt={8}
     >
       <Flex
         flexDir="row"
         justify="flex-end"
         align="center"
         flexWrap={"wrap-reverse"}
+        mt={4}
       >
         {session?.user?.name ? (
           <Heading size="md">{session?.user?.name}'s Meetings</Heading>

www/app/(app)/layout.tsx

@@ -54,7 +54,7 @@ export default async function AppLayout({
           <Link
             as={NextLink}
             href="/transcripts/new"
-            className="hover:underline focus-within:underline underline-offset-2 decoration-[.5px] font-light px-2"
+            className="font-light px-2"
           >
             Create
           </Link>
@@ -64,7 +64,7 @@ export default async function AppLayout({
               <Link
                 href="/browse"
                 as={NextLink}
-                className="hover:underline focus-within:underline underline-offset-2 decoration-[.5px] font-light px-2"
+                className="font-light px-2"
                 prefetch={false}
               >
                 Browse
@@ -79,7 +79,7 @@ export default async function AppLayout({
               <Link
                 href="/rooms"
                 as={NextLink}
-                className="hover:underline focus-within:underline underline-offset-2 decoration-[.5px] font-light px-2"
+                className="font-light px-2"
                 prefetch={false}
               >
                 Rooms
@@ -88,16 +88,6 @@ export default async function AppLayout({
           ) : (
             <></>
           )}
-          &nbsp;·&nbsp;
-          <About buttonText="About" />
-          {privacy ? (
-            <>
-              &nbsp;·&nbsp;
-              <Privacy buttonText="Privacy" />
-            </>
-          ) : (
-            <></>
-          )}
           {requireLogin ? (
             <>
               &nbsp;·&nbsp;

www/app/(app)/transcripts/new/page.tsx

@@ -102,14 +102,15 @@ const TranscriptCreate = () => {
       flexDir="column"
       margin="auto"
       gap={2}
-      overflowY="auto"
       maxH="100%"
+      px={{ base: 5, md: 10 }}
+      py={5}
     >
       <Flex
         flexDir={{ base: "column", md: "row" }}
         justify="space-between"
         align="center"
-        gap={4}
+        gap={8}
       >
         <Flex
           flexDir="column"

www/app/(app)/transcripts/useTranscriptList.ts

@@ -10,7 +10,6 @@ type TranscriptList = {
   refetch: () => void;
 };
 
-//always protected
 const useTranscriptList = (page: number): TranscriptList => {
   const [response, setResponse] = useState<Page_GetTranscript_ | null>(null);
   const [loading, setLoading] = useState<boolean>(true);

www/app/(auth)/userInfo.tsx

@@ -1,7 +1,6 @@
 "use client";
 import { useSession, signOut, signIn } from "next-auth/react";
-import { Spinner } from "@chakra-ui/react";
+import { Spinner, Link } from "@chakra-ui/react";
-import Link from "next/link";
 
 export default function UserInfo() {
   const { status } = useSession();
@@ -11,28 +10,20 @@ export default function UserInfo() {
   return !sessionReady ? (
     <Spinner size="xs" thickness="1px" className="mx-3" />
   ) : !isAuthenticated ? (
-    <span className="hover:underline focus-within:underline underline-offset-2 decoration-[.5px] font-light px-2">
+    <Link
-      <Link
+      href="/"
-        href="/"
+      className="font-light px-2"
-        onClick={() => signIn("authentik")}
+      onClick={() => signIn("authentik")}
-        className="outline-none"
+    >
-        prefetch={false}
+      Log in
-      >
+    </Link>
-        Log in
-      </Link>
-    </span>
   ) : (
-    <span className="font-light px-2">
+    <Link
-      <span className="hover:underline focus-within:underline underline-offset-2 decoration-[.5px]">
+      href="#"
-        <Link
+      className="font-light px-2"
-          href="#"
+      onClick={() => signOut({ callbackUrl: "/" })}
-          onClick={() => signOut({ callbackUrl: "/" })}
+    >
-          className="outline-none"
+      Log out
-          prefetch={false}
+    </Link>
-        >
-          Log out
-        </Link>
-      </span>
-    </span>
   );
 }

www/app/layout.tsx

@@ -65,7 +65,7 @@ export default async function RootLayout({
 
   return (
     <html lang="en">
-      <body className={"h-[100svh] w-[100svw] overflow-hidden relative"}>
+      <body className={"h-[100svh] w-[100svw] overflow-x-hidden relative"}>
         <SessionProvider>
           <DomainContextProvider config={config}>
             <ErrorBoundary fallback={<p>"something went really wrong"</p>}>