Merge pull request #146 from HackDavis/refactor/repo-structure

Refactor/repo structure

app/(pages)/judging-app/_components/JudgingHub/HubHero.tsx

@@ -1,5 +1,4 @@
 import JudgeInt from '@typeDefs/judge';
-import styles from './HubHero.module.scss';
 import Image from 'next/image';
 import judgeHeroes from '/public/judges/hub/judgingheroes.svg';
 
@@ -15,28 +14,28 @@ export default function HubHero({
   }
 
   return (
-    <div className={styles.container}>
-      <div className={styles.welcome_text}>
-        <div className={styles.name_container}>
-          <h1>Welcome!</h1>
-          <p>
+    <div className="tw-w-full tw-overflow-hidden tw-bg-[#f2f2f7] tw-flex tw-flex-col tw-justify-center tw-gap-4 tw-relative">
+      <div className="tw-px-[5%] tw-pt-[50px] tw-pb-0 tw-flex tw-flex-col tw-gap-2 tw-z-[1]">
+        <div className="tw-w-full tw-flex tw-flex-col tw-text-start">
+          <h1 className="tw-font-bold">Welcome!</h1>
+          <p className="tw-text-[1.5rem]">
             We appreciate you for helping us judge one of California's biggest
             hackathons!
           </p>
         </div>
       </div>
-      <div className={styles.judgecontainer}>
-        <div className={styles.judgingheroes}>
+      <div>
+        <div className="tw-items-center tw-flex tw-justify-center">
           <Image
             src={judgeHeroes}
             alt="Judging Animals"
-            className={styles.bottom_blurb}
+            className="tw-right-0 tw-bottom-0"
           />
         </div>
-        <div className={styles.blurb}>
-          {/* <p className={styles.intro_text}>You're paired with...</p>
+        <div className="tw-w-[45%] tw-flex tw-flex-col tw-gap-4 tw-p-[11px] tw-right-4 tw-top-4 tw-rounded-[var(--b-radius)]">
+          {/* <p className="tw-text-base tw-font-medium">You're paired with...</p>
           {members.map((member: string, index: number) => (
-            <p key={index} className={styles.name}>
+            <p key={index} className="tw-text-[1.75rem] tw-font-semibold">
               {member}
             </p>
           ))} */}

app/(pages)/judging-app/_components/JudgingHub/JudgingHub.tsx

@@ -3,6 +3,7 @@ import styles from './JudgingHub.module.scss';
 import HubHero from './HubHero';
 import TableLocations from './TableLocations';
 import ViewProjects from './ViewProjects';
+import Waiting from './Waiting';
 import { useJudgeGroup } from '@hooks/useJudgeGroup';
 
 export default function JudgingHub() {
@@ -12,6 +13,7 @@ export default function JudgingHub() {
     <div className={styles.container}>
       <ViewProjects />
       <HubHero user={user} loading={loading} members={members} />
+      <Waiting />
       {/* <JudgingList projects={unjudgedTeams} /> */}
       <TableLocations />
     </div>

app/(pages)/judging-app/_components/JudgingHub/Waiting.tsx

@@ -0,0 +1,28 @@
+const tips = [
+  '🔋 Charge your phone!',
+  '👋 Say hi to other judges!',
+  '🍿 Grab a snack and water!',
+];
+
+const TipCard = (tip: string) => {
+  return (
+    <div className="tw-flex tw-text-xl tw-items-center tw-justify-center tw-bg-white tw-rounded-[16px] tw-py-[20px]">
+      {tip}
+    </div>
+  );
+};
+
+export default function Waiting() {
+  return (
+    <div className="tw-flex tw-flex-col tw-p-4  tw-bg-[#f2f2f7] tw-gap-4 tw-py-8">
+      <h3 className="tw-font-bold tw-text-2xl">
+        While you're waiting, feel free to...
+      </h3>
+      <div className="tw-flex tw-flex-col tw-gap-4">
+        {tips.map((tip, index) => (
+          <div key={index}>{TipCard(tip)}</div>
+        ))}
+      </div>
+    </div>
+  );
+}

app/(pages)/judging-app/_components/LoginPage/LoginPage.tsx

@@ -1,14 +1,20 @@
-import ProtectedDisplay from '@components/ProtectedDisplay/ProtectedDisplay';
-import JudgingHub from '../JudgingHub/JudgingHub';
 import LoginForm from './LoginForm';
+import Image from 'next/image';
+import styles from './LoginPage.module.scss';
 
 export default function LoginPage() {
   return (
-    <ProtectedDisplay
-      loadingDisplay={<div>Loading...</div>}
-      failDisplay={<LoginForm />}
-    >
-      <JudgingHub />
-    </ProtectedDisplay>
+    <div className={styles.container}>
+      <div className={styles.section}>
+        <Image src="/login/hd_logo.svg" alt="hd_logo" height={50} width={50} />
+      </div>
+      <div className={styles.section}>
+        <h3>Welcome Judges!</h3>
+        <p>Enter your username and password.</p>
+      </div>
+      <div className={styles.section}>
+        <LoginForm></LoginForm>
+      </div>
+    </div>
   );
 }

app/(pages)/(index)/projects/page.tsx → app/(pages)/judging-app/projects/page.tsx

@@ -3,7 +3,7 @@
 import ProtectedDisplay from '@components/ProtectedDisplay/ProtectedDisplay';
 import LoginPage from 'app/(pages)/judging-app/_components/LoginPage/LoginPage';
 // import SearchBar from './_components/SearchBar';
-import ProjectPage from '../_components/ProjectsPage/ProjectPage';
+import ProjectPage from './_components/ProjectPage';
 
 export default function Judges() {
   return (