From 503ed52d18e1b8eca0433e71cf9204db68dc5d7d Mon Sep 17 00:00:00 2001
From: Benjamin Bolte <ben@bolte.cc>
Date: Thu, 1 Aug 2024 02:06:52 -0700
Subject: [PATCH] small fix to login flow

---
 frontend/src/components/nav/Sidebar.tsx |  2 +-
 frontend/src/pages/About.tsx            | 21 ++++++++++++---------
 frontend/src/pages/Logout.tsx           | 16 +++++++++++++---
 3 files changed, 26 insertions(+), 13 deletions(-)

diff --git a/frontend/src/components/nav/Sidebar.tsx b/frontend/src/components/nav/Sidebar.tsx
index 15b80f03..3e0319e7 100644
--- a/frontend/src/components/nav/Sidebar.tsx
+++ b/frontend/src/components/nav/Sidebar.tsx
@@ -118,7 +118,7 @@ const Sidebar = ({ show, onClose }: Props) => {
             title="Terms of Service"
             icon={<FaScroll />}
             onClick={() => {
-              navigate("/terms");
+              navigate("/tos");
               onClose();
             }}
           />
diff --git a/frontend/src/pages/About.tsx b/frontend/src/pages/About.tsx
index 8faf3e12..b7f20af2 100644
--- a/frontend/src/pages/About.tsx
+++ b/frontend/src/pages/About.tsx
@@ -5,22 +5,25 @@ const About = () => {
         <h1 className="mb-8 text-4xl font-extrabold tracking-tight leading-none md:text-5xl lg:text-6xl">
           About
         </h1>
-        <p className="mb-8 text-lg font-normal lg:text-xl sm:px-16 lg:px-48">
+        <p className="mb-4 text-lg font-normal lg:text-xl sm:px-16 lg:px-48">
           This is a simple store to help make it easy to buy, sell and build
-          robots. It is maintained by{" "}
-          <button
-            onClick={() => window.open("https://kscale.io")}
-            className="text-blue-700 underline"
+          robots.
+        </p>
+        <p className="text-lg font-normal lg:text-xl sm:px-16 lg:px-48">
+          It is maintained by{" "}
+          <a
+            href="https://kscale.dev"
+            className="text-blue-700 underline hover:text-blue-900"
           >
             K-Scale Labs
-          </button>{" "}
+          </a>{" "}
           with open-source code freely available on{" "}
-          <button
-            onClick={() => window.open("https://github.com/kscalelabs/store")}
+          <a
+            href="https://github.com/kscalelabs/store"
             className="text-blue-700 underline"
           >
             Github
-          </button>
+          </a>
           .
         </p>
       </div>
diff --git a/frontend/src/pages/Logout.tsx b/frontend/src/pages/Logout.tsx
index e2b55eec..998b69b2 100644
--- a/frontend/src/pages/Logout.tsx
+++ b/frontend/src/pages/Logout.tsx
@@ -1,3 +1,5 @@
+import { Card, CardContent, CardHeader } from "components/ui/Card";
+import Header from "components/ui/Header";
 import Spinner from "components/ui/Spinner";
 import { useAlertQueue } from "hooks/alerts";
 import { useAuthentication } from "hooks/auth";
@@ -19,9 +21,17 @@ const Logout = () => {
   }, []);
 
   return (
-    <div>
-      <h1 className="mb-4">Log Out</h1>
-      <Spinner />
+    <div className="mx-8">
+      <div className="flex justify-center items-center">
+        <Card className="w-[400px] shadow-md bg-white text-black rounded-lg">
+          <CardHeader>
+            <Header title="Logout" />
+          </CardHeader>
+          <CardContent className="flex justify-center">
+            <Spinner />
+          </CardContent>
+        </Card>
+      </div>
     </div>
   );
 };