Merge pull request #324 from bettersg/develop

3.0.4
bettersg · Jun 2, 2024 · 7c16771 · 7c16771
2 parents b2a0398 + 657e148
commit 7c16771
Show file tree

Hide file tree

Showing 6 changed files with 34 additions and 26 deletions.
diff --git a/checkers-app/src/components/common/BackButton.tsx b/checkers-app/src/components/common/BackButton.tsx
@@ -1,21 +1,22 @@
-import { Button } from "@material-tailwind/react";
 import { ArrowLeftIcon } from "@heroicons/react/24/solid";
-import { useNavigate } from "react-router-dom";
+import { useNavigate, useLocation } from "react-router-dom";
 
 export function BackButton() {
   const navigate = useNavigate();
+  const location = useLocation();
+  const regex = /^\/messages\/[^/]+\/voteRequests\/[^/]+\/?$/;
+  function onClick() {
+    if (regex.test(location.pathname)) {
+      navigate("/votes");
+    } else {
+      navigate(-1);
+    }
+  }
+
   return (
-    <div className="fixed top-16 left-4 z-50 bg-gray-800 bg-opacity-75 p-2 rounded-full">
-      <Button
-        variant="text"
-        className="rounded-full"
-        style={{ color: "#ff8932" }}
-        onClick={() => {
-          navigate(`/votes`);
-        }}
-      >
-        <ArrowLeftIcon className="h-5 w-5" />
-      </Button>
-    </div>
+    <ArrowLeftIcon
+      className="h-6 w-6 text-[#ff8932] cursor-pointer"
+      onClick={onClick}
+    />
   );
 }
diff --git a/checkers-app/src/components/common/Header.tsx b/checkers-app/src/components/common/Header.tsx
@@ -1,6 +1,7 @@
 import { Typography } from "@material-tailwind/react";
 import MenuComponent from "./Menu";
 import { useUser } from "../../providers/UserContext";
+import { BackButton } from "./BackButton";
 
 interface HeaderProps {
   pageName: string;
@@ -10,11 +11,18 @@ interface HeaderProps {
 export default function Header({ pageName, showMenu = false }: HeaderProps) {
   const { checkerDetails } = useUser();
   return (
-    <div className="flex justify-between items-center fixed top-0 left-0 right-0 z-30 px-[5vw] pt-[3vh] bg-white dark:bg-dark-background-color">
-      <Typography variant="h3" className="text-primary-color2">
-        {pageName}
-      </Typography>
-      <div className="flex items-center gap-4">
+    <div className="relative flex items-center fixed top-0 left-0 right-0 z-30 px-[3vw] pt-[3vh] bg-white dark:bg-dark-background-color">
+      <div className="flex justify-start items-center flex-grow-0">
+        <BackButton />
+      </div>
+
+      <div className="absolute left-1/2 transform -translate-x-1/2">
+        <Typography variant="h4" className="text-primary-color2">
+          {pageName}
+        </Typography>
+      </div>
+
+      <div className="flex justify-end items-center flex-grow gap-4">
         {showMenu && <MenuComponent isActive={checkerDetails.isActive} />}
         <img
           className="rounded-full h-[12vw] w-[12vw] orange-glow"

diff --git a/checkers-app/src/components/common/Layout.tsx b/checkers-app/src/components/common/Layout.tsx
@@ -26,7 +26,7 @@ export default function Layout({
       <Header pageName={pageName} showMenu={showMenu} />
       {/* <PageHeader>{pageHeader}</PageHeader>
     </div> */}
-      <div className="pb-16 mt-16">{children}</div>
+      <div className="pb-1 mt-1">{children}</div>
       <NavbarDefault />
     </div>
   );

diff --git a/checkers-app/src/components/dashboard/CelebrationDialog.tsx b/checkers-app/src/components/dashboard/CelebrationDialog.tsx
@@ -50,8 +50,9 @@ export function CelebrationDialog(props: PropType) {
             Congratulations!!!
           </Typography>
           <Typography className="text-center font-normal">
-            Hooray! You've completed the CheckMate program!! Would you like to
-            continue with us as a checker?
+            Hooray! You've completed the CheckMate program!! We'd love for you
+            to stay on as a checker and help us in our fight against
+            misinformation and scams. Would you like to stay on?
           </Typography>
         </DialogBody>
         <DialogFooter className="space-x-2">

diff --git a/checkers-app/src/components/dashboard/index.tsx b/checkers-app/src/components/dashboard/index.tsx
@@ -75,7 +75,7 @@ export default function Dashboard() {
       )} */}
       {isOnProgram && programStats ? (
         <div>
-          <Typography variant="h4" className="text-primary-color">
+          <Typography variant="h5" className="text-primary-color">
             CheckMate Program Progress
           </Typography>
           <div className="my-6 flex flex-col gap-y-4 mx-2">
@@ -139,7 +139,7 @@ export default function Dashboard() {
         </div>
       ) : (
         <div>
-          <Typography variant="h4" className="text-primary-color">
+          <Typography variant="h5" className="text-primary-color">
             In the past 30 days
           </Typography>
           <div className="my-6 flex flex-col gap-y-4 mx-2">

diff --git a/checkers-app/src/components/vote/index.tsx b/checkers-app/src/components/vote/index.tsx
@@ -1,7 +1,6 @@
 import VoteCategories from "./VoteCategories";
 import MessageCard from "./MessageCard";
 import { Typography, Alert } from "@material-tailwind/react";
-import { BackButton } from "../common/BackButton";
 import { useEffect, useState } from "react";
 import { useParams } from "react-router-dom";
 import { useUser } from "../../providers/UserContext";
@@ -52,7 +51,6 @@ export default function VotePage() {
             }
           `}
         </style>
-        <BackButton />
         <MessageCard
           type={vote.type}
           text={vote.text}