From a89e108b6a224b0d1ad54c51c7a07937af513470 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?M=C3=A1rio=20Rodrigues?=
 <93675410+MarioRodrigues10@users.noreply.github.com>
Date: Fri, 24 Nov 2023 20:08:18 +0000
Subject: [PATCH 01/15] feat: faqs animation (#577)

---
 .github/workflows/trello.yml              |  4 ++--
 layout/FAQs/components/Question/index.tsx | 10 ++++++++--
 2 files changed, 10 insertions(+), 4 deletions(-)

diff --git a/.github/workflows/trello.yml b/.github/workflows/trello.yml
index cc4842dd..a449624e 100644
--- a/.github/workflows/trello.yml
+++ b/.github/workflows/trello.yml
@@ -10,8 +10,8 @@ on:
 jobs:
   build:
     runs-on: ubuntu-latest
-    steps: 
-      # Link PR to Trello    
+    steps:
+      # Link PR to Trello
       - name: Link to Trello
         uses: rematocorp/trello-integration-action@v7.1.0
         with:
diff --git a/layout/FAQs/components/Question/index.tsx b/layout/FAQs/components/Question/index.tsx
index cfb5f589..d4b49686 100644
--- a/layout/FAQs/components/Question/index.tsx
+++ b/layout/FAQs/components/Question/index.tsx
@@ -21,7 +21,13 @@ export default function Question({
       <h2 className="font-terminal-uppercase mb-4 text-2xl md:text-4xl">
         {title}
       </h2>
-      {showQuestion && <p>{description}</p>}
+      <div
+        className={`transition-max-height overflow-hidden duration-300 ${
+          showQuestion ? "max-h-48 opacity-100" : "max-h-0 opacity-0"
+        }`}
+      >
+        {description && <p>{description}</p>}
+      </div>
       <div className="flex items-center justify-end">
         <Link
           href={href}
@@ -30,7 +36,7 @@ export default function Question({
           {link}
         </Link>
         <button
-          className="font-terminal-uppercase w-16 rounded-full bg-quinary px-2 text-xl text-white"
+          className="font-terminal-uppercase w-16 transform rounded-full bg-quinary px-2 text-xl text-white transition-transform duration-300 hover:scale-110"
           onClick={() =>
             setShowQuestion((prevShowQuestion) => !prevShowQuestion)
           }

From 029bd58efd5612e7b657309d41fcdab9b758da07 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?M=C3=A1rio=20Rodrigues?=
 <93675410+MarioRodrigues10@users.noreply.github.com>
Date: Fri, 24 Nov 2023 20:12:35 +0000
Subject: [PATCH 02/15] fix: align sponsors tiers in mobile (#576)

---
 layout/Home/components/Sponsors/index.jsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/layout/Home/components/Sponsors/index.jsx b/layout/Home/components/Sponsors/index.jsx
index 58a36842..7176910b 100644
--- a/layout/Home/components/Sponsors/index.jsx
+++ b/layout/Home/components/Sponsors/index.jsx
@@ -25,7 +25,7 @@ export default function Sponsors(props) {
       <h2 className="font-terminal-uppercase flex justify-center py-10 text-center text-4xl xs:text-5xl sm:text-6xl md:text-8xl">
         Our amazing sponsors
       </h2>
-      <div className="mt-10 flex justify-center">
+      <div className="mt-10 flex items-end justify-center">
         <Tab
           tabName="Exclusive & Gold"
           selected={!val}

From 0de9a08ca377aef8ba8edd7cdc8240fd7571fdbd Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?M=C3=A1rio=20Rodrigues?=
 <93675410+MarioRodrigues10@users.noreply.github.com>
Date: Fri, 24 Nov 2023 21:02:54 +0000
Subject: [PATCH 03/15] feat: schedule open animation (#580)

---
 components/Schedule/Table/Block/index.jsx | 5 +++--
 1 file changed, 3 insertions(+), 2 deletions(-)

diff --git a/components/Schedule/Table/Block/index.jsx b/components/Schedule/Table/Block/index.jsx
index 50b38b4d..8a2e6eec 100644
--- a/components/Schedule/Table/Block/index.jsx
+++ b/components/Schedule/Table/Block/index.jsx
@@ -55,8 +55,9 @@ function BlockItem({
 
       {description && (
         <div
-          className={styles.description}
-          style={{ display: focused ? "block" : "none" }}
+          className={`transition-max-height overflow-hidden duration-300 ${
+            focused ? "max-h-96" : "max-h-0"
+          }`}
         >
           {description.split("\n").map((text, i) => (
             <p key={i} className={`mb-2 font-iregular text-lg text-white`}>

From 4923c9c2b8c25b363b8b4796cea55fd5cd4928d0 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?D=C3=A1rio=20Guimar=C3=A3es?=
 <49988070+Darguima@users.noreply.github.com>
Date: Fri, 24 Nov 2023 21:07:36 +0000
Subject: [PATCH 04/15] feat: add password visibility button to authentication
 pages (#572)

* LoginForm Visibility Feature

* Others Pages Password Visibility Feature

* `register/[uuid].js` Password Visibility Feature

* Ran Formatter

* Created PasswordInput component

* Add cursors-pointer style

* Ran formatter

* GH requested Changes

* Fixed name/id props

* Removing right Props from Input

* Adding ids props and some fixes

* removed type props

* Revert "Removing right Props from Input"

This reverts commit 3ac9ec63a7d2f864a31236bee4fdfa5ebc88a006.

* InputBase Wrapper Component
---
 components/Input/index.tsx                    | 92 ++++++++++++-------
 components/PasswordInput/index.tsx            | 45 +++++++++
 layout/Login/components/LoginForm/index.tsx   |  5 +-
 .../components/ResetPasswordForm/index.tsx    | 10 +-
 layout/SignUp/components/SignUpForm/index.tsx | 13 +--
 pages/register/[uuid].js                      | 15 ++-
 6 files changed, 121 insertions(+), 59 deletions(-)
 create mode 100644 components/PasswordInput/index.tsx

diff --git a/components/Input/index.tsx b/components/Input/index.tsx
index 1074d261..ed3eade3 100644
--- a/components/Input/index.tsx
+++ b/components/Input/index.tsx
@@ -1,29 +1,26 @@
 import { forwardRef, InputHTMLAttributes } from "react";
 
-interface Props extends InputHTMLAttributes<HTMLInputElement> {
+export interface InputBaseProps
+  extends Pick<InputHTMLAttributes<HTMLDivElement>, "id" | "children"> {
   text: string;
-  autocomplete?: string;
   fgColor: string;
   bgColor: string;
   enabled?: boolean;
 }
 
-export default forwardRef<HTMLInputElement, Props>(function Input(
-  {
-    text,
-    id,
-    name,
-    type,
-    value,
-    autocomplete,
-    fgColor,
-    bgColor,
-    onChange,
-    enabled,
-    ...rest
-  },
-  ref
-) {
+export interface InputDefaultProps
+  extends InputBaseProps,
+    InputHTMLAttributes<HTMLInputElement> {}
+
+// A wrapper to the <input> to standardize styles for the container
+export function InputBase({
+  text,
+  id,
+  fgColor,
+  bgColor,
+  enabled,
+  children,
+}: InputBaseProps) {
   let textColor = `text-${fgColor}`;
   let backColor = `bg-${bgColor}`;
 
@@ -43,21 +40,52 @@ export default forwardRef<HTMLInputElement, Props>(function Input(
       >
         {text}
       </label>
-      <div className="mt-2">
-        <input
-          id={id}
-          name={name}
-          type={type}
-          autoComplete={autocomplete}
-          value={value}
-          required
-          className={`text-iregular ${textColor} ${backColor} block w-full appearance-none rounded-full border border-gray-300 px-3 py-2 pl-6 placeholder-gray-400 shadow-sm focus:outline-none sm:text-sm`}
-          onChange={onChange}
-          disabled={enabled == false}
-          ref={ref}
-          {...rest}
-        />
+      <div
+        className={`text-iregular mt-2 flex items-center ${textColor} ${backColor} appearance-none rounded-full border border-gray-300 px-3 py-2 pl-6 placeholder-gray-400 shadow-sm sm:text-sm`}
+      >
+        {children}
       </div>
     </div>
   );
+}
+
+export default forwardRef<HTMLInputElement, InputDefaultProps>(function Input(
+  {
+    text,
+    id,
+    name,
+    type,
+    value,
+    autoComplete,
+    fgColor,
+    bgColor,
+    onChange,
+    enabled,
+    ...rest
+  },
+  ref
+) {
+  return (
+    <InputBase
+      text={text}
+      id={id}
+      fgColor={fgColor}
+      bgColor={bgColor}
+      enabled={enabled}
+    >
+      <input
+        id={id}
+        name={name}
+        type={type}
+        autoComplete={autoComplete}
+        value={value}
+        required
+        className="w-full bg-transparent outline-none"
+        onChange={onChange}
+        disabled={enabled == false}
+        ref={ref}
+        {...rest}
+      />
+    </InputBase>
+  );
 });
diff --git a/components/PasswordInput/index.tsx b/components/PasswordInput/index.tsx
new file mode 100644
index 00000000..82181a6b
--- /dev/null
+++ b/components/PasswordInput/index.tsx
@@ -0,0 +1,45 @@
+import { forwardRef, useState } from "react";
+
+import { InputBase, InputDefaultProps } from "@components/Input";
+
+import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
+import { faEye, faEyeSlash } from "@fortawesome/free-solid-svg-icons";
+
+export default forwardRef<HTMLInputElement, InputDefaultProps>(
+  function PasswordInput(
+    { text, id, name, type, fgColor, bgColor, enabled, ...rest },
+    ref
+  ) {
+    const [isPasswordVisible, setIsPasswordVisible] = useState(false);
+
+    const togglePasswordVisibility = () => {
+      setIsPasswordVisible(!isPasswordVisible);
+    };
+
+    return (
+      <InputBase
+        text={text}
+        id={id}
+        fgColor={fgColor}
+        bgColor={bgColor}
+        enabled={enabled}
+      >
+        <input
+          id={id}
+          name={name}
+          type={isPasswordVisible ? "text" : "password"}
+          required
+          className="w-full bg-transparent outline-none"
+          disabled={enabled == false}
+          ref={ref}
+          {...rest}
+        />
+        <FontAwesomeIcon
+          className="mx-2 cursor-pointer"
+          onClick={togglePasswordVisibility}
+          icon={isPasswordVisible ? faEyeSlash : faEye}
+        />
+      </InputBase>
+    );
+  }
+);
diff --git a/layout/Login/components/LoginForm/index.tsx b/layout/Login/components/LoginForm/index.tsx
index f4c8b174..5f2412a5 100644
--- a/layout/Login/components/LoginForm/index.tsx
+++ b/layout/Login/components/LoginForm/index.tsx
@@ -7,6 +7,7 @@ import Text from "@layout/moonstone/authentication/Text";
 
 import Form from "@components/Form";
 import Input from "@components/Input";
+import PasswordInput from "@components/PasswordInput";
 
 export default function LoginForm() {
   const { errors, login, isLoading } = useAuth();
@@ -35,14 +36,12 @@ export default function LoginForm() {
           autoComplete="email"
           ref={emailRef}
         />
-        <Input
+        <PasswordInput
           text="YOUR PASSWORD"
           id="password"
           name="password"
-          type="password"
           fgColor="white"
           bgColor="primary"
-          autoComplete="current-password"
           ref={passwordRef}
         />
         <Text
diff --git a/layout/ResetPassword/components/ResetPasswordForm/index.tsx b/layout/ResetPassword/components/ResetPasswordForm/index.tsx
index 25c087c8..c3855666 100644
--- a/layout/ResetPassword/components/ResetPasswordForm/index.tsx
+++ b/layout/ResetPassword/components/ResetPasswordForm/index.tsx
@@ -9,7 +9,7 @@ import Button from "@components/Button";
 import ImageButton from "@components/ImageButton";
 
 import Form from "@components/Form";
-import Input from "@components/Input";
+import PasswordInput from "@components/PasswordInput";
 
 export default function ResetPasswordForm() {
   const router = useRouter();
@@ -51,22 +51,18 @@ export default function ResetPasswordForm() {
     <>
       {success === null && (
         <Form onSubmit={onSubmit}>
-          <Input
+          <PasswordInput
             text="PASSWORD"
             id="password"
             name="password"
-            type="password"
-            autoComplete="current-password"
             fgColor="white"
             bgColor="primary"
             ref={passwordRef}
           />
-          <Input
+          <PasswordInput
             text="CONFIRM PASSWORD"
             id="confirm"
             name="confirm"
-            type="password"
-            autoComplete="current-password"
             fgColor="white"
             bgColor="primary"
             ref={passwordConfirmationRef}
diff --git a/layout/SignUp/components/SignUpForm/index.tsx b/layout/SignUp/components/SignUpForm/index.tsx
index cceb561d..ce68720f 100644
--- a/layout/SignUp/components/SignUpForm/index.tsx
+++ b/layout/SignUp/components/SignUpForm/index.tsx
@@ -5,6 +5,7 @@ import { useAuth } from "@context/Auth";
 import Button from "@components/Button";
 import Form from "@components/Form";
 import Input from "@components/Input";
+import PasswordInput from "@components/PasswordInput";
 
 import BarebonesQRScanner from "@components/QRScanner/BarebonesQRScanner";
 
@@ -92,22 +93,18 @@ export default function SignUpForm() {
           bgColor="primary"
           onChange={(e) => updateNickname(e.currentTarget.value)}
         />
-        <Input
+        <PasswordInput
           text="PASSWORD"
           id="password"
           name="password"
-          type="password"
-          autoComplete="current-password"
           fgColor="white"
           bgColor="primary"
           onChange={(e) => updatePassword(e.currentTarget.value)}
         />
-        <Input
+        <PasswordInput
           text="CONFIRM PASSWORD"
-          id="password"
-          name="password"
-          type="password"
-          autoComplete="current-password"
+          id="confirm"
+          name="confirm"
           fgColor="white"
           bgColor="primary"
           onChange={(e) => updatePasswordConfirmation(e.currentTarget.value)}
diff --git a/pages/register/[uuid].js b/pages/register/[uuid].js
index 8687c621..728191d7 100644
--- a/pages/register/[uuid].js
+++ b/pages/register/[uuid].js
@@ -9,6 +9,7 @@ import Card from "@components/Card";
 import Return from "@components/Return";
 import Form from "@components/Form";
 import Input from "@components/Input";
+import PasswordInput from "@components/PasswordInput";
 
 import Title from "@layout/moonstone/authentication/Title";
 import Text from "@layout/moonstone/authentication/Text";
@@ -68,22 +69,18 @@ function Register() {
             bgColor="primary"
             onChange={(e) => updateNickname(e.currentTarget.value)}
           />
-          <Input
+          <PasswordInput
             text="PASSWORD"
-            id="password"
+            id="confirm"
             name="password"
-            type="password"
-            autoComplete="current-password"
             fgColor="white"
             bgColor="primary"
             onChange={(e) => updatePassword(e.currentTarget.value)}
           />
-          <Input
+          <PasswordInput
             text="CONFIRM PASSWORD"
-            id="password"
-            name="password"
-            type="password"
-            autoComplete="current-password"
+            id="confirm"
+            name="confirm"
             fgColor="white"
             bgColor="primary"
             onChange={(e) => updatePasswordConfirmation(e.currentTarget.value)}

From 2d897a8eef041057c5330f5d2d1cc7b076b7f7bf Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?M=C3=A1rio=20Rodrigues?=
 <93675410+MarioRodrigues10@users.noreply.github.com>
Date: Fri, 24 Nov 2023 21:25:58 +0000
Subject: [PATCH 05/15] feat: speakers open animation (#581)

---
 .../components/Schedule/Table/Block/index.jsx         | 11 +++++++++--
 1 file changed, 9 insertions(+), 2 deletions(-)

diff --git a/layout/Speakers/components/Schedule/Table/Block/index.jsx b/layout/Speakers/components/Schedule/Table/Block/index.jsx
index ecdd5481..34af5668 100644
--- a/layout/Speakers/components/Schedule/Table/Block/index.jsx
+++ b/layout/Speakers/components/Schedule/Table/Block/index.jsx
@@ -91,8 +91,15 @@ export default function Block({
           </div>
         </div>
       </div>
-
-      <p className={showSpeaker ? "hidden" : ""}>{description}</p>
+      <div>
+        <p
+          className={`transition-max-height overflow-hidden duration-300 max-h-${
+            showSpeaker ? "0" : "96"
+          }`}
+        >
+          {description}
+        </p>
+      </div>
     </div>
   );
 }

From c08956593dd4f680173f473816c28bba4bff9960 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?M=C3=A1rio=20Rodrigues?=
 <93675410+MarioRodrigues10@users.noreply.github.com>
Date: Sun, 26 Nov 2023 18:30:03 +0000
Subject: [PATCH 06/15] chore: standardize buttons using a button component
 (#571)

* chore: use a Button component

chore: use a Button component

* fix: run formatter

* fix: styling problems

* fix: implement suggestions

* chore: implement suggestions

* fix: implement suggestions

* fix: implement suggestions

* fix: build error

* fix: build error

* fix: types error in button
---
 components/Button/index.tsx                   | 30 +++++++++++++++----
 components/Layout/Layout.tsx                  |  2 +-
 components/QRScanner/index.jsx                |  2 +-
 layout/Attendee/Profile/Profile.tsx           | 12 ++++----
 layout/Attendee/Wheel/Wheel.tsx               | 14 ++++-----
 .../components/Challenges/Challenge/index.tsx |  2 +-
 layout/Hackathon/components/Hero/index.jsx    |  2 +-
 .../components/Regulations/index.jsx          |  2 +-
 layout/Home/components/Hackathon/index.jsx    |  2 +-
 layout/Home/components/Hero/Pitch/index.jsx   |  5 ++--
 layout/Home/components/Speakers/index.jsx     |  5 ++--
 layout/Login/components/LoginForm/index.tsx   |  4 +--
 layout/Product/Product.tsx                    | 14 ++++-----
 .../components/ResetPasswordForm/index.tsx    |  2 +-
 layout/SignUp/components/SignUpForm/index.tsx |  8 ++---
 layout/Staff/Prize/Prize.tsx                  |  4 +--
 .../components/StaffRedeemButton/index.jsx    |  8 +++--
 .../dashboard/SponsorBadgeButton/index.jsx    |  9 ++++--
 .../dashboard/SponsorPrizeButton/index.jsx    |  9 ++++--
 .../spotlight/SpotlightButton/index.jsx       |  9 ++++--
 layout/shared/Leaderboard/Leaderboard.tsx     | 20 ++++++-------
 pages/register/[uuid].js                      |  4 +--
 22 files changed, 99 insertions(+), 70 deletions(-)

diff --git a/components/Button/index.tsx b/components/Button/index.tsx
index 87dcc5f3..d2ff5b36 100644
--- a/components/Button/index.tsx
+++ b/components/Button/index.tsx
@@ -1,27 +1,45 @@
-import { ButtonHTMLAttributes } from "react";
+import { ButtonHTMLAttributes, ReactNode } from "react";
 
-interface Props extends ButtonHTMLAttributes<HTMLButtonElement> {
-  text: string;
+interface Props extends Omit<ButtonHTMLAttributes<HTMLButtonElement>, "title"> {
+  title: ReactNode;
+  description?: string;
   customStyle?: string;
+  bold?: boolean;
+  disabled?: boolean;
+}
+
+interface ButtonTitleProps {
+  title: ReactNode;
+  bold?: boolean;
 }
 
 export default function Button({
-  text,
+  title,
+  description,
   type,
   disabled,
   onClick,
   customStyle,
+  bold,
+  ...rest
 }: Props) {
   return (
     <button
+      {...rest}
       onClick={onClick}
       type={type}
       disabled={disabled}
       className={`${
         customStyle || ""
-      } w-full items-center rounded-full border px-4 py-4 text-center font-iregular text-sm shadow-sm`}
+      } m-auto block rounded-full hover:opacity-75 disabled:bg-gray-400 disabled:opacity-75`}
     >
-      {text}
+      <ButtonTitle title={title} bold={bold} />
+      <p className="font-iregular">{description}</p>
     </button>
   );
 }
+
+function ButtonTitle({ title, bold }: ButtonTitleProps) {
+  const className = bold ? "font-ibold" : "font-iregular";
+  return <div className={className}>{title}</div>;
+}
diff --git a/components/Layout/Layout.tsx b/components/Layout/Layout.tsx
index 2a82e41b..21c4feef 100644
--- a/components/Layout/Layout.tsx
+++ b/components/Layout/Layout.tsx
@@ -174,7 +174,7 @@ function MobileNavbar({
 
                   <button type="button" onClick={onClose} className="h-12 w-12">
                     <span className="sr-only">Close sidebar</span>
-                    <FontAwesomeIcon icon={faTimes} />
+                    title={<FontAwesomeIcon icon={faTimes} />}
                   </button>
                 </div>
 
diff --git a/components/QRScanner/index.jsx b/components/QRScanner/index.jsx
index 9a043354..5d05d4be 100644
--- a/components/QRScanner/index.jsx
+++ b/components/QRScanner/index.jsx
@@ -52,7 +52,7 @@ function QRScanner({
       </div>
       {removeClose !== true && (
         <Button
-          text="Close"
+          title="Close"
           onClick={() => {
             setScanner(false);
           }}
diff --git a/layout/Attendee/Profile/Profile.tsx b/layout/Attendee/Profile/Profile.tsx
index 9aa249b5..69f0838f 100644
--- a/layout/Attendee/Profile/Profile.tsx
+++ b/layout/Attendee/Profile/Profile.tsx
@@ -6,6 +6,7 @@ import Form from "@components/Form";
 import Input from "@components/Input";
 
 import Layout from "@components/Layout";
+import Button from "@components/Button";
 import Heading from "@components/Heading";
 
 import { CheckpointTracker, CodeInput } from "./components";
@@ -92,13 +93,10 @@ function Profile() {
         <div className="col-span-1 float-left w-full xl:w-1/2">
           <Heading text="User Profile">
             <div className="w-auto">
-              <button
-                className="w-full items-center rounded-full border border-quinary bg-quinary py-2 px-4 text-center font-iregular text-sm text-secondary shadow-sm"
-                type="submit"
-                form="profile-form"
-              >
-                {editing ? "Save Changes" : "Edit"}
-              </button>
+              <Button
+                customStyle="w-full items-center rounded-full border border-quinary bg-quinary py-2 px-4 text-center font-iregular text-sm text-secondary shadow-sm"
+                title={editing ? "Save Changes" : "Edit"}
+              />
             </div>
           </Heading>
 
diff --git a/layout/Attendee/Wheel/Wheel.tsx b/layout/Attendee/Wheel/Wheel.tsx
index 5aa9f2e2..aeacf190 100644
--- a/layout/Attendee/Wheel/Wheel.tsx
+++ b/layout/Attendee/Wheel/Wheel.tsx
@@ -2,7 +2,7 @@ import { useState, useEffect } from "react";
 import { withAuth, useAuth } from "@context/Auth";
 
 import Heading from "@components/Heading";
-
+import Button from "@components/Button";
 import Layout from "@components/Layout";
 
 import {
@@ -202,18 +202,18 @@ function WheelPage() {
             <div className="m-auto h-72 w-72 xs:h-80 xs:w-80 sm:h-96 sm:w-96">
               <WheelComponent steps={16} angle={st.angle} />
             </div>
-            <button
-              className={`${
+            <Button
+              customStyle={`${
                 canSpin()
                   ? "cursor-pointer bg-quinary"
                   : "bg-gray-400 opacity-50"
               } m-auto mt-10 block h-20 w-64 rounded-full`}
               disabled={!canSpin()}
               onClick={spinTheWheel}
-            >
-              <p className="select-none font-ibold font-bold">SPIN THE WHEEL</p>
-              <p className="select-none font-iregular">{price} tokens💰</p>
-            </button>
+              title="SPIN THE WHEEL"
+              description={`${price} tokens💰`}
+              bold={true}
+            />
           </div>
         </div>
         <div className="col-span-1 float-right w-full 2xl:w-1/2 2xl:pl-6">
diff --git a/layout/Challenges/components/Challenges/Challenge/index.tsx b/layout/Challenges/components/Challenges/Challenge/index.tsx
index 24935b26..065cdeea 100644
--- a/layout/Challenges/components/Challenges/Challenge/index.tsx
+++ b/layout/Challenges/components/Challenges/Challenge/index.tsx
@@ -6,7 +6,7 @@ function Action({ text, url }) {
     <div className="mt-5 w-60">
       <Button
         onClick={(e) => (window.location.href = url)}
-        text={text}
+        title={text}
         customStyle="text-white bg-primary border-tertiary hover:bg-tertiary"
       />
     </div>
diff --git a/layout/Hackathon/components/Hero/index.jsx b/layout/Hackathon/components/Hero/index.jsx
index b360cc59..04adabc4 100644
--- a/layout/Hackathon/components/Hero/index.jsx
+++ b/layout/Hackathon/components/Hero/index.jsx
@@ -24,7 +24,7 @@ export default function Hero() {
             <span className="inline-block w-56 content-center items-center text-center align-middle">
               <a href="https://forms.gle/eFft9LTLSQzJjTG29">
                 <Button
-                  text="REGISTER YOUR TEAM"
+                  title="REGISTER YOUR TEAM"
                   customStyle="text-white bg-primary border-tertiary hover:bg-tertiary"
                 />
               </a>
diff --git a/layout/Hackathon/components/Regulations/index.jsx b/layout/Hackathon/components/Regulations/index.jsx
index fbfb7aab..3a24fe4f 100644
--- a/layout/Hackathon/components/Regulations/index.jsx
+++ b/layout/Hackathon/components/Regulations/index.jsx
@@ -13,7 +13,7 @@ export default function Regulations() {
         <div className="mt-6 sm:mt-0 sm:w-80">
           <Link href={"/docs/hackathon.pdf"}>
             <Button
-              text="READ THE RULES"
+              title="READ THE RULES"
               customStyle="text-white bg-primary border-tertiary hover:bg-tertiary"
             />
           </Link>
diff --git a/layout/Home/components/Hackathon/index.jsx b/layout/Home/components/Hackathon/index.jsx
index d5607bfe..970d131f 100644
--- a/layout/Home/components/Hackathon/index.jsx
+++ b/layout/Home/components/Hackathon/index.jsx
@@ -15,7 +15,7 @@ export default function Hackathon() {
             <span className="w-56 self-center">
               <a href="https://forms.gle/8aSEUubkjei1Dpym6">
                 <Button
-                  text="REGISTER YOUR TEAM"
+                  title="REGISTER YOUR TEAM"
                   customStyle="text-white bg-secondary border-quaternary hover:border-quinary"
                 />
               </a>{" "}
diff --git a/layout/Home/components/Hero/Pitch/index.jsx b/layout/Home/components/Hero/Pitch/index.jsx
index 073bc22d..d4d8d0c9 100644
--- a/layout/Home/components/Hero/Pitch/index.jsx
+++ b/layout/Home/components/Hero/Pitch/index.jsx
@@ -10,8 +10,9 @@ export default function Pitch() {
       <div className="mt-8 flex w-56">
         <a href="/team">
           <Button
-            text="MEET THE TEAM"
-            customStyle="hover:text-quinary hover:border-quinary"
+            title="MEET THE TEAM"
+            customStyle="w-56 h-20 border-2 text-white border-white hover:text-quinary hover:border-quinary"
+            bold={false}
           />
         </a>
       </div>
diff --git a/layout/Home/components/Speakers/index.jsx b/layout/Home/components/Speakers/index.jsx
index a1ebfccb..12c38d12 100644
--- a/layout/Home/components/Speakers/index.jsx
+++ b/layout/Home/components/Speakers/index.jsx
@@ -15,8 +15,9 @@ export default function Speakers() {
         <div className="xs:w-70 w-60 sm:w-80">
           <Link href="/speakers">
             <Button
-              text="MEET THE SPEAKERS"
-              customStyle="text-white bg-secondary border-quaternary hover:border-quinary hover:bg-quinary "
+              title="MEET THE SPEAKERS"
+              customStyle="text-white border-white border-4 h-20 w-full hover:border-quinary hover:bg-quinary"
+              bold={true}
             />
           </Link>
         </div>
diff --git a/layout/Login/components/LoginForm/index.tsx b/layout/Login/components/LoginForm/index.tsx
index 5f2412a5..7bd2a561 100644
--- a/layout/Login/components/LoginForm/index.tsx
+++ b/layout/Login/components/LoginForm/index.tsx
@@ -51,10 +51,10 @@ export default function LoginForm() {
           href="/forgot-password"
         />
         <Button
-          text={isLoading ? "Authenticating..." : "LET'S GO"}
+          title={isLoading ? "Authenticating..." : "LET'S GO"}
           disabled={isLoading}
           type="submit"
-          customStyle="text-secondary bg-quinary border-quinary"
+          customStyle="text-secondary bg-quinary border-quinary w-full h-16"
         />
         {errors && <p className="text-center text-failure">{errors}</p>}
       </Form>
diff --git a/layout/Product/Product.tsx b/layout/Product/Product.tsx
index f6f16c0e..85131df0 100644
--- a/layout/Product/Product.tsx
+++ b/layout/Product/Product.tsx
@@ -7,7 +7,7 @@ import { getProduct, buyProduct } from "@lib/api";
 import { withAuth, useAuth } from "@context/Auth";
 
 import Balance from "@components/Balance";
-
+import Button from "@components/Button";
 import Layout from "@components/Layout";
 
 function ProductSlug() {
@@ -82,19 +82,19 @@ function ProductSlug() {
 
               <div className="mt-10">
                 {product.can_buy > 0 && product.stock > 0 && (
-                  <button
+                  <Button
                     onClick={() =>
                       buyProduct(product.id).then(() => {
                         updateProductInfo((needsUpdate) => !needsUpdate);
                         refetchUser();
                       })
                     }
-                    className="m-auto block h-20 w-full rounded-full bg-quinary hover:opacity-75 disabled:opacity-75"
+                    customStyle="m-auto block h-20 w-full rounded-full bg-quinary hover:opacity-75 disabled:bg-gray-400 disabled:opacity-75"
                     disabled={user.token_balance < product.price}
-                  >
-                    <p className="font-ibold font-bold">REDEEM</p>
-                    <p className="font-iregular">{product.price} tokens 💰</p>
-                  </button>
+                    title="REDEEM"
+                    description={`${product.price} tokens 💰`}
+                    bold={true}
+                  />
                 )}
               </div>
               <div className="mt-6 text-center">
diff --git a/layout/ResetPassword/components/ResetPasswordForm/index.tsx b/layout/ResetPassword/components/ResetPasswordForm/index.tsx
index c3855666..2a942c19 100644
--- a/layout/ResetPassword/components/ResetPasswordForm/index.tsx
+++ b/layout/ResetPassword/components/ResetPasswordForm/index.tsx
@@ -96,7 +96,7 @@ export default function ResetPasswordForm() {
             <Link href="/login">
               <Button
                 type="button"
-                text="BACK TO LOGIN"
+                title="BACK TO LOGIN"
                 customStyle="text-secondary bg-quinary border-quinary"
               />
             </Link>
diff --git a/layout/SignUp/components/SignUpForm/index.tsx b/layout/SignUp/components/SignUpForm/index.tsx
index ce68720f..595a1523 100644
--- a/layout/SignUp/components/SignUpForm/index.tsx
+++ b/layout/SignUp/components/SignUpForm/index.tsx
@@ -110,8 +110,8 @@ export default function SignUpForm() {
           onChange={(e) => updatePasswordConfirmation(e.currentTarget.value)}
         />
         <Button
-          text={scanning ? "STOP SCANNING" : "SCAN QR"}
-          customStyle="text-secondary bg-quinary border-quinary"
+          title={scanning ? "STOP SCANNING" : "SCAN QR"}
+          customStyle="w-full h-12 text-secondary bg-quinary border-quinary"
           onClick={(e) => {
             e.preventDefault();
             updateScanning(!scanning);
@@ -137,8 +137,8 @@ export default function SignUpForm() {
         )}
         <Button
           type="submit"
-          text={isLoading ? "Registering..." : "LET'S GO"}
-          customStyle="text-secondary bg-quinary border-quinary"
+          title={isLoading ? "Registering..." : "LET'S GO"}
+          customStyle="w-full h-12 text-secondary bg-quinary border-quinary"
         />
         {(local_error || (!isLoading && errors)) && (
           <p className="mt-3 font-iregular text-lg text-red-400">
diff --git a/layout/Staff/Prize/Prize.tsx b/layout/Staff/Prize/Prize.tsx
index 0e5dbe0c..bdc6a11d 100644
--- a/layout/Staff/Prize/Prize.tsx
+++ b/layout/Staff/Prize/Prize.tsx
@@ -113,7 +113,7 @@ function Prize() {
                   </div>
                   <div className="w-32">
                     <Button
-                      text={`REDEEM ${product.not_redeemed}`}
+                      title={`REDEEM ${product.not_redeemed}`}
                       onClick={() => {
                         redeemRedeemables(product.id, product.not_redeemed);
                       }}
@@ -156,7 +156,7 @@ function Prize() {
                   </div>
                   <div className="w-32">
                     <Button
-                      text={`REDEEM ${product.not_redeemed}`}
+                      title={`REDEEM ${product.not_redeemed}`}
                       onClick={() => {
                         redeemWheelRedeemables(
                           product.id,
diff --git a/layout/Staff/components/StaffRedeemButton/index.jsx b/layout/Staff/components/StaffRedeemButton/index.jsx
index f817b489..094e6d5e 100644
--- a/layout/Staff/components/StaffRedeemButton/index.jsx
+++ b/layout/Staff/components/StaffRedeemButton/index.jsx
@@ -1,9 +1,11 @@
+import Button from "@components/Button";
 export default function StaffRedeemButton() {
   return (
     <div className="mt-8 w-auto">
-      <button className="m-auto block h-16 w-full rounded-full bg-quinary">
-        <p className="font-ibold font-bold">💰 Redeem prizes</p>
-      </button>
+      <Button
+        customStyle="m-auto block h-16 w-full rounded-full bg-quinary"
+        title="💰  Redeem prizes"
+      />
     </div>
   );
 }
diff --git a/layout/moonstone/sponsor/dashboard/SponsorBadgeButton/index.jsx b/layout/moonstone/sponsor/dashboard/SponsorBadgeButton/index.jsx
index 3fb2f6ef..5eb272bd 100644
--- a/layout/moonstone/sponsor/dashboard/SponsorBadgeButton/index.jsx
+++ b/layout/moonstone/sponsor/dashboard/SponsorBadgeButton/index.jsx
@@ -1,3 +1,5 @@
+import Button from "@components/Button";
+
 export default function SponsorBadgeButton({ sponsor, all }) {
   let text = all ? (
     <>
@@ -8,9 +10,10 @@ export default function SponsorBadgeButton({ sponsor, all }) {
   );
   return (
     <div className="mt-8 w-auto">
-      <button className="m-auto block h-16 w-full rounded-full bg-quinary">
-        <p className="font-iregular"> 🏅 Dar Badge {text} </p>
-      </button>
+      <Button
+        customStyle="m-auto block h-16 w-full rounded-full bg-quinary"
+        title="🏅 Dar Badge {text}"
+      />
     </div>
   );
 }
diff --git a/layout/moonstone/sponsor/dashboard/SponsorPrizeButton/index.jsx b/layout/moonstone/sponsor/dashboard/SponsorPrizeButton/index.jsx
index ae0e2fde..6fad0b9e 100644
--- a/layout/moonstone/sponsor/dashboard/SponsorPrizeButton/index.jsx
+++ b/layout/moonstone/sponsor/dashboard/SponsorPrizeButton/index.jsx
@@ -1,9 +1,12 @@
+import Button from "@components/Button";
+
 export default function SponsorPrizeButton({ prize }) {
   return (
     <div className="mt-8 w-auto">
-      <button className="m-auto block h-16 w-full rounded-full bg-quinary">
-        <p className="font-iregular"> 🏅 Prémio: {prize} </p>
-      </button>
+      <Button
+        customStyle="m-auto block h-16 w-full rounded-full bg-quinary"
+        title={`🏅  Prémio ${prize}`}
+      />
     </div>
   );
 }
diff --git a/layout/moonstone/sponsor/spotlight/SpotlightButton/index.jsx b/layout/moonstone/sponsor/spotlight/SpotlightButton/index.jsx
index 40b85b0c..9c518ce8 100644
--- a/layout/moonstone/sponsor/spotlight/SpotlightButton/index.jsx
+++ b/layout/moonstone/sponsor/spotlight/SpotlightButton/index.jsx
@@ -1,9 +1,12 @@
+import Button from "@components/Button";
+
 export default function SpotlightButton() {
   return (
     <div className="mt-8 w-auto">
-      <button className="m-auto block h-16 w-full rounded-full bg-quinary">
-        <p className="font-ibold"> Ativar Spotlight </p>
-      </button>
+      <Button
+        customStyle="m-auto block h-16 w-full rounded-full bg-quinary"
+        title="Ativar Spotlight"
+      />
     </div>
   );
 }
diff --git a/layout/shared/Leaderboard/Leaderboard.tsx b/layout/shared/Leaderboard/Leaderboard.tsx
index faf30317..29a45442 100644
--- a/layout/shared/Leaderboard/Leaderboard.tsx
+++ b/layout/shared/Leaderboard/Leaderboard.tsx
@@ -5,6 +5,7 @@ import { withAuth, useAuth } from "@context/Auth";
 import Layout from "@components/Layout";
 import { Table } from "./components";
 
+import Button from "@components/Button";
 import Day from "@components/Schedule/Day";
 import ErrorMessage from "@components/ErrorMessage";
 
@@ -130,26 +131,25 @@ function Leaderboard() {
         </div>
         <div className="col-span-1 w-full 2xl:pl-24">
           <div className="flex justify-center gap-6 xs:gap-10 md:gap-24">
-            <button
-              className={`font-iregular bg-${
+            <Button
+              customStyle={`font-iregular bg-${
                 hallOfFame ? "white" : "quinary"
               } h-12 items-center rounded-full px-4 py-1 text-center text-black`}
               onClick={(e) => {
                 updateHallOfFame(false);
               }}
-            >
-              LEADERBOARD
-            </button>
-            <button
-              className={`font-iregular bg-${
+              title="LEADERBOARD"
+            />
+
+            <Button
+              customStyle={`font-iregular bg-${
                 hallOfFame ? "quinary" : "white"
               } h-12 items-center rounded-full px-4 py-1 text-center text-black`}
               onClick={(e) => {
                 updateHallOfFame(true);
               }}
-            >
-              HALL OF FAME
-            </button>
+              title="HALL OF FAME"
+            />
           </div>
           {error && <ErrorMessage />}
           <Table list={leaderboard} user={user.id} maxUsersToShow={5} />
diff --git a/pages/register/[uuid].js b/pages/register/[uuid].js
index 728191d7..265df8b3 100644
--- a/pages/register/[uuid].js
+++ b/pages/register/[uuid].js
@@ -86,9 +86,9 @@ function Register() {
             onChange={(e) => updatePasswordConfirmation(e.currentTarget.value)}
           />
           <Button
-            type="submit"
+            title="Submit"
             text={isLoading ? "Registering..." : "LET'S GO"}
-            customStyle="text-secondary bg-quinary border-quinary"
+            customStyle="w-full h-12 text-secondary bg-quinary border-quinary"
           />
           {errors && (
             <p className="mt-3 font-iregular text-lg text-red-400">

From cd332a81ad35c49dfd41fd36b84dc3adafe6cd13 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Jo=C3=A3o=20Lobo?=
 <30907944+joaodiaslobo@users.noreply.github.com>
Date: Wed, 29 Nov 2023 23:17:20 +0000
Subject: [PATCH 07/15] feat: add course to attendee (#579)

---
 components/Input/index.tsx                    | 12 +---
 components/Select/index.tsx                   | 65 +++++++++++++++++++
 layout/Attendee/Profile/Profile.tsx           | 31 +++++++--
 layout/SignUp/SignUp.tsx                      |  4 +-
 layout/SignUp/components/SignUpForm/index.tsx | 22 ++++++-
 lib/api.js                                    | 13 ++++
 pages/attendee/profile.tsx                    | 19 +++++-
 pages/register/[uuid].js                      | 34 +++++++++-
 pages/signup.tsx                              | 19 +++++-
 9 files changed, 199 insertions(+), 20 deletions(-)
 create mode 100644 components/Select/index.tsx

diff --git a/components/Input/index.tsx b/components/Input/index.tsx
index ed3eade3..63eb6798 100644
--- a/components/Input/index.tsx
+++ b/components/Input/index.tsx
@@ -24,14 +24,6 @@ export function InputBase({
   let textColor = `text-${fgColor}`;
   let backColor = `bg-${bgColor}`;
 
-  if (enabled === false) {
-    textColor = "text-gray-500";
-    backColor = "bg-gray-100";
-  } else if (enabled === true) {
-    textColor = `bg-${fgColor}`;
-    backColor = `bg-${bgColor}`;
-  }
-
   return (
     <div>
       <label
@@ -41,7 +33,9 @@ export function InputBase({
         {text}
       </label>
       <div
-        className={`text-iregular mt-2 flex items-center ${textColor} ${backColor} appearance-none rounded-full border border-gray-300 px-3 py-2 pl-6 placeholder-gray-400 shadow-sm sm:text-sm`}
+        className={`text-iregular mt-2 flex items-center  ${
+          enabled == false ? "text-gray-500" : textColor 
+        } ${backColor} appearance-none rounded-full border border-gray-300 px-3 py-2 pl-6 placeholder-gray-400 shadow-sm sm:text-sm`}
       >
         {children}
       </div>
diff --git a/components/Select/index.tsx b/components/Select/index.tsx
new file mode 100644
index 00000000..80489e6c
--- /dev/null
+++ b/components/Select/index.tsx
@@ -0,0 +1,65 @@
+import { SelectHTMLAttributes } from "react";
+
+import { ChevronDownIcon } from "@heroicons/react/solid";
+
+interface Option {
+  key: any;
+  name: string;
+}
+
+interface Props extends SelectHTMLAttributes<HTMLSelectElement> {
+  text: string;
+  options: Option[];
+  customStyle?: string;
+  fgColor: string;
+  bgColor: string;
+  enabled?: boolean;
+}
+
+export default function Select({
+  id,
+  text,
+  options,
+  enabled,
+  fgColor,
+  bgColor,
+  customStyle,
+  ...rest
+}: Props) {
+  let textColor = `text-${fgColor}`;
+  let backColor = `bg-${bgColor}`;
+  let disabled = enabled == false;
+
+  return (
+    <div>
+      <label
+        htmlFor={id}
+        className={`pl-6 font-iregular text-${fgColor} mt-5 block text-sm`}
+      >
+        {text}
+      </label>
+      <div
+        className={`text-iregular relative mt-2 flex ${textColor} ${backColor} block w-full appearance-none rounded-full border border-gray-300 py-2 placeholder-gray-400 shadow-sm focus:outline-none sm:text-sm`}
+      >
+        <select
+          id={id}
+          disabled={disabled}
+          className={`text-iregular ${
+            disabled ? "text-gray-500" : textColor
+          } ${backColor} block w-full appearance-none rounded-full px-3 pr-10 pl-6 placeholder-gray-400 opacity-100 focus:outline-none sm:text-sm`}
+          {...rest}
+        >
+          {options.map((option) => (
+            <option key={option.key} value={option.key}>{option.name}</option>
+          ))}
+        </select>
+        <ChevronDownIcon
+          className={`${
+            !disabled ? "block" : "hidden"
+          } pointer-events-none absolute top-0 bottom-0 right-3 m-auto h-7 text-${fgColor}`}
+          aria-hidden="true"
+        />
+      </div>
+    </div>
+  );
+}
diff --git a/layout/Attendee/Profile/Profile.tsx b/layout/Attendee/Profile/Profile.tsx
index 69f0838f..645baf40 100644
--- a/layout/Attendee/Profile/Profile.tsx
+++ b/layout/Attendee/Profile/Profile.tsx
@@ -1,9 +1,10 @@
-import { useState } from "react";
+import { useState, useEffect } from "react";
 
 import { withAuth, useAuth } from "@context/Auth";
 
 import Form from "@components/Form";
 import Input from "@components/Input";
+import Select from "@components/Select";
 
 import Layout from "@components/Layout";
 import Button from "@components/Button";
@@ -14,11 +15,17 @@ import CVInput from "./components/CVInput";
 import { resetPassword } from "@lib/api";
 import { getFirstName } from "@lib/naming";
 
-function Profile() {
+interface Course {
+  id: any;
+  name: string;
+}
+
+function Profile({ courses }) {
   const { user, editUser } = useAuth();
   const [avatar, setAvatar] = useState(null);
   const [editing, setEditing] = useState(false);
   const [username, setUsername] = useState(user.nickname || "");
+  const [course, setCourse] = useState(user.course || "");
 
   const [photoFileUrl, setPhotoFileUrl] = useState<string>(user.avatar);
 
@@ -61,6 +68,7 @@ function Profile() {
     e.preventDefault();
     const formData = new FormData();
     formData.append("attendee[nickname]", username);
+    formData.append("attendee[course_id]", course);
     formData.append("attendee[avatar]", avatar);
 
     if (editing) {
@@ -96,6 +104,8 @@ function Profile() {
               <Button
                 customStyle="w-full items-center rounded-full border border-quinary bg-quinary py-2 px-4 text-center font-iregular text-sm text-secondary shadow-sm"
                 title={editing ? "Save Changes" : "Edit"}
+                form="profile-form"
+                type="submit"
               />
             </div>
           </Heading>
@@ -135,7 +145,7 @@ function Profile() {
               id="name"
               name="name"
               value={user.name || ""}
-              bgColor="white"
+              bgColor="primary"
               fgColor="white"
               enabled={false}
             />
@@ -144,11 +154,24 @@ function Profile() {
               id="username"
               name="username"
               value={username}
-              bgColor="white"
+              bgColor="primary"
               fgColor="white"
               enabled={editing}
               onChange={(e) => setUsername(e.currentTarget.value)}
             />
+            <Select
+              text="COURSE"
+              id="course"
+              bgColor="primary"
+              fgColor="white"
+              value={course}
+              options={courses.map((course) => ({
+                key: course.id,
+                name: course.name,
+              }))}
+              enabled={editing}
+              onChange={(e) => setCourse(e.currentTarget.value)}
+            />
 
             <button
               className="inline-block h-auto pl-6 pb-5 text-quinary underline"
diff --git a/layout/SignUp/SignUp.tsx b/layout/SignUp/SignUp.tsx
index 93a5391c..52171290 100644
--- a/layout/SignUp/SignUp.tsx
+++ b/layout/SignUp/SignUp.tsx
@@ -9,13 +9,13 @@ import { SignUpForm } from "./components";
 import Title from "@layout/moonstone/authentication/Title";
 import Text from "@layout/moonstone/authentication/Text";
 
-function Signup() {
+function Signup({ courses }) {
   return (
     <div className="min-h-screen overflow-hidden bg-secondary">
       <Return componentStyle="sm:ml-14 mt-10 sm:mt-20 mb-6" />
       <div className="flex flex-col items-center justify-center sm:mt-16">
         <Title text="Sign up" />
-        <SignUpForm />
+        <SignUpForm courses={courses} />
         <Text text="Already have an account?" link="Login here" href="/login" />
         <div className="absolute bottom-0 right-60 hidden lg:block">
           <Motion.div
diff --git a/layout/SignUp/components/SignUpForm/index.tsx b/layout/SignUp/components/SignUpForm/index.tsx
index 595a1523..39a042d2 100644
--- a/layout/SignUp/components/SignUpForm/index.tsx
+++ b/layout/SignUp/components/SignUpForm/index.tsx
@@ -5,16 +5,23 @@ import { useAuth } from "@context/Auth";
 import Button from "@components/Button";
 import Form from "@components/Form";
 import Input from "@components/Input";
+import Select from "@components/Select";
 import PasswordInput from "@components/PasswordInput";
 
 import BarebonesQRScanner from "@components/QRScanner/BarebonesQRScanner";
 
-export default function SignUpForm() {
+interface Course {
+  id: any;
+  name: string;
+}
+
+export default function SignUpForm({ courses }) {
   const { sign_up, isLoading, errors } = useAuth();
 
   const [name, updateName] = useState("");
   const [email, updateEmail] = useState("");
   const [nickname, updateNickname] = useState("");
+  const [course, updateCourse] = useState("");
   const [password, updatePassword] = useState("");
   const [password_confirmation, updatePasswordConfirmation] = useState("");
   const [uuid, setUUID] = useState();
@@ -60,6 +67,7 @@ export default function SignUpForm() {
         password_confirmation,
         nickname,
         uuid,
+        course,
       });
     }
   };
@@ -93,6 +101,18 @@ export default function SignUpForm() {
           bgColor="primary"
           onChange={(e) => updateNickname(e.currentTarget.value)}
         />
+        <Select
+          text="COURSE"
+          id="course"
+          fgColor="white"
+          bgColor="primary"
+          defaultValue={0}
+          options={courses.map((course) => ({
+            key: course.id,
+            name: course.name,
+          }))}
+          onChange={(e) => updateCourse(e.currentTarget.value)}
+        />
         <PasswordInput
           text="PASSWORD"
           id="password"
diff --git a/lib/api.js b/lib/api.js
index 87e10427..000d9102 100644
--- a/lib/api.js
+++ b/lib/api.js
@@ -17,6 +17,7 @@ export async function sign_up({
   name,
   nickname,
   uuid,
+  course,
 }) {
   const response = await API.post("/api/auth/sign_up", {
     user: {
@@ -27,6 +28,7 @@ export async function sign_up({
         id: uuid,
         nickname: nickname,
         name: name,
+        course_id: course,
       },
     },
   });
@@ -34,6 +36,17 @@ export async function sign_up({
   return response.data;
 }
 
+/*
+  The courses returned by this API call are already ordered in the way 
+  they should be displayed on all course listings, and the first entry 
+  in the array represents the default value for a course.
+*/
+export async function getCourses() {
+  const response = await API.get("/api/attendee/courses");
+
+  return response.data;
+}
+
 export async function getLeaderboard(date) {
   const response = await API.get(`/api/leaderboard/${date}`);
 
diff --git a/pages/attendee/profile.tsx b/pages/attendee/profile.tsx
index 3c5ef3bf..f3d7931b 100644
--- a/pages/attendee/profile.tsx
+++ b/pages/attendee/profile.tsx
@@ -1 +1,18 @@
-export { default } from "@layout/Attendee/Profile";
+import Profile from "@layout/Attendee/Profile";
+
+import { getCourses } from "@lib/api";
+
+export async function getServerSideProps(context) {
+  context.res.setHeader(
+    "Cache-Control",
+    "public, s-maxage=3600, stale-while-revalidate=3600"
+  );
+
+  const courses = await getCourses().then((response) =>
+    response.data.concat({ id: "", name: "None" })
+  );
+
+  return { props: { courses: courses } };
+}
+
+export default Profile;
diff --git a/pages/register/[uuid].js b/pages/register/[uuid].js
index 265df8b3..c4021b34 100644
--- a/pages/register/[uuid].js
+++ b/pages/register/[uuid].js
@@ -1,20 +1,36 @@
-import { useState } from "react";
+import { useState, useEffect } from "react";
 import { useRouter } from "next/router";
 import { motion as Motion } from "framer-motion";
 
 import { withoutAuth, useAuth } from "@context/Auth";
 
+import { getCourses } from "@lib/api";
+
 import Button from "@components/Button";
 import Card from "@components/Card";
 import Return from "@components/Return";
 import Form from "@components/Form";
 import Input from "@components/Input";
+import Select from "@components/Select";
 import PasswordInput from "@components/PasswordInput";
 
 import Title from "@layout/moonstone/authentication/Title";
 import Text from "@layout/moonstone/authentication/Text";
 
-function Register() {
+export async function getServerSideProps(context) {
+  context.res.setHeader(
+    "Cache-Control",
+    "public, s-maxage=3600, stale-while-revalidate=3600"
+  );
+
+  const courses = await getCourses().then((response) =>
+    response.data.concat({ id: "", name: "None" })
+  );
+
+  return { props: { courses: courses } };
+}
+
+function Register({ courses }) {
   const { sign_up, errors, isLoading } = useAuth();
   const router = useRouter();
   const { uuid } = router.query;
@@ -22,6 +38,7 @@ function Register() {
   const [name, updateName] = useState("");
   const [email, updateEmail] = useState("");
   const [nickname, updateNickname] = useState("");
+  const [course, updateCourse] = useState("0");
   const [password, updatePassword] = useState("");
   const [password_confirmation, updatePasswordConfirmation] = useState("");
 
@@ -34,6 +51,7 @@ function Register() {
       password_confirmation,
       nickname,
       uuid,
+      course,
     });
   };
 
@@ -69,6 +87,18 @@ function Register() {
             bgColor="primary"
             onChange={(e) => updateNickname(e.currentTarget.value)}
           />
+          <Select
+            text="COURSE"
+            id="course"
+            fgColor="white"
+            bgColor="primary"
+            defaultValue={0}
+            options={courses.map((course) => ({
+              key: course.id,
+              name: course.name,
+            }))}
+            onChange={(e) => updateCourse(e.currentTarget.value)}
+          />
           <PasswordInput
             text="PASSWORD"
             id="confirm"
diff --git a/pages/signup.tsx b/pages/signup.tsx
index da66945a..69c40005 100644
--- a/pages/signup.tsx
+++ b/pages/signup.tsx
@@ -1 +1,18 @@
-export { default } from "@layout/SignUp";
+import { getCourses } from "@lib/api";
+
+import SignUp from "@layout/SignUp";
+
+export async function getServerSideProps(context) {
+  context.res.setHeader(
+    "Cache-Control",
+    "public, s-maxage=3600, stale-while-revalidate=3600"
+  );
+
+  const courses = await getCourses().then((response) =>
+    response.data.concat({ id: "", name: "None" })
+  );
+
+  return { props: { courses: courses } };
+}
+
+export default SignUp;

From 34535d8239901fc1fa07fb49999bef22f62445f4 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Jo=C3=A3o=20Lobo?=
 <30907944+joaodiaslobo@users.noreply.github.com>
Date: Thu, 30 Nov 2023 00:23:37 +0000
Subject: [PATCH 08/15] feat: remove referral code section from profile (#586)

---
 layout/Attendee/Profile/Profile.tsx | 8 --------
 1 file changed, 8 deletions(-)

diff --git a/layout/Attendee/Profile/Profile.tsx b/layout/Attendee/Profile/Profile.tsx
index 645baf40..ff26cc7e 100644
--- a/layout/Attendee/Profile/Profile.tsx
+++ b/layout/Attendee/Profile/Profile.tsx
@@ -249,14 +249,6 @@ function Profile({ courses }) {
               </p>
             )}
           </div>
-
-          <div className="my-10 text-white">
-            <Heading text="Redeem referral code" />
-            <p className="font-iregular">Redeem a badge using a unique code</p>
-
-            <CodeInput />
-          </div>
-
           <div className="mt-10 text-white">
             <Heading text="Upload CV" />
             <CVInput cv={user?.cv} onSubmit={submitCV}></CVInput>

From e176f4f27fd06be14535d779013ef964bbaae84e Mon Sep 17 00:00:00 2001
From: Rui Oliveira <70754369+ruioliveira02@users.noreply.github.com>
Date: Thu, 30 Nov 2023 00:28:29 +0000
Subject: [PATCH 09/15] fix: security vulnerabilities (#584)

---
 package-lock.json | 362 +++++++++++++++++++++++++++-------------------
 package.json      |   4 +-
 2 files changed, 216 insertions(+), 150 deletions(-)

diff --git a/package-lock.json b/package-lock.json
index 7db802ec..1175f29a 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -15,7 +15,7 @@
         "@headlessui/react": "^1.4.2",
         "@heroicons/react": "^1.0.5",
         "@netlify/plugin-nextjs": "^4.40.1",
-        "axios": "^0.25.0",
+        "axios": "^1.6.2",
         "framer-motion": "^7.5.3",
         "jsqr": "^1.4.0",
         "lottie-web": "^5.8.1",
@@ -26,7 +26,7 @@
         "react-dom": "^18.2.0",
         "react-map-gl": "^6.1.17",
         "react-p5": "^1.3.21",
-        "sharp": "^0.30.0",
+        "sharp": "^0.32.6",
         "typewriter-effect": "^2.21.0"
       },
       "devDependencies": {
@@ -1880,6 +1880,11 @@
         "has-symbols": "^1.0.3"
       }
     },
+    "node_modules/asynckit": {
+      "version": "0.4.0",
+      "resolved": "https://registry.npmjs.org/asynckit/-/asynckit-0.4.0.tgz",
+      "integrity": "sha512-Oei9OH4tRh0YqU3GxhX79dM/mwVgvbZJaSNaRk+bshkj0S5cfHcgYakreBjrHwatXKbz+IoIdYLxrKim2MjW0Q=="
+    },
     "node_modules/autoprefixer": {
       "version": "10.4.13",
       "resolved": "https://registry.npmjs.org/autoprefixer/-/autoprefixer-10.4.13.tgz",
@@ -1935,11 +1940,13 @@
       }
     },
     "node_modules/axios": {
-      "version": "0.25.0",
-      "resolved": "https://registry.npmjs.org/axios/-/axios-0.25.0.tgz",
-      "integrity": "sha512-cD8FOb0tRH3uuEe6+evtAbgJtfxr7ly3fQjYcMcuPlgkwVS9xboaVIpcDV+cYQe+yGykgwZCs1pzjntcGa6l5g==",
+      "version": "1.6.2",
+      "resolved": "https://registry.npmjs.org/axios/-/axios-1.6.2.tgz",
+      "integrity": "sha512-7i24Ri4pmDRfJTR7LDBhsOTtcm+9kjX5WiY1X3wIisx6G9So3pfMkEiU7emUBe46oceVImccTEM3k6C5dbVW8A==",
       "dependencies": {
-        "follow-redirects": "^1.14.7"
+        "follow-redirects": "^1.15.0",
+        "form-data": "^4.0.0",
+        "proxy-from-env": "^1.1.0"
       }
     },
     "node_modules/axobject-query": {
@@ -2439,6 +2446,17 @@
       "integrity": "sha512-3tlv/dIP7FWvj3BsbHrGLJ6l/oKh1O3TcgBqMn+yyCagOxc23fyzDS6HypQbgxWbkpDnf52p1LuR4eWDQ/K9WQ==",
       "dev": true
     },
+    "node_modules/combined-stream": {
+      "version": "1.0.8",
+      "resolved": "https://registry.npmjs.org/combined-stream/-/combined-stream-1.0.8.tgz",
+      "integrity": "sha512-FQN4MRfuJeHf7cBbBMJFXhKSDq+2kAArBlmRBvcvFE5BB1HZKXtSFASDhdlz9zOYwxh8lDdnvmMOe/+5cdoEdg==",
+      "dependencies": {
+        "delayed-stream": "~1.0.0"
+      },
+      "engines": {
+        "node": ">= 0.8"
+      }
+    },
     "node_modules/commander": {
       "version": "9.5.0",
       "resolved": "https://registry.npmjs.org/commander/-/commander-9.5.0.tgz",
@@ -2684,6 +2702,14 @@
         "url": "https://github.com/sponsors/sindresorhus"
       }
     },
+    "node_modules/delayed-stream": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/delayed-stream/-/delayed-stream-1.0.0.tgz",
+      "integrity": "sha512-ZySD7Nf91aLB0RxL4KGrKHBXl7Eds1DAmEdcoVawXnLD7SDhpNgtuII2aAkg7a7QS41jxPSZ17p4VdGnMHk3MQ==",
+      "engines": {
+        "node": ">=0.4.0"
+      }
+    },
     "node_modules/denque": {
       "version": "2.1.0",
       "resolved": "https://registry.npmjs.org/denque/-/denque-2.1.0.tgz",
@@ -3269,9 +3295,9 @@
       }
     },
     "node_modules/eslint-plugin-jsx-a11y/node_modules/semver": {
-      "version": "6.3.0",
-      "resolved": "https://registry.npmjs.org/semver/-/semver-6.3.0.tgz",
-      "integrity": "sha512-b39TBaTSfV6yBrapU89p5fKekE2m/NwnDocOVruQFS1/veMgdzuPcnOM34M6CwxW8jH/lxEa5rBoDeUwu5HHTw==",
+      "version": "6.3.1",
+      "resolved": "https://registry.npmjs.org/semver/-/semver-6.3.1.tgz",
+      "integrity": "sha512-BR7VvDCVHO+q2xBEWskxS6DJE1qRnb7DxzUrogb71CWoSficBxYsiAGd+Kl0mmq/MprG9yArRkyrQxTO6XjMzA==",
       "dev": true,
       "bin": {
         "semver": "bin/semver.js"
@@ -3768,6 +3794,19 @@
         "node": ">=0.10.0"
       }
     },
+    "node_modules/form-data": {
+      "version": "4.0.0",
+      "resolved": "https://registry.npmjs.org/form-data/-/form-data-4.0.0.tgz",
+      "integrity": "sha512-ETEklSGi5t0QMZuiXoA/Q6vcnxcLQP5vdugSpuAyi6SVGi2clPPp+xgEhuMaHC+zGgn31Kd235W35f7Hykkaww==",
+      "dependencies": {
+        "asynckit": "^0.4.0",
+        "combined-stream": "^1.0.8",
+        "mime-types": "^2.1.12"
+      },
+      "engines": {
+        "node": ">= 6"
+      }
+    },
     "node_modules/fraction.js": {
       "version": "4.2.0",
       "resolved": "https://registry.npmjs.org/fraction.js/-/fraction.js-4.2.0.tgz",
@@ -4636,58 +4675,11 @@
       "resolved": "https://registry.npmjs.org/destr/-/destr-2.0.2.tgz",
       "integrity": "sha512-65AlobnZMiCET00KaFFjUefxDX0khFA/E4myqZ7a6Sq1yZtR8+FVIvilVX66vF2uobSumxooYZChiRPCKNqhmg=="
     },
-    "node_modules/ipx/node_modules/node-addon-api": {
-      "version": "6.1.0",
-      "resolved": "https://registry.npmjs.org/node-addon-api/-/node-addon-api-6.1.0.tgz",
-      "integrity": "sha512-+eawOlIgy680F0kBzPUNFhMZGtJ1YmqM6l4+Crf4IkImjYrO/mqPwRMh352g23uIaQKFItcQ64I7KMaJxHgAVA=="
-    },
     "node_modules/ipx/node_modules/pathe": {
       "version": "1.1.1",
       "resolved": "https://registry.npmjs.org/pathe/-/pathe-1.1.1.tgz",
       "integrity": "sha512-d+RQGp0MAYTIaDBIMmOfMwz3E+LOZnxx1HZd5R18mmCZY0QBlK0LDZfPc8FW8Ed2DlvsuE6PRjroDY+wg4+j/Q=="
     },
-    "node_modules/ipx/node_modules/sharp": {
-      "version": "0.32.6",
-      "resolved": "https://registry.npmjs.org/sharp/-/sharp-0.32.6.tgz",
-      "integrity": "sha512-KyLTWwgcR9Oe4d9HwCwNM2l7+J0dUQwn/yf7S0EnTtb0eVS4RxO0eUSvxPtzT4F3SY+C4K6fqdv/DO27sJ/v/w==",
-      "hasInstallScript": true,
-      "dependencies": {
-        "color": "^4.2.3",
-        "detect-libc": "^2.0.2",
-        "node-addon-api": "^6.1.0",
-        "prebuild-install": "^7.1.1",
-        "semver": "^7.5.4",
-        "simple-get": "^4.0.1",
-        "tar-fs": "^3.0.4",
-        "tunnel-agent": "^0.6.0"
-      },
-      "engines": {
-        "node": ">=14.15.0"
-      },
-      "funding": {
-        "url": "https://opencollective.com/libvips"
-      }
-    },
-    "node_modules/ipx/node_modules/tar-fs": {
-      "version": "3.0.4",
-      "resolved": "https://registry.npmjs.org/tar-fs/-/tar-fs-3.0.4.tgz",
-      "integrity": "sha512-5AFQU8b9qLfZCX9zp2duONhPmZv0hGYiBPJsyUdqMjzq/mqVpy/rEUSeHk1+YitmxugaptgBh5oDGU3VsAJq4w==",
-      "dependencies": {
-        "mkdirp-classic": "^0.5.2",
-        "pump": "^3.0.0",
-        "tar-stream": "^3.1.5"
-      }
-    },
-    "node_modules/ipx/node_modules/tar-stream": {
-      "version": "3.1.6",
-      "resolved": "https://registry.npmjs.org/tar-stream/-/tar-stream-3.1.6.tgz",
-      "integrity": "sha512-B/UyjYwPpMBv+PaFSWAmtYjwdrlEaZQEhMIBFNC5oEG8lpiW8XjcSdmEaClj28ArfKScKHs2nshz3k2le6crsg==",
-      "dependencies": {
-        "b4a": "^1.6.4",
-        "fast-fifo": "^1.2.0",
-        "streamx": "^2.15.0"
-      }
-    },
     "node_modules/iron-webcrypto": {
       "version": "0.10.1",
       "resolved": "https://registry.npmjs.org/iron-webcrypto/-/iron-webcrypto-0.10.1.tgz",
@@ -5856,6 +5848,25 @@
         "node": ">=10.0.0"
       }
     },
+    "node_modules/mime-db": {
+      "version": "1.52.0",
+      "resolved": "https://registry.npmjs.org/mime-db/-/mime-db-1.52.0.tgz",
+      "integrity": "sha512-sPU4uV7dYlvtWJxwwxHD0PuihVNiE7TyAbQ5SWxDCB9mUYvOgroQOwYQQOKPJ8CIbE+1ETVlOoK1UC2nU3gYvg==",
+      "engines": {
+        "node": ">= 0.6"
+      }
+    },
+    "node_modules/mime-types": {
+      "version": "2.1.35",
+      "resolved": "https://registry.npmjs.org/mime-types/-/mime-types-2.1.35.tgz",
+      "integrity": "sha512-ZDY+bPm5zTTF+YpCrAU9nK0UgICYPT0QtT1NZWFv4s++TNkcgVaT0g6+4R2uI4MjQjzysHB1zxuWL50hzaeXiw==",
+      "dependencies": {
+        "mime-db": "1.52.0"
+      },
+      "engines": {
+        "node": ">= 0.6"
+      }
+    },
     "node_modules/mimic-fn": {
       "version": "2.1.0",
       "resolved": "https://registry.npmjs.org/mimic-fn/-/mimic-fn-2.1.0.tgz",
@@ -6086,9 +6097,9 @@
       }
     },
     "node_modules/node-addon-api": {
-      "version": "5.1.0",
-      "resolved": "https://registry.npmjs.org/node-addon-api/-/node-addon-api-5.1.0.tgz",
-      "integrity": "sha512-eh0GgfEkpnoWDq+VY8OyvYhFEzBk6jIYbRKdIlyTiAXIVJ8PyBaKb0rp7oDtoddbdoHWhq8wwr+XZ81F1rpNdA=="
+      "version": "6.1.0",
+      "resolved": "https://registry.npmjs.org/node-addon-api/-/node-addon-api-6.1.0.tgz",
+      "integrity": "sha512-+eawOlIgy680F0kBzPUNFhMZGtJ1YmqM6l4+Crf4IkImjYrO/mqPwRMh352g23uIaQKFItcQ64I7KMaJxHgAVA=="
     },
     "node_modules/node-fetch": {
       "version": "2.7.0",
@@ -6208,9 +6219,9 @@
       }
     },
     "node_modules/normalize-package-data/node_modules/semver": {
-      "version": "5.7.1",
-      "resolved": "https://registry.npmjs.org/semver/-/semver-5.7.1.tgz",
-      "integrity": "sha512-sauaDf/PZdVgrLTNYHRtpXa1iRiKcaebiKQ1BJdpQlWH2lCvexQdX55snPFyK7QzpudqbCI0qXFfOasHdyNDGQ==",
+      "version": "5.7.2",
+      "resolved": "https://registry.npmjs.org/semver/-/semver-5.7.2.tgz",
+      "integrity": "sha512-cBznnQ9KjJqU67B52RMC65CMarK2600WFnbkcaiwWq3xy/5haFJlshgnpjovMVJ+Hff49d8GEn0b87C5pDQ10g==",
       "dev": true,
       "bin": {
         "semver": "bin/semver"
@@ -6355,9 +6366,9 @@
       }
     },
     "node_modules/npm-run-all/node_modules/semver": {
-      "version": "5.7.1",
-      "resolved": "https://registry.npmjs.org/semver/-/semver-5.7.1.tgz",
-      "integrity": "sha512-sauaDf/PZdVgrLTNYHRtpXa1iRiKcaebiKQ1BJdpQlWH2lCvexQdX55snPFyK7QzpudqbCI0qXFfOasHdyNDGQ==",
+      "version": "5.7.2",
+      "resolved": "https://registry.npmjs.org/semver/-/semver-5.7.2.tgz",
+      "integrity": "sha512-cBznnQ9KjJqU67B52RMC65CMarK2600WFnbkcaiwWq3xy/5haFJlshgnpjovMVJ+Hff49d8GEn0b87C5pDQ10g==",
       "dev": true,
       "bin": {
         "semver": "bin/semver"
@@ -7303,6 +7314,11 @@
       "resolved": "https://registry.npmjs.org/protocol-buffers-schema/-/protocol-buffers-schema-3.6.0.tgz",
       "integrity": "sha512-TdDRD+/QNdrCGCE7v8340QyuXd4kIWIgapsE2+n/SaGiSSbomYl4TjHlvIoCWRpE7wFt02EpB35VVA2ImcBVqw=="
     },
+    "node_modules/proxy-from-env": {
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/proxy-from-env/-/proxy-from-env-1.1.0.tgz",
+      "integrity": "sha512-D+zkORCbA9f1tdWRK0RaCR3GPv50cMxcrz4X8k5LTSUD1Dkw47mKJEZQNunItRTkWwgtaUSo1RVFRIG9ZXiFYg=="
+    },
     "node_modules/pump": {
       "version": "3.0.0",
       "resolved": "https://registry.npmjs.org/pump/-/pump-3.0.0.tgz",
@@ -7939,27 +7955,47 @@
       }
     },
     "node_modules/sharp": {
-      "version": "0.30.7",
-      "resolved": "https://registry.npmjs.org/sharp/-/sharp-0.30.7.tgz",
-      "integrity": "sha512-G+MY2YW33jgflKPTXXptVO28HvNOo9G3j0MybYAHeEmby+QuD2U98dT6ueht9cv/XDqZspSpIhoSW+BAKJ7Hig==",
+      "version": "0.32.6",
+      "resolved": "https://registry.npmjs.org/sharp/-/sharp-0.32.6.tgz",
+      "integrity": "sha512-KyLTWwgcR9Oe4d9HwCwNM2l7+J0dUQwn/yf7S0EnTtb0eVS4RxO0eUSvxPtzT4F3SY+C4K6fqdv/DO27sJ/v/w==",
       "hasInstallScript": true,
       "dependencies": {
         "color": "^4.2.3",
-        "detect-libc": "^2.0.1",
-        "node-addon-api": "^5.0.0",
+        "detect-libc": "^2.0.2",
+        "node-addon-api": "^6.1.0",
         "prebuild-install": "^7.1.1",
-        "semver": "^7.3.7",
+        "semver": "^7.5.4",
         "simple-get": "^4.0.1",
-        "tar-fs": "^2.1.1",
+        "tar-fs": "^3.0.4",
         "tunnel-agent": "^0.6.0"
       },
       "engines": {
-        "node": ">=12.13.0"
+        "node": ">=14.15.0"
       },
       "funding": {
         "url": "https://opencollective.com/libvips"
       }
     },
+    "node_modules/sharp/node_modules/tar-fs": {
+      "version": "3.0.4",
+      "resolved": "https://registry.npmjs.org/tar-fs/-/tar-fs-3.0.4.tgz",
+      "integrity": "sha512-5AFQU8b9qLfZCX9zp2duONhPmZv0hGYiBPJsyUdqMjzq/mqVpy/rEUSeHk1+YitmxugaptgBh5oDGU3VsAJq4w==",
+      "dependencies": {
+        "mkdirp-classic": "^0.5.2",
+        "pump": "^3.0.0",
+        "tar-stream": "^3.1.5"
+      }
+    },
+    "node_modules/sharp/node_modules/tar-stream": {
+      "version": "3.1.6",
+      "resolved": "https://registry.npmjs.org/tar-stream/-/tar-stream-3.1.6.tgz",
+      "integrity": "sha512-B/UyjYwPpMBv+PaFSWAmtYjwdrlEaZQEhMIBFNC5oEG8lpiW8XjcSdmEaClj28ArfKScKHs2nshz3k2le6crsg==",
+      "dependencies": {
+        "b4a": "^1.6.4",
+        "fast-fifo": "^1.2.0",
+        "streamx": "^2.15.0"
+      }
+    },
     "node_modules/shebang-command": {
       "version": "2.0.0",
       "resolved": "https://registry.npmjs.org/shebang-command/-/shebang-command-2.0.0.tgz",
@@ -8189,9 +8225,9 @@
       }
     },
     "node_modules/streamx": {
-      "version": "2.15.2",
-      "resolved": "https://registry.npmjs.org/streamx/-/streamx-2.15.2.tgz",
-      "integrity": "sha512-b62pAV/aeMjUoRN2C/9F0n+G8AfcJjNC0zw/ZmOHeFsIe4m4GzjVW9m6VHXVjk536NbdU9JRwKMJRfkc+zUFTg==",
+      "version": "2.15.5",
+      "resolved": "https://registry.npmjs.org/streamx/-/streamx-2.15.5.tgz",
+      "integrity": "sha512-9thPGMkKC2GctCzyCUjME3yR03x2xNo0GPKGkRw2UMYN+gqWa9uqpyNWhmsNCutU5zHmkUum0LsCRQTXUgUCAg==",
       "dependencies": {
         "fast-fifo": "^1.1.0",
         "queue-tick": "^1.0.1"
@@ -9183,9 +9219,9 @@
       }
     },
     "node_modules/word-wrap": {
-      "version": "1.2.3",
-      "resolved": "https://registry.npmjs.org/word-wrap/-/word-wrap-1.2.3.tgz",
-      "integrity": "sha512-Hz/mrNwitNRh/HUAtM/VT/5VH+ygD6DV7mYKZAtHOrbs8U7lvPS6xf7EJKMF0uW1KJCl0H701g3ZGus+muE5vQ==",
+      "version": "1.2.5",
+      "resolved": "https://registry.npmjs.org/word-wrap/-/word-wrap-1.2.5.tgz",
+      "integrity": "sha512-BN22B5eaMMI9UMtjrGd5g5eCYPpCPDUy0FJXbYsaT5zYxjFOckS53SQDE3pWkVoWpHXVb3BrYcEN4Twa55B5cA==",
       "dev": true,
       "engines": {
         "node": ">=0.10.0"
@@ -10548,6 +10584,11 @@
         "has-symbols": "^1.0.3"
       }
     },
+    "asynckit": {
+      "version": "0.4.0",
+      "resolved": "https://registry.npmjs.org/asynckit/-/asynckit-0.4.0.tgz",
+      "integrity": "sha512-Oei9OH4tRh0YqU3GxhX79dM/mwVgvbZJaSNaRk+bshkj0S5cfHcgYakreBjrHwatXKbz+IoIdYLxrKim2MjW0Q=="
+    },
     "autoprefixer": {
       "version": "10.4.13",
       "resolved": "https://registry.npmjs.org/autoprefixer/-/autoprefixer-10.4.13.tgz",
@@ -10575,11 +10616,13 @@
       "dev": true
     },
     "axios": {
-      "version": "0.25.0",
-      "resolved": "https://registry.npmjs.org/axios/-/axios-0.25.0.tgz",
-      "integrity": "sha512-cD8FOb0tRH3uuEe6+evtAbgJtfxr7ly3fQjYcMcuPlgkwVS9xboaVIpcDV+cYQe+yGykgwZCs1pzjntcGa6l5g==",
+      "version": "1.6.2",
+      "resolved": "https://registry.npmjs.org/axios/-/axios-1.6.2.tgz",
+      "integrity": "sha512-7i24Ri4pmDRfJTR7LDBhsOTtcm+9kjX5WiY1X3wIisx6G9So3pfMkEiU7emUBe46oceVImccTEM3k6C5dbVW8A==",
       "requires": {
-        "follow-redirects": "^1.14.7"
+        "follow-redirects": "^1.15.0",
+        "form-data": "^4.0.0",
+        "proxy-from-env": "^1.1.0"
       }
     },
     "axobject-query": {
@@ -10940,6 +10983,14 @@
       "integrity": "sha512-3tlv/dIP7FWvj3BsbHrGLJ6l/oKh1O3TcgBqMn+yyCagOxc23fyzDS6HypQbgxWbkpDnf52p1LuR4eWDQ/K9WQ==",
       "dev": true
     },
+    "combined-stream": {
+      "version": "1.0.8",
+      "resolved": "https://registry.npmjs.org/combined-stream/-/combined-stream-1.0.8.tgz",
+      "integrity": "sha512-FQN4MRfuJeHf7cBbBMJFXhKSDq+2kAArBlmRBvcvFE5BB1HZKXtSFASDhdlz9zOYwxh8lDdnvmMOe/+5cdoEdg==",
+      "requires": {
+        "delayed-stream": "~1.0.0"
+      }
+    },
     "commander": {
       "version": "9.5.0",
       "resolved": "https://registry.npmjs.org/commander/-/commander-9.5.0.tgz",
@@ -11126,6 +11177,11 @@
         "slash": "^3.0.0"
       }
     },
+    "delayed-stream": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/delayed-stream/-/delayed-stream-1.0.0.tgz",
+      "integrity": "sha512-ZySD7Nf91aLB0RxL4KGrKHBXl7Eds1DAmEdcoVawXnLD7SDhpNgtuII2aAkg7a7QS41jxPSZ17p4VdGnMHk3MQ=="
+    },
     "denque": {
       "version": "2.1.0",
       "resolved": "https://registry.npmjs.org/denque/-/denque-2.1.0.tgz",
@@ -11601,9 +11657,9 @@
       },
       "dependencies": {
         "semver": {
-          "version": "6.3.0",
-          "resolved": "https://registry.npmjs.org/semver/-/semver-6.3.0.tgz",
-          "integrity": "sha512-b39TBaTSfV6yBrapU89p5fKekE2m/NwnDocOVruQFS1/veMgdzuPcnOM34M6CwxW8jH/lxEa5rBoDeUwu5HHTw==",
+          "version": "6.3.1",
+          "resolved": "https://registry.npmjs.org/semver/-/semver-6.3.1.tgz",
+          "integrity": "sha512-BR7VvDCVHO+q2xBEWskxS6DJE1qRnb7DxzUrogb71CWoSficBxYsiAGd+Kl0mmq/MprG9yArRkyrQxTO6XjMzA==",
           "dev": true
         }
       }
@@ -11971,6 +12027,16 @@
         "for-in": "^1.0.1"
       }
     },
+    "form-data": {
+      "version": "4.0.0",
+      "resolved": "https://registry.npmjs.org/form-data/-/form-data-4.0.0.tgz",
+      "integrity": "sha512-ETEklSGi5t0QMZuiXoA/Q6vcnxcLQP5vdugSpuAyi6SVGi2clPPp+xgEhuMaHC+zGgn31Kd235W35f7Hykkaww==",
+      "requires": {
+        "asynckit": "^0.4.0",
+        "combined-stream": "^1.0.8",
+        "mime-types": "^2.1.12"
+      }
+    },
     "fraction.js": {
       "version": "4.2.0",
       "resolved": "https://registry.npmjs.org/fraction.js/-/fraction.js-4.2.0.tgz",
@@ -12599,50 +12665,10 @@
           "resolved": "https://registry.npmjs.org/destr/-/destr-2.0.2.tgz",
           "integrity": "sha512-65AlobnZMiCET00KaFFjUefxDX0khFA/E4myqZ7a6Sq1yZtR8+FVIvilVX66vF2uobSumxooYZChiRPCKNqhmg=="
         },
-        "node-addon-api": {
-          "version": "6.1.0",
-          "resolved": "https://registry.npmjs.org/node-addon-api/-/node-addon-api-6.1.0.tgz",
-          "integrity": "sha512-+eawOlIgy680F0kBzPUNFhMZGtJ1YmqM6l4+Crf4IkImjYrO/mqPwRMh352g23uIaQKFItcQ64I7KMaJxHgAVA=="
-        },
         "pathe": {
           "version": "1.1.1",
           "resolved": "https://registry.npmjs.org/pathe/-/pathe-1.1.1.tgz",
           "integrity": "sha512-d+RQGp0MAYTIaDBIMmOfMwz3E+LOZnxx1HZd5R18mmCZY0QBlK0LDZfPc8FW8Ed2DlvsuE6PRjroDY+wg4+j/Q=="
-        },
-        "sharp": {
-          "version": "0.32.6",
-          "resolved": "https://registry.npmjs.org/sharp/-/sharp-0.32.6.tgz",
-          "integrity": "sha512-KyLTWwgcR9Oe4d9HwCwNM2l7+J0dUQwn/yf7S0EnTtb0eVS4RxO0eUSvxPtzT4F3SY+C4K6fqdv/DO27sJ/v/w==",
-          "requires": {
-            "color": "^4.2.3",
-            "detect-libc": "^2.0.2",
-            "node-addon-api": "^6.1.0",
-            "prebuild-install": "^7.1.1",
-            "semver": "^7.5.4",
-            "simple-get": "^4.0.1",
-            "tar-fs": "^3.0.4",
-            "tunnel-agent": "^0.6.0"
-          }
-        },
-        "tar-fs": {
-          "version": "3.0.4",
-          "resolved": "https://registry.npmjs.org/tar-fs/-/tar-fs-3.0.4.tgz",
-          "integrity": "sha512-5AFQU8b9qLfZCX9zp2duONhPmZv0hGYiBPJsyUdqMjzq/mqVpy/rEUSeHk1+YitmxugaptgBh5oDGU3VsAJq4w==",
-          "requires": {
-            "mkdirp-classic": "^0.5.2",
-            "pump": "^3.0.0",
-            "tar-stream": "^3.1.5"
-          }
-        },
-        "tar-stream": {
-          "version": "3.1.6",
-          "resolved": "https://registry.npmjs.org/tar-stream/-/tar-stream-3.1.6.tgz",
-          "integrity": "sha512-B/UyjYwPpMBv+PaFSWAmtYjwdrlEaZQEhMIBFNC5oEG8lpiW8XjcSdmEaClj28ArfKScKHs2nshz3k2le6crsg==",
-          "requires": {
-            "b4a": "^1.6.4",
-            "fast-fifo": "^1.2.0",
-            "streamx": "^2.15.0"
-          }
         }
       }
     },
@@ -13497,6 +13523,19 @@
       "resolved": "https://registry.npmjs.org/mime/-/mime-3.0.0.tgz",
       "integrity": "sha512-jSCU7/VB1loIWBZe14aEYHU/+1UMEHoaO7qxCOVJOw9GgH72VAWppxNcjU+x9a2k3GSIBXNKxXQFqRvvZ7vr3A=="
     },
+    "mime-db": {
+      "version": "1.52.0",
+      "resolved": "https://registry.npmjs.org/mime-db/-/mime-db-1.52.0.tgz",
+      "integrity": "sha512-sPU4uV7dYlvtWJxwwxHD0PuihVNiE7TyAbQ5SWxDCB9mUYvOgroQOwYQQOKPJ8CIbE+1ETVlOoK1UC2nU3gYvg=="
+    },
+    "mime-types": {
+      "version": "2.1.35",
+      "resolved": "https://registry.npmjs.org/mime-types/-/mime-types-2.1.35.tgz",
+      "integrity": "sha512-ZDY+bPm5zTTF+YpCrAU9nK0UgICYPT0QtT1NZWFv4s++TNkcgVaT0g6+4R2uI4MjQjzysHB1zxuWL50hzaeXiw==",
+      "requires": {
+        "mime-db": "1.52.0"
+      }
+    },
     "mimic-fn": {
       "version": "2.1.0",
       "resolved": "https://registry.npmjs.org/mimic-fn/-/mimic-fn-2.1.0.tgz",
@@ -13664,9 +13703,9 @@
       }
     },
     "node-addon-api": {
-      "version": "5.1.0",
-      "resolved": "https://registry.npmjs.org/node-addon-api/-/node-addon-api-5.1.0.tgz",
-      "integrity": "sha512-eh0GgfEkpnoWDq+VY8OyvYhFEzBk6jIYbRKdIlyTiAXIVJ8PyBaKb0rp7oDtoddbdoHWhq8wwr+XZ81F1rpNdA=="
+      "version": "6.1.0",
+      "resolved": "https://registry.npmjs.org/node-addon-api/-/node-addon-api-6.1.0.tgz",
+      "integrity": "sha512-+eawOlIgy680F0kBzPUNFhMZGtJ1YmqM6l4+Crf4IkImjYrO/mqPwRMh352g23uIaQKFItcQ64I7KMaJxHgAVA=="
     },
     "node-fetch": {
       "version": "2.7.0",
@@ -13752,9 +13791,9 @@
       },
       "dependencies": {
         "semver": {
-          "version": "5.7.1",
-          "resolved": "https://registry.npmjs.org/semver/-/semver-5.7.1.tgz",
-          "integrity": "sha512-sauaDf/PZdVgrLTNYHRtpXa1iRiKcaebiKQ1BJdpQlWH2lCvexQdX55snPFyK7QzpudqbCI0qXFfOasHdyNDGQ==",
+          "version": "5.7.2",
+          "resolved": "https://registry.npmjs.org/semver/-/semver-5.7.2.tgz",
+          "integrity": "sha512-cBznnQ9KjJqU67B52RMC65CMarK2600WFnbkcaiwWq3xy/5haFJlshgnpjovMVJ+Hff49d8GEn0b87C5pDQ10g==",
           "dev": true
         }
       }
@@ -13860,9 +13899,9 @@
           "dev": true
         },
         "semver": {
-          "version": "5.7.1",
-          "resolved": "https://registry.npmjs.org/semver/-/semver-5.7.1.tgz",
-          "integrity": "sha512-sauaDf/PZdVgrLTNYHRtpXa1iRiKcaebiKQ1BJdpQlWH2lCvexQdX55snPFyK7QzpudqbCI0qXFfOasHdyNDGQ==",
+          "version": "5.7.2",
+          "resolved": "https://registry.npmjs.org/semver/-/semver-5.7.2.tgz",
+          "integrity": "sha512-cBznnQ9KjJqU67B52RMC65CMarK2600WFnbkcaiwWq3xy/5haFJlshgnpjovMVJ+Hff49d8GEn0b87C5pDQ10g==",
           "dev": true
         },
         "shebang-command": {
@@ -14520,6 +14559,11 @@
       "resolved": "https://registry.npmjs.org/protocol-buffers-schema/-/protocol-buffers-schema-3.6.0.tgz",
       "integrity": "sha512-TdDRD+/QNdrCGCE7v8340QyuXd4kIWIgapsE2+n/SaGiSSbomYl4TjHlvIoCWRpE7wFt02EpB35VVA2ImcBVqw=="
     },
+    "proxy-from-env": {
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/proxy-from-env/-/proxy-from-env-1.1.0.tgz",
+      "integrity": "sha512-D+zkORCbA9f1tdWRK0RaCR3GPv50cMxcrz4X8k5LTSUD1Dkw47mKJEZQNunItRTkWwgtaUSo1RVFRIG9ZXiFYg=="
+    },
     "pump": {
       "version": "3.0.0",
       "resolved": "https://registry.npmjs.org/pump/-/pump-3.0.0.tgz",
@@ -14975,18 +15019,40 @@
       }
     },
     "sharp": {
-      "version": "0.30.7",
-      "resolved": "https://registry.npmjs.org/sharp/-/sharp-0.30.7.tgz",
-      "integrity": "sha512-G+MY2YW33jgflKPTXXptVO28HvNOo9G3j0MybYAHeEmby+QuD2U98dT6ueht9cv/XDqZspSpIhoSW+BAKJ7Hig==",
+      "version": "0.32.6",
+      "resolved": "https://registry.npmjs.org/sharp/-/sharp-0.32.6.tgz",
+      "integrity": "sha512-KyLTWwgcR9Oe4d9HwCwNM2l7+J0dUQwn/yf7S0EnTtb0eVS4RxO0eUSvxPtzT4F3SY+C4K6fqdv/DO27sJ/v/w==",
       "requires": {
         "color": "^4.2.3",
-        "detect-libc": "^2.0.1",
-        "node-addon-api": "^5.0.0",
+        "detect-libc": "^2.0.2",
+        "node-addon-api": "^6.1.0",
         "prebuild-install": "^7.1.1",
-        "semver": "^7.3.7",
+        "semver": "^7.5.4",
         "simple-get": "^4.0.1",
-        "tar-fs": "^2.1.1",
+        "tar-fs": "^3.0.4",
         "tunnel-agent": "^0.6.0"
+      },
+      "dependencies": {
+        "tar-fs": {
+          "version": "3.0.4",
+          "resolved": "https://registry.npmjs.org/tar-fs/-/tar-fs-3.0.4.tgz",
+          "integrity": "sha512-5AFQU8b9qLfZCX9zp2duONhPmZv0hGYiBPJsyUdqMjzq/mqVpy/rEUSeHk1+YitmxugaptgBh5oDGU3VsAJq4w==",
+          "requires": {
+            "mkdirp-classic": "^0.5.2",
+            "pump": "^3.0.0",
+            "tar-stream": "^3.1.5"
+          }
+        },
+        "tar-stream": {
+          "version": "3.1.6",
+          "resolved": "https://registry.npmjs.org/tar-stream/-/tar-stream-3.1.6.tgz",
+          "integrity": "sha512-B/UyjYwPpMBv+PaFSWAmtYjwdrlEaZQEhMIBFNC5oEG8lpiW8XjcSdmEaClj28ArfKScKHs2nshz3k2le6crsg==",
+          "requires": {
+            "b4a": "^1.6.4",
+            "fast-fifo": "^1.2.0",
+            "streamx": "^2.15.0"
+          }
+        }
       }
     },
     "shebang-command": {
@@ -15155,9 +15221,9 @@
       "integrity": "sha512-Mcc5wHehp9aXz1ax6bZUyY5afg9u2rv5cqQI3mRrYkGC8rW2hM02jWuwjtL++LS5qinSyhj2QfLyNsuc+VsExg=="
     },
     "streamx": {
-      "version": "2.15.2",
-      "resolved": "https://registry.npmjs.org/streamx/-/streamx-2.15.2.tgz",
-      "integrity": "sha512-b62pAV/aeMjUoRN2C/9F0n+G8AfcJjNC0zw/ZmOHeFsIe4m4GzjVW9m6VHXVjk536NbdU9JRwKMJRfkc+zUFTg==",
+      "version": "2.15.5",
+      "resolved": "https://registry.npmjs.org/streamx/-/streamx-2.15.5.tgz",
+      "integrity": "sha512-9thPGMkKC2GctCzyCUjME3yR03x2xNo0GPKGkRw2UMYN+gqWa9uqpyNWhmsNCutU5zHmkUum0LsCRQTXUgUCAg==",
       "requires": {
         "fast-fifo": "^1.1.0",
         "queue-tick": "^1.0.1"
@@ -15882,9 +15948,9 @@
       }
     },
     "word-wrap": {
-      "version": "1.2.3",
-      "resolved": "https://registry.npmjs.org/word-wrap/-/word-wrap-1.2.3.tgz",
-      "integrity": "sha512-Hz/mrNwitNRh/HUAtM/VT/5VH+ygD6DV7mYKZAtHOrbs8U7lvPS6xf7EJKMF0uW1KJCl0H701g3ZGus+muE5vQ==",
+      "version": "1.2.5",
+      "resolved": "https://registry.npmjs.org/word-wrap/-/word-wrap-1.2.5.tgz",
+      "integrity": "sha512-BN22B5eaMMI9UMtjrGd5g5eCYPpCPDUy0FJXbYsaT5zYxjFOckS53SQDE3pWkVoWpHXVb3BrYcEN4Twa55B5cA==",
       "dev": true
     },
     "wordwrap": {
diff --git a/package.json b/package.json
index 4bb17e14..45bf1fd3 100644
--- a/package.json
+++ b/package.json
@@ -32,7 +32,7 @@
     "@headlessui/react": "^1.4.2",
     "@heroicons/react": "^1.0.5",
     "@netlify/plugin-nextjs": "^4.40.1",
-    "axios": "^0.25.0",
+    "axios": "^1.6.2",
     "framer-motion": "^7.5.3",
     "jsqr": "^1.4.0",
     "lottie-web": "^5.8.1",
@@ -43,7 +43,7 @@
     "react-dom": "^18.2.0",
     "react-map-gl": "^6.1.17",
     "react-p5": "^1.3.21",
-    "sharp": "^0.30.0",
+    "sharp": "^0.32.6",
     "typewriter-effect": "^2.21.0"
   },
   "devDependencies": {

From 9e24fa9393feeafe484b74d3bcd7e4e005822b68 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?M=C3=A1rio=20Rodrigues?=
 <93675410+MarioRodrigues10@users.noreply.github.com>
Date: Fri, 1 Dec 2023 16:21:20 +0000
Subject: [PATCH 10/15] fix: "Register here" redirect (#587)

---
 components/Input/index.tsx                                    | 2 +-
 components/Select/index.tsx                                   | 4 +++-
 layout/ForgotPassword/components/ForgotPasswordForm/index.tsx | 2 +-
 layout/Login/Login.tsx                                        | 2 +-
 4 files changed, 6 insertions(+), 4 deletions(-)

diff --git a/components/Input/index.tsx b/components/Input/index.tsx
index 63eb6798..3f5015a5 100644
--- a/components/Input/index.tsx
+++ b/components/Input/index.tsx
@@ -34,7 +34,7 @@ export function InputBase({
       </label>
       <div
         className={`text-iregular mt-2 flex items-center  ${
-          enabled == false ? "text-gray-500" : textColor 
+          enabled == false ? "text-gray-500" : textColor
         } ${backColor} appearance-none rounded-full border border-gray-300 px-3 py-2 pl-6 placeholder-gray-400 shadow-sm sm:text-sm`}
       >
         {children}
diff --git a/components/Select/index.tsx b/components/Select/index.tsx
index 80489e6c..2f1f5f7d 100644
--- a/components/Select/index.tsx
+++ b/components/Select/index.tsx
@@ -50,7 +50,9 @@ export default function Select({
           {...rest}
         >
           {options.map((option) => (
-            <option key={option.key} value={option.key}>{option.name}</option>
+            <option key={option.key} value={option.key}>
+              {option.name}
+            </option>
           ))}
         </select>
         <ChevronDownIcon
diff --git a/layout/ForgotPassword/components/ForgotPasswordForm/index.tsx b/layout/ForgotPassword/components/ForgotPasswordForm/index.tsx
index d6cd933f..1a8dbce6 100644
--- a/layout/ForgotPassword/components/ForgotPasswordForm/index.tsx
+++ b/layout/ForgotPassword/components/ForgotPasswordForm/index.tsx
@@ -70,7 +70,7 @@ export default function ForgotPasswordForm() {
         <Text
           text="Don’t have an account?"
           link="Register here"
-          href="https://sei23.eventbrite.pt"
+          href="/signup"
         />
       )}
     </>
diff --git a/layout/Login/Login.tsx b/layout/Login/Login.tsx
index 964da312..ed36b7ef 100644
--- a/layout/Login/Login.tsx
+++ b/layout/Login/Login.tsx
@@ -27,7 +27,7 @@ function Login() {
         <Text
           text="Don’t have an account?"
           link="Register here"
-          href="https://sei23.eventbrite.pt"
+          href="/signup"
         />
         <div className="absolute bottom-0 right-60 hidden lg:block xl:hidden">
           <Motion.div

From 345805078464d025e010948742d41f4bc05912bf Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Jo=C3=A3o=20Lobo?=
 <30907944+joaodiaslobo@users.noreply.github.com>
Date: Mon, 4 Dec 2023 15:02:25 +0000
Subject: [PATCH 11/15] feat: animate challenges page components (#591)

---
 .../components/Challenges/Challenge/index.tsx | 123 +++++++++---------
 .../components/Challenges/index.jsx           |  41 +++---
 2 files changed, 88 insertions(+), 76 deletions(-)

diff --git a/layout/Challenges/components/Challenges/Challenge/index.tsx b/layout/Challenges/components/Challenges/Challenge/index.tsx
index 065cdeea..b492ffc8 100644
--- a/layout/Challenges/components/Challenges/Challenge/index.tsx
+++ b/layout/Challenges/components/Challenges/Challenge/index.tsx
@@ -1,5 +1,5 @@
 import Button from "@components/Button";
-import Link from "next/link";
+import { motion as Motion } from "framer-motion";
 
 function Action({ text, url }) {
   return (
@@ -33,65 +33,72 @@ interface IProps {
 
 export default function Challenge(props: IProps) {
   return (
-    <div className="sticky top-60">
-      <div>
-        <h2 className="font-terminal-uppercase text-3xl text-white md:text-4xl xl:text-5xl">
-          {props.title}
-        </h2>
-        <p className="mt-10 font-iregular text-white">{props.description}</p>
-        <div className="mt-3 flex flex-col">
-          {props.hrefs &&
-            props.hrefs.map((href, i) => (
-              <a
-                href={href.url}
-                key={i}
-                target="_blank"
-                rel="noreferrer"
-                className="font-iregular text-quinary hover:underline"
-              >
-                {href.name ?? href.url}
-              </a>
-            ))}
-        </div>
+    <Motion.div
+      initial={{ y: 30, opacity: 0 }}
+      animate={{ y: 0, opacity: 1 }}
+      transition={{ ease: "easeInOut", duration: 0.3 }}
+      key={props.title}
+    >
+      <div className="sticky top-60">
         <div>
-          {props.prizes && (
-            <h3 className="text-ibold md:text-md xl:text-md mt-5 mb-3 text-xl text-white ">
-              Awards 🏆
-            </h3>
-          )}
-          {props.prizes &&
-            props.prizes.map((prize, index) => {
-              let ordinal = "";
-              switch (index + 1) {
-                case 1:
-                  ordinal = "st";
-                  break;
-                case 2:
-                  ordinal = "nd";
-                  break;
-                case 3:
-                  ordinal = "rd";
-                  break;
-                default:
-                  ordinal = "th";
-              }
-              return (
-                <p key={index}>
-                  <a
-                    href={props.prizes[index].url}
-                    className="text-iregular text-quinary"
-                  >
-                    {index + 1}
-                    <sup>{ordinal}</sup> place - {props.prizes[index].name}
-                  </a>
-                </p>
-              );
-            })}
-          {props.button != null && (
-            <Action text={props.button.text} url={props.button.url} />
-          )}
+          <h2 className="font-terminal-uppercase text-3xl text-white md:text-4xl xl:text-5xl">
+            {props.title}
+          </h2>
+          <p className="mt-10 font-iregular text-white">{props.description}</p>
+          <div className="mt-3 flex flex-col">
+            {props.hrefs &&
+              props.hrefs.map((href, i) => (
+                <a
+                  href={href.url}
+                  key={i}
+                  target="_blank"
+                  rel="noreferrer"
+                  className="font-iregular text-quinary hover:underline"
+                >
+                  {href.name ?? href.url}
+                </a>
+              ))}
+          </div>
+          <div>
+            {props.prizes && (
+              <h3 className="text-ibold md:text-md xl:text-md mt-5 mb-3 text-xl text-white ">
+                Awards 🏆
+              </h3>
+            )}
+            {props.prizes &&
+              props.prizes.map((prize, index) => {
+                let ordinal = "";
+                switch (index + 1) {
+                  case 1:
+                    ordinal = "st";
+                    break;
+                  case 2:
+                    ordinal = "nd";
+                    break;
+                  case 3:
+                    ordinal = "rd";
+                    break;
+                  default:
+                    ordinal = "th";
+                }
+                return (
+                  <p key={index}>
+                    <a
+                      href={props.prizes[index].url}
+                      className="text-iregular text-quinary"
+                    >
+                      {index + 1}
+                      <sup>{ordinal}</sup> place - {props.prizes[index].name}
+                    </a>
+                  </p>
+                );
+              })}
+            {props.button != null && (
+              <Action text={props.button.text} url={props.button.url} />
+            )}
+          </div>
         </div>
       </div>
-    </div>
+    </Motion.div>
   );
 }
diff --git a/layout/Challenges/components/Challenges/index.jsx b/layout/Challenges/components/Challenges/index.jsx
index 588e7dcf..1a91c3b5 100644
--- a/layout/Challenges/components/Challenges/index.jsx
+++ b/layout/Challenges/components/Challenges/index.jsx
@@ -4,43 +4,48 @@ import challenges from "/data/challenges.json";
 import { useState } from "react";
 
 export default function Challenges() {
-  const [k, setKey] = useState(0);
+  const [key, setKey] = useState(0);
   return (
     <div className="spacing relative z-20 flex w-full flex-col px-40 py-10">
       <div className="mb-24 grid grid-cols-1 gap-20 xl:grid-cols-2">
         <div className="hidden xl:flex">
-          <ul className="font-ibold text-xl">
+          <ul className="font-terminal-uppercase text-xl">
             {Object.keys(challenges).map((i) => (
               <li
                 key={i}
-                className={`mb-6 ${
-                  i == k ? "ml-8 text-white" : "text-white text-opacity-20"
+                className={`mb-6 transition-all ease-in-out	${
+                  i == key
+                    ? "ml-8 text-white text-opacity-100"
+                    : "text-white text-opacity-20 hover:text-opacity-30"
                 }`}
               >
-                <button onClick={(e) => setKey(i)}>{challenges[i].name}</button>
+                <button onClick={(e) => setKey(i)}>
+                  {challenges[i].name.toUpperCase()}
+                </button>
               </li>
             ))}
           </ul>
         </div>
         <div className="hidden xl:flex">
           <Challenge
-            title={challenges[k].name}
-            prizes={challenges[k].prizes}
-            description={challenges[k].descriptions}
-            button={challenges[k].button}
-            hrefs={challenges[k].hrefs}
+            title={challenges[key].name}
+            prizes={challenges[key].prizes}
+            description={challenges[key].descriptions}
+            button={challenges[key].button}
+            hrefs={challenges[key].hrefs}
           />
         </div>
-        <div className="block xl:hidden">
-          {Object.keys(challenges).map((k) => {
+        <div className="block transition-all xl:hidden">
+          {Object.keys(challenges).map((key) => {
             return (
-              <section id={k} key={k} className="py-20">
+              <section id={key} key={key} className="py-20">
                 <Challenge
-                  title={challenges[k].name}
-                  prizes={challenges[k].prizes}
-                  description={challenges[k].descriptions}
-                  button={challenges[k].button}
-                  hrefs={challenges[k].hrefs}
+                  title={challenges[key].name}
+                  prizes={challenges[key].prizes}
+                  description={challenges[key].descriptions}
+                  button={challenges[key].button}
+                  hrefs={challenges[key].hrefs}
+                  key={key}
                 />
               </section>
             );

From fe4618a4e99eae78055d16fe437790c463df7a1d Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Jo=C3=A3o=20Lobo?=
 <30907944+joaodiaslobo@users.noreply.github.com>
Date: Tue, 5 Dec 2023 00:31:56 +0000
Subject: [PATCH 12/15] feat: improve map design (#592)

---
 layout/FAQs/FAQs.tsx                          |  45 +++---
 .../components/FindUs/index.tsx}              |  15 +-
 layout/FAQs/components/index.ts               |   3 +-
 layout/Team/Team.tsx                          |   3 +-
 layout/Team/components/FindUs/Map/index.jsx   |  46 ------
 layout/Team/components/index.ts               |   3 +-
 public/images/map/location.svg                | 140 ++++++++++++++++++
 7 files changed, 175 insertions(+), 80 deletions(-)
 rename layout/{Team/components/FindUs/index.jsx => FAQs/components/FindUs/index.tsx} (73%)
 delete mode 100644 layout/Team/components/FindUs/Map/index.jsx
 create mode 100644 public/images/map/location.svg

diff --git a/layout/FAQs/FAQs.tsx b/layout/FAQs/FAQs.tsx
index c1ca82b1..892e10f2 100644
--- a/layout/FAQs/FAQs.tsx
+++ b/layout/FAQs/FAQs.tsx
@@ -3,35 +3,38 @@ import { withoutAuth } from "@context/Auth";
 import Navbar from "@components/Navbar";
 import Footer from "@components/Footer";
 
-import { Question } from "./components";
+import { Question, FindUs } from "./components";
 
 import questions from "@data/faqs.json";
 
 function Faq() {
   return (
-    <Navbar bgColor="primary" button={"quinary"} fgColor={"white"}>
-      <div className="spacing flex flex-col justify-between bg-primary py-20 lg:h-3/4 lg:flex-row">
-        <div className="mb-10 text-white lg:w-2/5">
-          <h1 className="font-terminal-uppercase mb-4 text-4xl font-bold lg:text-6xl">
-            Frequently Asked Questions
-          </h1>
-          <p className="text-lg">
-            This list of frequently asked questions serves to complement the
-            general rules that you can find below. Get in touch with the
-            organizing team whenever a question arises and we will add answers
-            to the most frequently asked questions here.
-          </p>
-        </div>
-        <div className="lg:w-1/3">
-          <div className="flex flex-col">
-            {questions.map((question, i) => (
-              <Question key={i} {...question} />
-            ))}
+    <>
+      <Navbar bgColor="primary" button="quinary" fgColor="white">
+        <div className="spacing flex flex-col justify-between bg-primary py-20 lg:h-3/4 lg:flex-row">
+          <div className="mb-10 text-white lg:w-2/5">
+            <h1 className="font-terminal-uppercase mb-4 text-4xl font-bold lg:text-6xl">
+              Frequently Asked Questions
+            </h1>
+            <p className="text-lg">
+              This list of frequently asked questions serves to complement the
+              general rules that you can find below. Get in touch with the
+              organizing team whenever a question arises and we will add answers
+              to the most frequently asked questions here.
+            </p>
+          </div>
+          <div className="lg:w-1/3">
+            <div className="flex flex-col">
+              {questions.map((question, i) => (
+                <Question key={i} {...question} />
+              ))}
+            </div>
           </div>
         </div>
-      </div>
+      </Navbar>
+      <FindUs />
       <Footer color="primary" />
-    </Navbar>
+    </>
   );
 }
 
diff --git a/layout/Team/components/FindUs/index.jsx b/layout/FAQs/components/FindUs/index.tsx
similarity index 73%
rename from layout/Team/components/FindUs/index.jsx
rename to layout/FAQs/components/FindUs/index.tsx
index e8c0648e..b5015166 100644
--- a/layout/Team/components/FindUs/index.jsx
+++ b/layout/FAQs/components/FindUs/index.tsx
@@ -1,8 +1,4 @@
-import dynamic from "next/dynamic";
-
-const Map = dynamic(() => import("./Map"), {
-  ssr: false,
-});
+import { motion as Motion } from "framer-motion";
 
 const email = "cesium@di.uminho.pt";
 
@@ -15,10 +11,13 @@ export default function FindUs() {
         </h2>
 
         <p className="mb-8 font-iregular">
-          The SEI is free for participants and is organized by volunteers from
+          SEI is free for participants and is organized by volunteers from
           CeSIUM and from the university community.
         </p>
-
+        <p className="mb-8 font-iregular">
+          This years event will take place at Pedagogic Complex 2, Gualtar
+          Campus.
+        </p>
         <p className="mb-2 font-ibold">
           Centro de Estudantes de Engenharia Informática
         </p>
@@ -30,7 +29,7 @@ export default function FindUs() {
         </ul>
       </div>
       <div className="w-full lg:w-3/5">
-        <Map />
+        <img src="/images/map/location.svg" alt="" />
       </div>
     </section>
   );
diff --git a/layout/FAQs/components/index.ts b/layout/FAQs/components/index.ts
index 623c0a31..572c4b32 100644
--- a/layout/FAQs/components/index.ts
+++ b/layout/FAQs/components/index.ts
@@ -1,3 +1,4 @@
 import Question from "./Question";
+import FindUs from "./FindUs";
 
-export { Question };
+export { FindUs, Question };
diff --git a/layout/Team/Team.tsx b/layout/Team/Team.tsx
index a845572e..f70d455b 100644
--- a/layout/Team/Team.tsx
+++ b/layout/Team/Team.tsx
@@ -1,6 +1,6 @@
 import { withoutAuth } from "@context/Auth";
 
-import { Hero, FindUs, Organization } from "./components";
+import { Hero, Organization } from "./components";
 
 import Navbar from "@components/Navbar";
 import Footer from "@components/Footer";
@@ -10,7 +10,6 @@ function Index() {
     <Navbar bgColor="primary" button="quinary" fgColor="white">
       <Hero />
       <Organization />
-      <FindUs />
       <Footer color="primary" />
     </Navbar>
   );
diff --git a/layout/Team/components/FindUs/Map/index.jsx b/layout/Team/components/FindUs/Map/index.jsx
deleted file mode 100644
index 8c1c62d7..00000000
--- a/layout/Team/components/FindUs/Map/index.jsx
+++ /dev/null
@@ -1,46 +0,0 @@
-import { Component } from "react";
-import ReactMapGL, { Marker } from "react-map-gl";
-
-class Map extends Component {
-  state = {
-    viewport: {
-      latitude: 41.56223051893658,
-      longitude: -8.39774542273983,
-      zoom: 15,
-    },
-  };
-
-  onViewportChange = (viewport) => {
-    const { width, height, ...etc } = viewport;
-    this.setState({ viewport: etc });
-  };
-
-  render() {
-    return (
-      <ReactMapGL
-        width="100%"
-        height="400px"
-        mapStyle="mapbox://styles/cesiuminho/cle4zw39g000i01t6aco31jq1"
-        mapboxApiAccessToken="pk.eyJ1IjoiY2VzaW5mb3JtYXRpY2F1bSIsImEiOiJja3d0aGRoc3ExZ2E2Mm9wbTlrbjlucmt1In0.vMxC_EtVdBjkc9-F7HsMCw"
-        onViewportChange={(viewport) => {
-          this.setState({ viewport });
-        }}
-        {...this.state.viewport}
-      >
-        <Marker
-          latitude={41.5599239}
-          longitude={-8.3963955}
-          style={{
-            cursor: "pointer",
-            "background-color": "#F52AB1",
-            width: "20px",
-            height: "20px",
-            "border-radius": "50%",
-          }}
-        ></Marker>
-      </ReactMapGL>
-    );
-  }
-}
-
-export default Map;
diff --git a/layout/Team/components/index.ts b/layout/Team/components/index.ts
index 4bb20541..e5eff99c 100644
--- a/layout/Team/components/index.ts
+++ b/layout/Team/components/index.ts
@@ -1,5 +1,4 @@
 import Hero from "./Hero";
-import FindUs from "./FindUs";
 import Organization from "./Organization";
 
-export { Hero, FindUs, Organization };
+export { Hero, Organization };
diff --git a/public/images/map/location.svg b/public/images/map/location.svg
new file mode 100644
index 00000000..e79ea704
--- /dev/null
+++ b/public/images/map/location.svg
@@ -0,0 +1,140 @@
+<?xml version="1.0" encoding="utf-8"?>
+<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
+	 viewBox="0 0 559.3 549.2" style="enable-background:new 0 0 559.3 549.2;" xml:space="preserve">
+<style type="text/css">
+	.st0{opacity:0.2;}
+	.st1{fill:#FFFFFF;}
+	@keyframes bounce {
+		0%, 100% {
+			transform: translateY(-5%);
+			animation-timing-function: cubic-bezier(0.8,0,1,1);
+		}
+		50% {
+			transform: none;
+			animation-timing-function: cubic-bezier(0,0,0.2,1);
+		}
+	}
+
+	.animate-bounce {
+  	animation: bounce 1s infinite;
+	}
+</style>
+<g class="st0">
+	<path class="st1" d="M559.1,193.2c-0.2-0.5-0.5-1.1-0.8-1.5c-18.7,1.7-37.5,3.4-56.2,5.2c-17.5,1.7-35,3.3-52.5,5.1
+		c-2.5-10.2-4.7-19.2-6.6-26.6c-4.1-16-5.3-20-8.1-24.7c-4.5-7.1-10.7-13-18.1-17c0.1-4,0.2-7.9,0.2-11.9l49.8-4.9
+		c-2.4-23-4.8-45.9-7.2-68.9L228.4,68.2l-44,132.3c4.1-0.4,6.3,0.9,7.4,1.7c5.5,4.2,4.5,15.5-0.3,22.4c-1.8,2.5-4.1,4.6-6.8,6.1
+		c-1.3,0.7-2.6,1.3-4,1.8l-0.3,0.1l0.8,3.9l0.2,0.6l9.4,31.6l2.8,17.1c-0.1,0.1-0.3,0.1-0.4,0.1c-1.8,0.3-3.7-2.7-4.7-4.6
+		c-0.4-0.8-0.7-1.4-0.7-1.5c-1,0-2.4,0-4.1-0.1c-1.6,0-3.2-0.2-4.7-0.6c-2-0.7-3.3-2.4-4.4-4.2c-2.5-3.9-4.1-8.3-4.9-12.8
+		c-3.1-24.6-13.8-41.3-10.2-76.3c1.8-18,4.7-14.6,8-37.7c0.1-0.7,0.2-1.4,0.3-2.2c0.6-4.7,1.1-8.8,1.5-12.4
+		c1.3-12.5,2.1-19.7,8-25.1c7.4-6.7,18.5-6.5,26.7-5.2c1.8-3.9,3.8-8.4,5.9-13.6c3.3-7.9,4.3-10.7,3.7-14.3
+		c-0.6-5.5-4.8-9.9-10.3-10.6c-5.9-1.2-22.9-3.3-45.9-5.4l0,0h-0.3l-3.7-0.4v8l-11.9,1c0.1-9.8-6-18.7-15.1-22.3
+		c0,0-15.2-7.8-29-16.4c-12.2-7.7-18.3-11.5-22.8-16.5c-3-3.7-6.7-6.9-10.9-9.2C60.1,1.2,56.2,0.1,52.2,0C46.5,0,42.4,2.7,40,4.3
+		c-4.9,3.3-8.8,7.9-11.2,13.2c-2.6,5.3-4,11.2-4,17.2c0,4.5,0.8,3.8,3.7,19.8c1.4,7.5,1.8,10.6,0.7,14.7c-0.9,3-2.1,5.9-3.8,8.6
+		c-2.5,4.4-4.3,6-5.7,8.1c-3.1,4.8-2.4,9.2-0.6,29.8c0.8,9,1.2,13.5,1.2,14.4c-0.5,8.9-3.4,15.2-8.9,26.5
+		c-1.1,2.3-8.9,18.5-11.2,28.6c-0.4,1.8-0.5,3.6-0.1,5.4c0.9,4.5,4.4,7.4,6.2,8.7c27.9,18.2,46.5,30,54.4,34.3
+		c4.3,2.2,8.2,5.1,11.6,8.4c2.6,2.5,5,5.3,7,8.4c-6.4,38.7-12.7,77.5-19.1,116.3l-40.9,77.5c-1.5,2-3.8,5.9-2.5,9.1
+		c1.1,2.7,4.3,3.4,11.1,5.3c6.3,1.8,13.4,3.7,19.1,5.8c6.3,2.3,5.7,2.8,16.7,7.3c4.4,1.7,8.9,3.1,13.6,4.2
+		c7.8,2.1,14.6,3.4,20.7,4.4c14.2,2.3,23.6,3.9,34.3,3.7c14.2-0.3,28.3-3.3,41.4-9c6.3,23.5,12.5,47,18.7,70.5l36.8-6.6l4.6-2.3
+		c122.9-63.2,211.2-108.7,223-114c2.8-1.3,12.5-5.3,17.7-15.1c0.9-1.7,1.6-3.5,2.1-5.3c5.8-19.5,5.5-6,32.2-96.4
+		c14-47.5,13.2-48.1,18.3-59.2c8-17.3,18.3-33.4,30.5-48C558.1,198.2,560,195.8,559.1,193.2z"/>
+</g>
+<path class="st1" d="M218.1,547c-0.5,0-0.9-0.3-1-0.8c-4.4-18.2-8.4-34-11.6-46.4v-0.1c-2.2-8.5-4.1-15.5-5.5-20.5
+	c-0.8-2.8-2.2-6.7-5.7-9.2c-2.4-1.7-6.4-3.2-17.9-1.2c-5.2,0.9-10.2,2.3-15.1,4.2c-2.1,0.8-4.2,1.5-6.6,2.3
+	c-14.3,4.3-24.8,4.2-31.2,3.3h-0.2c-5.8-0.8-23.5-3.3-32.6-17.6c-2.5-3.9-4.1-8.3-4.8-12.9C81,418.5,73.2,335.3,73.1,334.5
+	c-0.3-5.9,1.3-11.8,4.6-16.8c6.3-9.5,16.4-11.7,19.4-12.2c19-2.3,38.3-5.1,57.2-8.4c9.7-1.7,19.6-3.5,29.3-5.5
+	c9.1-2.7,18.6-4,28.1-4.1c63.7-0.7,78.6,0,78.7,0c0.3,0,29.7,1.3,42.6-3.8c6.5-2.6,13.5-3.7,20.5-3.1h0.2
+	c8.4,0.6,55.5,0.2,105.1-0.2c2.5,0,5,0.4,7.3,1.2c11.1,3.7,15.5,14.5,16,15.7c2.3,6,1.3,10.3-1.2,20.9c-0.5,2-1,4.2-1.5,6.7
+	c-2.1,9.5-4,19.3-5.6,29.3c-0.8,3.7-1.6,7.4-2.5,11c-2.1,9.1-2.8,11.1-4.4,13c-2,2.3-5.9,5.1-13.7,5.2l-43.4-0.1l-0.2,41.4
+	c-0.1,2.5-0.8,5-1.9,7.2c-1.7,3.5-4.3,6.3-7.6,8.3c-14.2,7.9-28.6,15.7-42.8,23.3c-26.7,14.3-53.9,28.5-80.9,42.1
+	c-1.5,0.8-3,1.5-4.6,2.1c-4.1,1.5-8.5,2.1-12.8,2h-0.1c-4.2-0.1-10.9,0-19.5,0.1c-5.4,0-11.6,0.1-18.4,0.2l0,0c-2.8,0-5.6-0.7-8.1-2
+	c-1.5-0.8-2.9-1.9-4.1-3.2c3,11.5,6.4,25.4,10.2,40.9c0.1,0.5-0.2,1.1-0.7,1.2l0,0L218.1,547z M207.4,499.1c1.4,3,3.6,5.5,6.5,7.1
+	c2.2,1.2,4.7,1.8,7.2,1.7c6.8,0,13-0.1,18.4-0.2c8.6-0.1,15.4-0.1,19.5-0.1h0.1c4.1,0.2,8.2-0.5,12.1-1.9c1.5-0.6,2.9-1.2,4.3-2
+	c27-13.7,54.2-27.8,80.9-42.1c14.2-7.6,28.6-15.5,42.8-23.3c3-1.8,5.3-4.4,6.9-7.5c1-2,1.5-4.2,1.7-6.4l0.2-43.3l45.3,0.1
+	c7-0.1,10.5-2.5,12.1-4.5c1.2-1.5,1.9-3.1,4-12.1c0.9-3.7,1.7-7.3,2.4-10.9c1.6-9.9,3.5-19.8,5.6-29.3c0.6-2.5,1.1-4.7,1.6-6.7
+	c2.4-10.1,3.4-14.3,1.3-19.7c-0.4-1.1-4.5-11.1-14.8-14.5c-2.1-0.7-4.4-1.1-6.6-1.1c-49.6,0.5-96.7,0.8-105.2,0.2h-0.2
+	c-4.7-0.4-9.4,0-13.9,1.2c-1.9,0.5-3.8,1.1-5.6,1.8c-13.4,5.4-42.4,4.1-43.6,4c-0.1,0-15-0.7-78.6,0c-9.4,0.1-18.7,1.4-27.7,4
+	c-9.8,2-19.7,3.8-29.4,5.5c-18.9,3.3-38.2,6.1-57.2,8.4c-2.7,0.4-12.1,2.5-18,11.3c-3,4.6-4.5,10-4.2,15.5
+	c0.1,0.8,7.9,84,12.8,113.3c0.7,4.3,2.2,8.5,4.5,12.2c8.6,13.6,25.6,16,31.2,16.7h0.2c6.1,0.9,16.4,1,30.3-3.2
+	c2.4-0.7,4.5-1.5,6.5-2.2c5-1.9,10.2-3.4,15.5-4.3c12.2-2.1,16.5-0.5,19.4,1.6c4,2.9,5.6,7.3,6.4,10.3
+	C203.3,483.7,205.2,490.6,207.4,499.1L207.4,499.1z"/>
+<path class="st1" d="M204,549.2c-0.5,0-0.9-0.3-1-0.7l-18-64.9c-1.7-8-6.1-13.6-10.9-14.1c-1.3-0.1-2.5,0.1-3.7,0.6
+	c-0.5,0.2-1.1,0-1.3-0.6c-0.2-0.5,0-1.1,0.6-1.3c1.5-0.6,3-0.9,4.6-0.7c5.7,0.5,10.8,6.8,12.7,15.6l18,64.9c0.1,0.5-0.2,1.1-0.7,1.2
+	l0,0C204.2,549.1,204.1,549.2,204,549.2z"/>
+<path class="st1" d="M408.9,383.3h-32.2v-12.1h13.5c0.6,0,1,0.4,1,1s-0.4,1-1,1h-11.4v8.1h30.1c0.6,0,1,0.4,1,1
+	S409.4,383.3,408.9,383.3z"/>
+<path class="st1" d="M495.9,360.8h-0.2l-23.1-5.8c-0.5-0.1-0.9-0.6-0.9-1.1c0.1-0.5,0.6-0.9,1.1-0.9c0.1,0,0.1,0,0.2,0.1l23.1,5.7
+	c0.5,0.1,0.9,0.7,0.7,1.2l0,0C496.8,360.4,496.4,360.8,495.9,360.8z"/>
+<path class="st1" d="M262.2,399c-0.1,0-0.2,0-0.3-0.1c-4.9-1.8-10-3.2-15.2-4.1c-3.2-0.6-6.3-1.3-9.4-2.1c-1.7-0.4-3.4-0.8-5.1-1.2
+	c-2.5-0.5-5.2-1.2-7.7-3.5c-1.8-1.7-3-3.9-3.5-6.3c-4.9-15.5-8.7-26.2-11.4-31.9l-0.1-0.1c-2.2-4.7-3.4-9.8-3.3-15
+	c0-1.1-0.1-2.3-0.2-3.6c-0.4-4-1.2-8-2.3-11.9c-1.1-4.3-2-7.1-3-9.8c-1.3-3.6-2.3-7.4-3.1-11.2c-0.6-2.7-1-5.5-1.3-8.3
+	c-0.1-0.6,0.3-1,0.9-1.1c0.6-0.1,1,0.3,1.1,0.9c0.3,2.7,0.7,5.4,1.3,8.1c0.7,3.7,1.7,7.4,3,10.9c0.9,2.6,1.9,5.6,3,10
+	c1.2,4,2,8.1,2.4,12.3c0.1,1.4,0.1,2.5,0.2,3.7c0,2.7,0.4,5.4,1,8c0.5,2.1,1.3,4.2,2.2,6.2l0.1,0.1c2.6,5.8,6.5,16.6,11.4,32.2
+	c0.5,2,1.5,3.9,3,5.4c2,2,4.4,2.5,6.7,3c1.7,0.4,3.4,0.8,5.1,1.2c3,0.7,6.2,1.5,9.3,2.1c5.3,1,10.5,2.4,15.5,4.2
+	c0.5,0.2,0.8,0.8,0.6,1.3C262.9,398.7,262.6,399,262.2,399L262.2,399z"/>
+<path class="st1" d="M230.6,379.3L230.6,379.3l-9.7-0.1c-0.6,0-1-0.4-1-1s0.4-1,1-1l0,0l9.8,0.1c0.6,0,1,0.4,1,1
+	S231.2,379.3,230.6,379.3L230.6,379.3z"/>
+<path class="st1" d="M224.5,509.9c-0.5,0-0.9-0.3-1-0.8c-1.2-5.1,0.4-9.9,3.9-12c1.5-0.9,3.2-1.3,4.9-1.1h20.2l0.3-10.1l-22.3-0.4
+	c-2.5-0.3-4.8-1.3-6.7-2.9c-2.4-2.1-2.7-4.2-3.2-7.2c-0.5-3.2-1.3-6.3-2.6-9.3c-0.4-0.9-0.7-1.7-1.1-2.4c-1.3-2.6-2.1-5.4-2.4-8.2
+	c-0.1-1.8-0.1-3.6,0.2-5.3c0.1-0.6,0.6-0.9,1.1-0.9s0.9,0.6,0.9,1.1c-0.2,1.6-0.3,3.2-0.2,4.9c0.2,2.6,1,5.2,2.2,7.6
+	c0.4,0.8,0.7,1.6,1.1,2.5c1.3,3.1,2.2,6.4,2.7,9.7c0.5,2.8,0.8,4.4,2.6,6.1c1.6,1.3,3.5,2.2,5.6,2.4l24.1,0.4l-0.4,14h-22.2
+	c-1.3-0.1-2.6,0.2-3.8,0.8c-2.7,1.6-3.9,5.7-3,9.8c0.1,0.5-0.2,1.1-0.8,1.2C224.7,509.9,224.6,509.9,224.5,509.9z"/>
+<path class="st1" d="M157.7,298.5c-0.5,0-0.9-0.3-1-0.8l-21.8-101.2c-3.3-14.6-2.1-30,3.6-43.9c3.1-7.4,7.4-14.2,12.7-20.1
+	l35.9-50.9c3.5-4.4,3.1-9.6,0.5-11.8c-2.1-1.8-5.2-1.3-6.1-1.1h-0.1l-16.1,1.8c-16.9,1.9-30.2,3.3-38.2,4.5c-2.6,0.4-8.4,1.2-13.5-2
+	c-4-2.5-5.7-6.2-6.8-8.4l-0.3-0.6C103,56.8,95,50.8,82.8,46.1c-0.5-0.2-0.8-0.8-0.6-1.3l0,0c0.2-0.5,0.8-0.8,1.3-0.6l0,0
+	c12.7,4.8,21,11.2,24.8,18.9l0.3,0.7c1,2.2,2.5,5.4,6,7.6c4.5,2.8,9.7,2.1,12.1,1.7c8-1.2,21.4-2.6,38.3-4.5l16.1-1.7
+	c1.2-0.3,5.1-0.8,7.8,1.5c3.2,2.8,4.1,9.1-0.2,14.5l-36,51c-5.2,5.8-9.4,12.4-12.4,19.6c-5.5,13.5-6.7,28.4-3.4,42.7l21.8,101.2
+	c0.1,0.5-0.2,1.1-0.8,1.2C157.9,298.5,157.8,298.5,157.7,298.5z"/>
+<path class="st1" d="M146.6,72.7c-0.6,0-1-0.4-1-1l-0.8-18.8c0-0.6,0.4-1,1-1s1,0.4,1,1l0.8,18.8C147.7,72.2,147.2,72.6,146.6,72.7
+	L146.6,72.7z"/>
+<path class="st1" d="M527.4,256L527.4,256c-7.2-0.2-14.2-0.5-21.5-1c-2.1,0-4.2-0.7-6-1.9c-1.9-1.5-3.2-3.5-3.7-5.8
+	c-0.2-0.5,0.1-1.1,0.6-1.3s1.1,0.1,1.3,0.6v0.1c0.4,1.9,1.5,3.6,3,4.7c1.5,1,3.2,1.5,5,1.5c7.3,0.4,14.3,0.8,21.5,1c0.6,0,1,0.4,1,1
+	s-0.4,1-1,1L527.4,256L527.4,256z"/>
+<path class="st1" d="M55,156l-5.5-47.7H49l-2-21.5l-4.2-27.3L62,57.2l0.5,10.1L68,67l2.7,17l45-4.2l5.5,47.7l0.4-0.1l2.1,22.1
+	L55,156z M50.3,107.2l5.5,47.7l66.8-6.3l-1.9-20.1h-0.4l-5.5-47.6l-45,4.2l-2.6-16.9l-5.6,0.3l-0.5-10l-17.3,2l4.1,26.2l2,20.6
+	L50.3,107.2z M68.3,133.4l-3.5-27.6l30.3-2.9l4.6,27.5L68.3,133.4z M65.9,106.8l3.2,25.6l29.4-2.8l-4.3-25.5L65.9,106.8z"/>
+<path class="st1" d="M219,340.6L204.9,299h57v12.7l-40.8-0.5l10.8,29.5L219,340.6z M206.3,300l13.4,39.7h10.8l-10.8-29.5l41.2,0.5
+	V300H206.3z"/>
+<path class="st1" d="M229.2,462.3c-2.4,0.2-4.8-0.7-6.6-2.4c-1.7-1.9-2.6-4.4-2.4-7V440l-2.9-0.1v-10h5.1l0.2-12.6h6.9l2.3-2.5
+	l0.2-6.3h27v7.5h9.7v18.8H260c-1.3,6.1-4.5,14.6-12.3,20.9c-4.1,3.3-9.1,5.4-14.4,6.2C232,462.2,230.6,462.3,229.2,462.3z
+	 M218.3,439.1l2.9,0.1V453c-0.2,2.3,0.6,4.5,2.1,6.3c2.6,2.7,6.8,2.1,9.9,1.7c5.1-0.7,9.9-2.8,13.9-6c7.7-6.3,10.8-14.7,12-20.7
+	l0.1-0.4h8.5v-16.7H258v-7.5h-25l-0.2,5.8l-2.8,3h-6.3l-0.2,12.6h-5.1L218.3,439.1z"/>
+<path class="st1" d="M326.4,451.1h-48.2v-17.9h48.2V451.1z M279.2,450.1h46.2v-15.9h-46.2V450.1z"/>
+<path class="st1" d="M342,381.5h-63.8v-11.7h28.9v-35h22.6v-5.4h45.1v49.2h-4.4v-3.4H342V381.5z M279.2,380.5H341v-6.3h30.3v3.4h2.4
+	v-47.2h-43.1v5.4H308v35h-28.9L279.2,380.5z M330.6,370.8h-12.1v-25.5h12.1V370.8z M319.5,369.8h10.1v-23.5h-10.1V369.8z
+	 M365.1,364.9h-24V340h24V364.9z M342.1,363.9h22V341h-22V363.9z"/>
+<path class="st1" d="M291.9,347.8h-15.1v-48.2H320V328h-13.3v-15.6h-14.9L291.9,347.8L291.9,347.8z M277.8,346.8h13.1v-35.4h16.8
+	V327H319v-26.5h-41.2V346.8z"/>
+<path class="st1" d="M390.4,340.2h-11.7v-26.7h11.7v8.6h2.6v-2.3h2v-10h7.2v-0.9h-2.3v-2.1h-1.5v-5.4h-10.5v-9.1h67v5.4h-10.1v2h6.8
+	v21h-6.8v6.1h-40v-2.7h-5.4v11.2h-9L390.4,340.2z M379.7,339.2h9.7v-4.9h9v-11.2h7.4v2.7h38v-6h6.8v-19h-6.8v-4h10.1v-3.5h-65v7.1
+	h10.5v5.4h1.5v2.1h2.3v2.9H396v10h-2v2.3h-4.6v-8.6h-9.7L379.7,339.2z"/>
+<path class="st1" d="M495.8,253.3h-40.5v-14.7h40.5V253.3z M456.3,252.3h38.5v-12.7h-38.5V252.3z"/>
+<path class="st1" d="M504.2,228.9h-37.8v-6.2h21.4v-1.2h5.9v-3.7h10.5V228.9z M467.3,227.9h35.8v-9.2h-8.5v3.7h-5.9v1.2h-21.4V227.9
+	z"/>
+<path class="st1" d="M265.4,388.4h-29.5l-0.1-0.2c-9.7-11.5-16.1-25.5-18.4-40.4l-0.1-0.6l34.5-0.1v8l-9.7,0.1v12.1h23.3V388.4z
+	 M236.3,387.4h28.1v-19.2h-23.3v-14.1l9.7-0.1v-6l-32.4,0.1C220.7,362.6,226.9,376.1,236.3,387.4L236.3,387.4z"/>
+<path class="st1" d="M405.3,408.2h-20v-10.6h20V408.2z M386.3,407.2h18v-8.6h-18V407.2z"/>
+<path class="st1" d="M381.8,437.9h-41.5v-23.4h-3.7v-9.8h3.7v-7h41.5v9.6h2.8v9.6h5c1.2-0.9,2.6-1.4,4.1-1.4
+	c3.6,0.1,6.5,3.2,6.3,6.9c-0.1,3.4-2.9,6.2-6.3,6.3c-1.5,0-2.9-0.5-4.1-1.4h-5v1.4h3.5v8.5h-6.3V437.9z M341.2,436.9h39.5V436h6.3
+	v-6.5h-3.5v-3.4h6.4l0.1,0.1c1,0.9,2.3,1.3,3.6,1.3c3.1-0.1,5.5-2.7,5.4-5.8c-0.1-2.9-2.5-5.2-5.4-5.4c-1.3,0-2.6,0.5-3.6,1.3
+	l-0.1,0.1h-6.4v-9.6h-2.8v-9.6h-39.5v7h-3.7v7.8h3.7V436.9z M369.6,423.4h-14.8v-8.9H352v-2.8h21.4v5.5h-3.9v6.2L369.6,423.4
+	L369.6,423.4z M355.7,422.4h12.8v-6.2h3.9v-3.5H353v0.8h2.7V422.4z"/>
+<path class="st1" d="M325.1,403.8h-18.2v-23.3h18.2V403.8z M307.9,402.8h16.2v-21.3h-16.2V402.8z"/>
+<path class="st1" d="M319.2,434.2h-12.4v-17.6h-28.7v-13.8h41.1V434.2z M307.8,433.2h10.4v-29.4h-39.1v11.7h28.7V433.2z"/>
+<path class="st1" d="M266.4,283.1h-65.1v-29.4h37.8v4.6h27.3v6.5h16.2v17.6h-16.3L266.4,283.1L266.4,283.1z M202.4,282.1h63.1v-0.8
+	h16.2v-15.6h-16.2v-6.5h-27.3v-4.6h-35.8V282.1z"/>
+<path class="st1" d="M189.5,254.1l-8.4-20.6l14.3-6l9.4,19.4L189.5,254.1z M182.4,234l7.7,18.7l13.4-6.3l-8.5-17.6L182.4,234z"/>
+<path class="st1" d="M86.4,369.2l-1.9-15.5l41.1-5l1.9,15.5L86.4,369.2z M85.6,354.5l1.6,13.6l39.1-4.7l-1.6-13.6L85.6,354.5z"/>
+<path class="st1" d="M89.6,396.8L88,381.2h0.5l40.7-4l1.5,15.6h-0.5L89.6,396.8z M89.1,382.1l1.3,13.6l39.2-3.9l-1.3-13.6
+	L89.1,382.1z"/>
+<path class="st1" d="M92.8,424.4l-1.3-13.8l41.2-3.8l1.3,13.8L92.8,424.4z M92.7,411.5l1.1,11.8l39.2-3.6l-1.1-11.9L92.7,411.5z"/>
+<path class="st1" d="M95.2,455.4l-1-13.8h0.5l40.8-3.1l1,13.8H136L95.2,455.4z M95.2,442.5l0.9,11.8l39.3-3l-0.9-11.8L95.2,442.5z"
+	/>
+<path class="st1" d="M115.8,299.2l-11.6-14l12.7-10.5l11.6,14.1L115.8,299.2z M105.6,285.3l10.3,12.5l11.1-9.2L116.7,276
+	L105.6,285.3z"/>
+<path class="st1" d="M81.4,347.4l-2-10.9l28.7-5.2c-3.5-2.6-4.3-7.6-1.7-11.2l-19.6,1.2l-0.8-8.7l31.4-3.3l-0.2,8.5
+	c3.8,2.3,5.1,7.3,2.8,11.1c-0.2,0.4-0.5,0.7-0.7,1l1.9,10.2L81.4,347.4z M80.6,337.4l1.6,8.9l37.8-6.9l-1.6-8.9l-1,0.2l1-1.1
+	c2.6-2.9,2.4-7.4-0.5-10c-0.4-0.4-0.9-0.7-1.4-1l-0.3-0.1l0.2-8l-29.3,3.1l0.6,6.7l21.1-1.3l-0.9,0.9c-2.7,2.8-2.6,7.3,0.2,10
+	c0.5,0.5,1,0.9,1.6,1.2l1.3,0.7L80.6,337.4z"/>
+<path class="st1 animate-bounce" d="M243.8,448.6c-3.2-4.1-6.3-8-7.6-13c-0.7-3.1,0.7-6.2,3.3-7.9c2.6-1.7,6-1.7,8.6,0.1c2.6,1.7,3.8,4.8,3.2,7.9
+	c-0.9,4.1-3.4,7.4-5.8,10.8C245.1,447,244.5,447.7,243.8,448.6z"/>
+</svg>

From 4b897ad9e7504da8b73a7971c7542bf43a269789 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?D=C3=A1rio=20Guimar=C3=A3es?=
 <49988070+Darguima@users.noreply.github.com>
Date: Wed, 6 Dec 2023 23:30:57 +0000
Subject: [PATCH 13/15] fix: standardize button component implementation (#585)

---
 components/Button/index.tsx                     | 17 ++++-------------
 components/Layout/Layout.tsx                    |  2 +-
 layout/Attendee/Profile/Profile.tsx             |  4 ++--
 layout/Attendee/Wheel/Wheel.tsx                 |  4 ++--
 .../components/Challenges/Challenge/index.tsx   |  2 +-
 layout/Home/components/Hero/Pitch/index.jsx     |  4 ++--
 layout/Home/components/Speakers/index.jsx       |  2 +-
 layout/Login/components/LoginForm/index.tsx     |  2 +-
 layout/Product/Product.tsx                      |  2 +-
 .../components/ResetPasswordForm/index.tsx      |  2 +-
 layout/SignUp/components/SignUpForm/index.tsx   |  4 ++--
 .../components/StaffRedeemButton/index.jsx      |  5 +----
 .../dashboard/SponsorBadgeButton/index.jsx      |  5 +----
 .../dashboard/SponsorPrizeButton/index.jsx      |  2 +-
 .../sponsor/spotlight/SpotlightButton/index.jsx |  5 +----
 layout/shared/Leaderboard/Leaderboard.tsx       |  4 ++--
 pages/register/[uuid].js                        |  6 +++---
 17 files changed, 27 insertions(+), 45 deletions(-)

diff --git a/components/Button/index.tsx b/components/Button/index.tsx
index d2ff5b36..dc0deab6 100644
--- a/components/Button/index.tsx
+++ b/components/Button/index.tsx
@@ -3,9 +3,7 @@ import { ButtonHTMLAttributes, ReactNode } from "react";
 interface Props extends Omit<ButtonHTMLAttributes<HTMLButtonElement>, "title"> {
   title: ReactNode;
   description?: string;
-  customStyle?: string;
   bold?: boolean;
-  disabled?: boolean;
 }
 
 interface ButtonTitleProps {
@@ -16,22 +14,15 @@ interface ButtonTitleProps {
 export default function Button({
   title,
   description,
-  type,
-  disabled,
-  onClick,
-  customStyle,
-  bold,
+  bold = false,
   ...rest
 }: Props) {
   return (
     <button
       {...rest}
-      onClick={onClick}
-      type={type}
-      disabled={disabled}
-      className={`${
-        customStyle || ""
-      } m-auto block rounded-full hover:opacity-75 disabled:bg-gray-400 disabled:opacity-75`}
+      className={`m-auto block rounded-full hover:opacity-75 disabled:bg-gray-400 disabled:opacity-75 ${
+        rest.className || ""
+      }`}
     >
       <ButtonTitle title={title} bold={bold} />
       <p className="font-iregular">{description}</p>
diff --git a/components/Layout/Layout.tsx b/components/Layout/Layout.tsx
index 21c4feef..2a82e41b 100644
--- a/components/Layout/Layout.tsx
+++ b/components/Layout/Layout.tsx
@@ -174,7 +174,7 @@ function MobileNavbar({
 
                   <button type="button" onClick={onClose} className="h-12 w-12">
                     <span className="sr-only">Close sidebar</span>
-                    title={<FontAwesomeIcon icon={faTimes} />}
+                    <FontAwesomeIcon icon={faTimes} />
                   </button>
                 </div>
 
diff --git a/layout/Attendee/Profile/Profile.tsx b/layout/Attendee/Profile/Profile.tsx
index ff26cc7e..4f3c9494 100644
--- a/layout/Attendee/Profile/Profile.tsx
+++ b/layout/Attendee/Profile/Profile.tsx
@@ -102,10 +102,10 @@ function Profile({ courses }) {
           <Heading text="User Profile">
             <div className="w-auto">
               <Button
-                customStyle="w-full items-center rounded-full border border-quinary bg-quinary py-2 px-4 text-center font-iregular text-sm text-secondary shadow-sm"
                 title={editing ? "Save Changes" : "Edit"}
-                form="profile-form"
+                className="w-full items-center border border-quinary bg-quinary py-2 px-4 text-center font-iregular text-sm text-secondary shadow-sm"
                 type="submit"
+                form="profile-form"
               />
             </div>
           </Heading>
diff --git a/layout/Attendee/Wheel/Wheel.tsx b/layout/Attendee/Wheel/Wheel.tsx
index aeacf190..6cbf0c1a 100644
--- a/layout/Attendee/Wheel/Wheel.tsx
+++ b/layout/Attendee/Wheel/Wheel.tsx
@@ -203,11 +203,11 @@ function WheelPage() {
               <WheelComponent steps={16} angle={st.angle} />
             </div>
             <Button
-              customStyle={`${
+              className={`${
                 canSpin()
                   ? "cursor-pointer bg-quinary"
                   : "bg-gray-400 opacity-50"
-              } m-auto mt-10 block h-20 w-64 rounded-full`}
+              } mt-10 block h-20 w-64`}
               disabled={!canSpin()}
               onClick={spinTheWheel}
               title="SPIN THE WHEEL"
diff --git a/layout/Challenges/components/Challenges/Challenge/index.tsx b/layout/Challenges/components/Challenges/Challenge/index.tsx
index b492ffc8..dcf0a9cd 100644
--- a/layout/Challenges/components/Challenges/Challenge/index.tsx
+++ b/layout/Challenges/components/Challenges/Challenge/index.tsx
@@ -7,7 +7,7 @@ function Action({ text, url }) {
       <Button
         onClick={(e) => (window.location.href = url)}
         title={text}
-        customStyle="text-white bg-primary border-tertiary hover:bg-tertiary"
+        className="text-white bg-primary border-tertiary hover:bg-tertiary"
       />
     </div>
   );
diff --git a/layout/Home/components/Hero/Pitch/index.jsx b/layout/Home/components/Hero/Pitch/index.jsx
index d4d8d0c9..4811e564 100644
--- a/layout/Home/components/Hero/Pitch/index.jsx
+++ b/layout/Home/components/Hero/Pitch/index.jsx
@@ -11,8 +11,8 @@ export default function Pitch() {
         <a href="/team">
           <Button
             title="MEET THE TEAM"
-            customStyle="w-56 h-20 border-2 text-white border-white hover:text-quinary hover:border-quinary"
-            bold={false}
+            className="h-20 w-56 border-2 border-white text-white hover:border-quinary hover:text-quinary"
+            bold={true}
           />
         </a>
       </div>
diff --git a/layout/Home/components/Speakers/index.jsx b/layout/Home/components/Speakers/index.jsx
index 12c38d12..f2a880df 100644
--- a/layout/Home/components/Speakers/index.jsx
+++ b/layout/Home/components/Speakers/index.jsx
@@ -16,7 +16,7 @@ export default function Speakers() {
           <Link href="/speakers">
             <Button
               title="MEET THE SPEAKERS"
-              customStyle="text-white border-white border-4 h-20 w-full hover:border-quinary hover:bg-quinary"
+              className="h-20 w-full border-4 border-white text-white hover:border-quinary hover:bg-quinary"
               bold={true}
             />
           </Link>
diff --git a/layout/Login/components/LoginForm/index.tsx b/layout/Login/components/LoginForm/index.tsx
index 7bd2a561..44b65d88 100644
--- a/layout/Login/components/LoginForm/index.tsx
+++ b/layout/Login/components/LoginForm/index.tsx
@@ -54,7 +54,7 @@ export default function LoginForm() {
           title={isLoading ? "Authenticating..." : "LET'S GO"}
           disabled={isLoading}
           type="submit"
-          customStyle="text-secondary bg-quinary border-quinary w-full h-16"
+          className="h-16 w-full border-quinary bg-quinary text-secondary"
         />
         {errors && <p className="text-center text-failure">{errors}</p>}
       </Form>
diff --git a/layout/Product/Product.tsx b/layout/Product/Product.tsx
index 85131df0..7a3c893c 100644
--- a/layout/Product/Product.tsx
+++ b/layout/Product/Product.tsx
@@ -89,7 +89,7 @@ function ProductSlug() {
                         refetchUser();
                       })
                     }
-                    customStyle="m-auto block h-20 w-full rounded-full bg-quinary hover:opacity-75 disabled:bg-gray-400 disabled:opacity-75"
+                    className="m-auto block h-20 w-full rounded-full bg-quinary hover:opacity-75 disabled:bg-gray-400 disabled:opacity-75"
                     disabled={user.token_balance < product.price}
                     title="REDEEM"
                     description={`${product.price} tokens 💰`}
diff --git a/layout/ResetPassword/components/ResetPasswordForm/index.tsx b/layout/ResetPassword/components/ResetPasswordForm/index.tsx
index 2a942c19..7e64bb43 100644
--- a/layout/ResetPassword/components/ResetPasswordForm/index.tsx
+++ b/layout/ResetPassword/components/ResetPasswordForm/index.tsx
@@ -97,7 +97,7 @@ export default function ResetPasswordForm() {
               <Button
                 type="button"
                 title="BACK TO LOGIN"
-                customStyle="text-secondary bg-quinary border-quinary"
+                className="border-quinary bg-quinary text-secondary"
               />
             </Link>
           </div>
diff --git a/layout/SignUp/components/SignUpForm/index.tsx b/layout/SignUp/components/SignUpForm/index.tsx
index 39a042d2..c2a70b95 100644
--- a/layout/SignUp/components/SignUpForm/index.tsx
+++ b/layout/SignUp/components/SignUpForm/index.tsx
@@ -131,7 +131,7 @@ export default function SignUpForm({ courses }) {
         />
         <Button
           title={scanning ? "STOP SCANNING" : "SCAN QR"}
-          customStyle="w-full h-12 text-secondary bg-quinary border-quinary"
+          className="h-12 w-full border-quinary bg-quinary text-secondary"
           onClick={(e) => {
             e.preventDefault();
             updateScanning(!scanning);
@@ -158,7 +158,7 @@ export default function SignUpForm({ courses }) {
         <Button
           type="submit"
           title={isLoading ? "Registering..." : "LET'S GO"}
-          customStyle="w-full h-12 text-secondary bg-quinary border-quinary"
+          className="h-12 w-full border-quinary bg-quinary text-secondary"
         />
         {(local_error || (!isLoading && errors)) && (
           <p className="mt-3 font-iregular text-lg text-red-400">
diff --git a/layout/Staff/components/StaffRedeemButton/index.jsx b/layout/Staff/components/StaffRedeemButton/index.jsx
index 094e6d5e..5713a190 100644
--- a/layout/Staff/components/StaffRedeemButton/index.jsx
+++ b/layout/Staff/components/StaffRedeemButton/index.jsx
@@ -2,10 +2,7 @@ import Button from "@components/Button";
 export default function StaffRedeemButton() {
   return (
     <div className="mt-8 w-auto">
-      <Button
-        customStyle="m-auto block h-16 w-full rounded-full bg-quinary"
-        title="💰  Redeem prizes"
-      />
+      <Button className="h-16 w-full bg-quinary" title="💰  Redeem prizes" />
     </div>
   );
 }
diff --git a/layout/moonstone/sponsor/dashboard/SponsorBadgeButton/index.jsx b/layout/moonstone/sponsor/dashboard/SponsorBadgeButton/index.jsx
index 5eb272bd..4d2fc207 100644
--- a/layout/moonstone/sponsor/dashboard/SponsorBadgeButton/index.jsx
+++ b/layout/moonstone/sponsor/dashboard/SponsorBadgeButton/index.jsx
@@ -10,10 +10,7 @@ export default function SponsorBadgeButton({ sponsor, all }) {
   );
   return (
     <div className="mt-8 w-auto">
-      <Button
-        customStyle="m-auto block h-16 w-full rounded-full bg-quinary"
-        title="🏅 Dar Badge {text}"
-      />
+      <Button className="h-16 w-full bg-quinary" title="🏅 Dar Badge {text}" />
     </div>
   );
 }
diff --git a/layout/moonstone/sponsor/dashboard/SponsorPrizeButton/index.jsx b/layout/moonstone/sponsor/dashboard/SponsorPrizeButton/index.jsx
index 6fad0b9e..e2e11caf 100644
--- a/layout/moonstone/sponsor/dashboard/SponsorPrizeButton/index.jsx
+++ b/layout/moonstone/sponsor/dashboard/SponsorPrizeButton/index.jsx
@@ -4,7 +4,7 @@ export default function SponsorPrizeButton({ prize }) {
   return (
     <div className="mt-8 w-auto">
       <Button
-        customStyle="m-auto block h-16 w-full rounded-full bg-quinary"
+        className="h-16 w-full bg-quinary"
         title={`🏅  Prémio ${prize}`}
       />
     </div>
diff --git a/layout/moonstone/sponsor/spotlight/SpotlightButton/index.jsx b/layout/moonstone/sponsor/spotlight/SpotlightButton/index.jsx
index 9c518ce8..8523927b 100644
--- a/layout/moonstone/sponsor/spotlight/SpotlightButton/index.jsx
+++ b/layout/moonstone/sponsor/spotlight/SpotlightButton/index.jsx
@@ -3,10 +3,7 @@ import Button from "@components/Button";
 export default function SpotlightButton() {
   return (
     <div className="mt-8 w-auto">
-      <Button
-        customStyle="m-auto block h-16 w-full rounded-full bg-quinary"
-        title="Ativar Spotlight"
-      />
+      <Button className="h-16 w-full bg-quinary" title="Ativar Spotlight" />
     </div>
   );
 }
diff --git a/layout/shared/Leaderboard/Leaderboard.tsx b/layout/shared/Leaderboard/Leaderboard.tsx
index 29a45442..0c92b071 100644
--- a/layout/shared/Leaderboard/Leaderboard.tsx
+++ b/layout/shared/Leaderboard/Leaderboard.tsx
@@ -132,7 +132,7 @@ function Leaderboard() {
         <div className="col-span-1 w-full 2xl:pl-24">
           <div className="flex justify-center gap-6 xs:gap-10 md:gap-24">
             <Button
-              customStyle={`font-iregular bg-${
+              className={`font-iregular bg-${
                 hallOfFame ? "white" : "quinary"
               } h-12 items-center rounded-full px-4 py-1 text-center text-black`}
               onClick={(e) => {
@@ -142,7 +142,7 @@ function Leaderboard() {
             />
 
             <Button
-              customStyle={`font-iregular bg-${
+              className={`font-iregular bg-${
                 hallOfFame ? "quinary" : "white"
               } h-12 items-center rounded-full px-4 py-1 text-center text-black`}
               onClick={(e) => {
diff --git a/pages/register/[uuid].js b/pages/register/[uuid].js
index c4021b34..4ee39ca6 100644
--- a/pages/register/[uuid].js
+++ b/pages/register/[uuid].js
@@ -116,9 +116,9 @@ function Register({ courses }) {
             onChange={(e) => updatePasswordConfirmation(e.currentTarget.value)}
           />
           <Button
-            title="Submit"
-            text={isLoading ? "Registering..." : "LET'S GO"}
-            customStyle="w-full h-12 text-secondary bg-quinary border-quinary"
+            type="submit"
+            title={isLoading ? "Registering..." : "LET'S GO"}
+            className="h-12 w-full border-quinary bg-quinary text-secondary"
           />
           {errors && (
             <p className="mt-3 font-iregular text-lg text-red-400">

From 48d93ef331af19082637cea81d2f9bc441eabd77 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Jo=C3=A3o=20Lobo?=
 <30907944+joaodiaslobo@users.noreply.github.com>
Date: Thu, 7 Dec 2023 16:14:28 +0000
Subject: [PATCH 14/15] feat: fetch event dates from schedule data (#594)

---
 components/Schedule/index.jsx               |  9 +++++++--
 layout/Home/components/Hero/Title/index.tsx | 13 ++++++++++++-
 package-lock.json                           | 11 +++++++++++
 package.json                                |  1 +
 4 files changed, 31 insertions(+), 3 deletions(-)

diff --git a/components/Schedule/index.jsx b/components/Schedule/index.jsx
index 448e6a2a..c37d794f 100644
--- a/components/Schedule/index.jsx
+++ b/components/Schedule/index.jsx
@@ -4,6 +4,8 @@ import Day from "./Day";
 import { useState, useEffect } from "react";
 import { useRouter } from "next/router";
 
+import scheduleData from "/data/schedule.json";
+
 function leapYear(year) {
   return (year % 4 == 0 && year % 100 != 0) || year % 400 == 0;
 }
@@ -87,8 +89,11 @@ function addDate(date, days) {
 }
 
 export default function Schedule(props) {
-  const min_date = "2023/2/14";
-  const max_date = "2023/2/17";
+  /* Fetch first and last day of the event from schedule data */
+  const eventDates = scheduleData.map((day) => day.date).sort();
+  const min_date = eventDates[0];
+  const max_date = eventDates[eventDates.length - 1];
+
   const defaultFilter = props.filters === undefined ? "" : props.filters;
 
   //calculate default date
diff --git a/layout/Home/components/Hero/Title/index.tsx b/layout/Home/components/Hero/Title/index.tsx
index 747a68c2..cef62ab5 100644
--- a/layout/Home/components/Hero/Title/index.tsx
+++ b/layout/Home/components/Hero/Title/index.tsx
@@ -1,10 +1,21 @@
 import TypeWriter from "typewriter-effect";
+import schedule from "@data/schedule.json";
+import dayjs from "dayjs";
 
 export default function Title() {
+  /* Parse event dates info from schedule data */
+  const dates = schedule.map((day) => day.date).sort();
+
+  const firstDayDate = dayjs(dates[0], "YYYY/M/D");
+  const lastDayDate = dayjs(dates[dates.length - 1], "YYYY/M/D");
+
+  const month = firstDayDate.format("MMMM");
+  const year = firstDayDate.format("YYYY");
+
   return (
     <div className="relative z-20 font-bold">
       <h5 className="font-terminal-uppercase m-1 text-2xl text-quinary">
-        14-17 February 2023
+        {firstDayDate.format("D")}-{lastDayDate.format("D")} {month} {year}
       </h5>
       {/* 2xl:leading-[6.5rem] is intended to only work with the following font - Terminal */}
       <h1
diff --git a/package-lock.json b/package-lock.json
index 1175f29a..65e72624 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -16,6 +16,7 @@
         "@heroicons/react": "^1.0.5",
         "@netlify/plugin-nextjs": "^4.40.1",
         "axios": "^1.6.2",
+        "dayjs": "^1.11.10",
         "framer-motion": "^7.5.3",
         "jsqr": "^1.4.0",
         "lottie-web": "^5.8.1",
@@ -2543,6 +2544,11 @@
       "integrity": "sha512-sdQSFB7+llfUcQHUQO3+B8ERRj0Oa4w9POWMI/puGtuf7gFywGmkaLCElnudfTiKZV+NvHqL0ifzdrI8Ro7ESA==",
       "dev": true
     },
+    "node_modules/dayjs": {
+      "version": "1.11.10",
+      "resolved": "https://registry.npmjs.org/dayjs/-/dayjs-1.11.10.tgz",
+      "integrity": "sha512-vjAczensTgRcqDERK0SR2XMwsF/tSvnvlv6VcF2GIhg6Sx4yOIt/irsr1RDJsKiIyBzJDpCoXiWWq28MqH2cnQ=="
+    },
     "node_modules/debug": {
       "version": "4.3.4",
       "resolved": "https://registry.npmjs.org/debug/-/debug-4.3.4.tgz",
@@ -11062,6 +11068,11 @@
       "integrity": "sha512-sdQSFB7+llfUcQHUQO3+B8ERRj0Oa4w9POWMI/puGtuf7gFywGmkaLCElnudfTiKZV+NvHqL0ifzdrI8Ro7ESA==",
       "dev": true
     },
+    "dayjs": {
+      "version": "1.11.10",
+      "resolved": "https://registry.npmjs.org/dayjs/-/dayjs-1.11.10.tgz",
+      "integrity": "sha512-vjAczensTgRcqDERK0SR2XMwsF/tSvnvlv6VcF2GIhg6Sx4yOIt/irsr1RDJsKiIyBzJDpCoXiWWq28MqH2cnQ=="
+    },
     "debug": {
       "version": "4.3.4",
       "resolved": "https://registry.npmjs.org/debug/-/debug-4.3.4.tgz",
diff --git a/package.json b/package.json
index 45bf1fd3..eeac75ed 100644
--- a/package.json
+++ b/package.json
@@ -33,6 +33,7 @@
     "@heroicons/react": "^1.0.5",
     "@netlify/plugin-nextjs": "^4.40.1",
     "axios": "^1.6.2",
+    "dayjs": "^1.11.10",
     "framer-motion": "^7.5.3",
     "jsqr": "^1.4.0",
     "lottie-web": "^5.8.1",

From 96c1c7ebc4be693af446fa15cf681d7f8a9654ce Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Jo=C3=A3o=20Lobo?=
 <30907944+joaodiaslobo@users.noreply.github.com>
Date: Thu, 7 Dec 2023 16:35:17 +0000
Subject: [PATCH 15/15] feat: apply `select-none` to all titles and buttons
 (#593)

---
 components/Badge/index.tsx                                  | 2 +-
 components/BadgeFilter/index.tsx                            | 2 +-
 components/Balance/index.jsx                                | 4 +++-
 components/Button/index.tsx                                 | 2 +-
 components/Footer/index.tsx                                 | 6 +++---
 components/Heading/index.tsx                                | 2 +-
 components/Input/index.tsx                                  | 2 +-
 components/JoinUs/index.jsx                                 | 2 +-
 components/Layout/Layout.tsx                                | 6 +++---
 components/Navbar/index.jsx                                 | 6 +++---
 components/Schedule/Day/index.tsx                           | 2 +-
 components/Schedule/index.jsx                               | 2 +-
 components/Select/index.tsx                                 | 2 +-
 layout/Attendee/Badgedex/Badgedex.tsx                       | 6 +++---
 layout/Attendee/Identifier/Identifier.tsx                   | 2 +-
 layout/Attendee/Inventory/Inventory.tsx                     | 2 +-
 layout/Attendee/Profile/Profile.tsx                         | 6 +++---
 layout/Attendee/Profile/components/CVInput/index.tsx        | 4 ++--
 .../Attendee/Profile/components/CheckpointTracker/index.tsx | 2 +-
 layout/Attendee/Store/components/Product/index.tsx          | 2 +-
 layout/Attendee/Wheel/Wheel.tsx                             | 2 +-
 layout/Attendee/Wheel/components/ListItem3Cols/index.tsx    | 6 ++++--
 layout/Attendee/Wheel/components/ListItem4Cols/index.tsx    | 2 +-
 layout/Attendee/Wheel/components/WheelMessage/index.tsx     | 2 +-
 layout/Attendees/Attendees.tsx                              | 6 ++++--
 layout/Challenges/components/Challenges/Challenge/index.tsx | 2 +-
 layout/Challenges/components/Challenges/index.jsx           | 2 +-
 layout/Challenges/components/Hero/index.jsx                 | 2 +-
 layout/FAQs/FAQs.tsx                                        | 2 +-
 layout/FAQs/components/FindUs/index.tsx                     | 4 ++--
 layout/FAQs/components/Question/index.tsx                   | 6 +++---
 layout/Home/components/Hero/ExpectList/index.jsx            | 2 +-
 layout/Home/components/Hero/Organization/index.jsx          | 1 +
 layout/Home/components/Hero/Pitch/index.jsx                 | 2 +-
 layout/Home/components/Hero/index.tsx                       | 4 ++--
 layout/Home/components/Partners/index.jsx                   | 4 ++--
 layout/Home/components/Speakers/index.jsx                   | 4 ++--
 layout/Home/components/Sponsors/index.jsx                   | 2 +-
 layout/Login/Login.tsx                                      | 2 +-
 layout/Product/Product.tsx                                  | 4 ++--
 layout/Schedule/components/Hero/index.jsx                   | 2 +-
 layout/SignUp/SignUp.tsx                                    | 2 +-
 layout/Speakers/components/Hero/index.jsx                   | 2 +-
 layout/Speakers/components/Schedule/Table/Block/index.jsx   | 4 ++--
 layout/Speakers/components/Schedule/index.jsx               | 2 +-
 layout/Sponsor/Scanner/Scanner.tsx                          | 2 +-
 layout/Sponsor/Visitors/Visitors.tsx                        | 4 ++--
 layout/Staff/Badges/Badges.tsx                              | 4 +++-
 layout/Staff/Identifier/Identifier.tsx                      | 2 +-
 layout/Staff/Prizes/Prizes.tsx                              | 2 +-
 layout/Team/components/Hero/index.jsx                       | 2 +-
 layout/Team/components/Organization/Member/index.jsx        | 1 +
 layout/Team/components/Organization/index.jsx               | 4 ++--
 layout/shared/Leaderboard/Leaderboard.tsx                   | 3 +--
 layout/shared/Leaderboard/components/Table/index.tsx        | 2 +-
 55 files changed, 86 insertions(+), 77 deletions(-)

diff --git a/components/Badge/index.tsx b/components/Badge/index.tsx
index aea56971..f8ad5730 100644
--- a/components/Badge/index.tsx
+++ b/components/Badge/index.tsx
@@ -6,7 +6,7 @@ export default function Badge({ name, id, avatar, tokens, owned }) {
       href={`/badge/${id}`}
       className={`h-full w-full ${owned ? "opacity-100" : "opacity-30"}`}
     >
-      <div>
+      <div className="select-none">
         <img src={avatar} alt={name}></img>
       </div>
       <div className="flex flex-col justify-items-center text-center font-iregular">
diff --git a/components/BadgeFilter/index.tsx b/components/BadgeFilter/index.tsx
index 5a1bfed4..4d40fcb1 100644
--- a/components/BadgeFilter/index.tsx
+++ b/components/BadgeFilter/index.tsx
@@ -6,7 +6,7 @@ export default function BadgeFilter({ onChange }) {
       <select
         id="location"
         name="location"
-        className="mt-1 block w-full rounded-full border-2 border-quinary bg-white py-2 pl-3 pr-10 text-black ring-quinary focus:border-quinary"
+        className="mt-1 block w-full select-none rounded-full border-2 border-quinary bg-white py-2 pl-3 pr-10 text-black ring-quinary focus:border-quinary"
         defaultValue="All"
         onChange={(e) => {
           const badge = badgeTypes.find(
diff --git a/components/Balance/index.jsx b/components/Balance/index.jsx
index 00dcbd19..2324f064 100644
--- a/components/Balance/index.jsx
+++ b/components/Balance/index.jsx
@@ -1,7 +1,9 @@
 export default function Balance({ token_balance, badge_count }) {
   return (
     <div className="text-white lg:grid lg:grid-cols-3">
-      <span className="col-span-1 font-ibold text-xl sm:text-2xl">Balance</span>
+      <span className="col-span-1 select-none font-ibold text-xl sm:text-2xl">
+        Balance
+      </span>
       <div className="col-span-2 flex gap-x-4 lg:flex-row-reverse">
         <span className="text-md font-iregular sm:text-lg">
           💰 {token_balance} tokens
diff --git a/components/Button/index.tsx b/components/Button/index.tsx
index dc0deab6..fb9a1c7e 100644
--- a/components/Button/index.tsx
+++ b/components/Button/index.tsx
@@ -20,7 +20,7 @@ export default function Button({
   return (
     <button
       {...rest}
-      className={`m-auto block rounded-full hover:opacity-75 disabled:bg-gray-400 disabled:opacity-75 ${
+      className={`m-auto block select-none rounded-full hover:opacity-75 disabled:bg-gray-400 disabled:opacity-75 ${
         rest.className || ""
       }`}
     >
diff --git a/components/Footer/index.tsx b/components/Footer/index.tsx
index ec4b5147..e2d8778a 100644
--- a/components/Footer/index.tsx
+++ b/components/Footer/index.tsx
@@ -86,7 +86,7 @@ export default function Footer(props: IFooterProps) {
       ref={observe}
     >
       <div className="flex flex-col justify-between gap-16 py-10 lg:flex-row">
-        <div className="flex items-start justify-center font-ibold lg:justify-start">
+        <div className="flex select-none items-start justify-center font-ibold lg:justify-start">
           <Image
             src="/images/sei-logo.svg"
             width={100}
@@ -101,7 +101,7 @@ export default function Footer(props: IFooterProps) {
           </p>
         </div>
 
-        <div className="mx-2 mt-20 hidden justify-center pb-10 lg:flex">
+        <div className="mx-2 mt-20 hidden select-none justify-center pb-10 lg:flex">
           <Animation
             text={
               props.footerAnimationText != undefined ? (
@@ -116,7 +116,7 @@ export default function Footer(props: IFooterProps) {
         </div>
 
         <div className="flex-2">
-          <div className="grid grid-rows-2 justify-items-center gap-8 whitespace-nowrap font-iregular text-sm text-white lg:grid-cols-2 lg:justify-items-start">
+          <div className="grid select-none grid-rows-2 justify-items-center gap-8 whitespace-nowrap font-iregular text-sm text-white lg:grid-cols-2 lg:justify-items-start">
             <Link
               href="https://2022.seium.org/"
               className="text-white hover:underline"
diff --git a/components/Heading/index.tsx b/components/Heading/index.tsx
index 8d1c95da..763563f3 100644
--- a/components/Heading/index.tsx
+++ b/components/Heading/index.tsx
@@ -7,7 +7,7 @@ export default function Heading({ text, children }: IHeadingProps) {
   return (
     <div className="border-b-solid mb-5 w-full grid-cols-2 overflow-hidden border-b-2 border-slate-400 pb-3">
       <div className="col-span-1 float-left flex h-full font-ibold">
-        <p className="inline-block align-middle font-ibold text-2xl font-bold text-white">
+        <p className="inline-block select-none align-middle font-ibold text-2xl font-bold text-white">
           {text}
         </p>
       </div>
diff --git a/components/Input/index.tsx b/components/Input/index.tsx
index 3f5015a5..6bd3534d 100644
--- a/components/Input/index.tsx
+++ b/components/Input/index.tsx
@@ -28,7 +28,7 @@ export function InputBase({
     <div>
       <label
         htmlFor={id}
-        className={`pl-6 font-iregular text-${fgColor} mt-5 block text-sm`}
+        className={`pl-6 font-iregular text-${fgColor} mt-5 block select-none text-sm`}
       >
         {text}
       </label>
diff --git a/components/JoinUs/index.jsx b/components/JoinUs/index.jsx
index cecc6b0f..c62ad1a1 100644
--- a/components/JoinUs/index.jsx
+++ b/components/JoinUs/index.jsx
@@ -2,7 +2,7 @@ export default function JoinUs(props) {
   return (
     <a
       href="https://sei23.eventbrite.pt"
-      className={`flex h-28 w-28 flex-shrink-0 rotate-15 transform items-center justify-center font-ibold text-xl text-${props.fgColor} bg-${props.button} translate-x-0 rounded-full`}
+      className={`flex h-28 w-28 flex-shrink-0 rotate-15 transform items-center justify-center font-ibold text-xl text-${props.fgColor} bg-${props.button} translate-x-0 select-none rounded-full`}
     >
       Join us 👋
     </a>
diff --git a/components/Layout/Layout.tsx b/components/Layout/Layout.tsx
index 2a82e41b..6619ac00 100644
--- a/components/Layout/Layout.tsx
+++ b/components/Layout/Layout.tsx
@@ -64,7 +64,7 @@ export default function Layout({ title, description, children }: LayoutProps) {
       />
 
       {/* NAVBAR */}
-      <aside className="inset-y-0 hidden w-72 overflow-y-scroll border-r-2 bg-secondary px-8 py-5 lg:fixed lg:flex lg:flex-col">
+      <aside className="inset-y-0 hidden w-72 select-none overflow-y-scroll border-r-2 bg-secondary px-8 py-5 lg:fixed lg:flex lg:flex-col">
         <div className="flex flex-1">
           <nav className="mt-8 flex flex-col">
             <Link href="/" className="pb-8">
@@ -107,7 +107,7 @@ export default function Layout({ title, description, children }: LayoutProps) {
 
       {/* CONTENT */}
       <main className="w-full px-4 pb-6 pt-20 lg:ml-72 lg:px-20">
-        <h2 className="font-ibold text-5xl">{title}</h2>
+        <h2 className="select-none font-ibold text-5xl">{title}</h2>
         <p className="mt-2 font-iregular text-lg">{description}</p>
 
         {children}
@@ -160,7 +160,7 @@ function MobileNavbar({
             leaveTo="-translate-x-full"
             className="z-1 absolute h-full w-full justify-between bg-secondary p-8 "
           >
-            <aside className="flex h-full flex-col justify-between">
+            <aside className="flex h-full select-none flex-col justify-between">
               <div>
                 <div className="flex items-center justify-between">
                   <Link href="/" className="font-iregular text-quinary">
diff --git a/components/Navbar/index.jsx b/components/Navbar/index.jsx
index d710350a..4cebc1c6 100644
--- a/components/Navbar/index.jsx
+++ b/components/Navbar/index.jsx
@@ -53,7 +53,7 @@ export default function Navbar({ bgColor, fgColor, button, children }) {
               <div className="relative z-50 flex flex-auto">
                 <div className="grid w-full grid-cols-4">
                   <Link href="/">
-                    <div className={`${styles.logo} pt-4 lg:pt-8`}>
+                    <div className={`${styles.logo} select-none pt-4 lg:pt-8`}>
                       <Image
                         className="cursor-pointer opacity-60 hover:opacity-100"
                         src="/images/sei-logo.svg"
@@ -64,7 +64,7 @@ export default function Navbar({ bgColor, fgColor, button, children }) {
                     </div>
                   </Link>
                   <div className="col-span-3 hidden justify-self-end lg:block">
-                    <div className="flex">
+                    <div className="flex select-none">
                       <div className="mr-6 grid grid-cols-3 gap-y-4 gap-x-20 pt-4">
                         {navigation.map((item) => (
                           <Link
@@ -160,7 +160,7 @@ export default function Navbar({ bgColor, fgColor, button, children }) {
           </div>
 
           <Disclosure.Panel className={`lg:hidden bg-${bgColor}`}>
-            <div className="relative z-50 min-h-screen object-cover px-2 pt-12">
+            <div className="relative z-50 min-h-screen select-none object-cover px-2 pt-12">
               {navigation.map((item) => (
                 <Disclosure.Button
                   key={item.slug}
diff --git a/components/Schedule/Day/index.tsx b/components/Schedule/Day/index.tsx
index 4ad16e08..0aa354f2 100644
--- a/components/Schedule/Day/index.tsx
+++ b/components/Schedule/Day/index.tsx
@@ -52,7 +52,7 @@ export default function Day(props) {
   );
 
   const Ans = () => (
-    <div className="flex w-full justify-center">
+    <div className="flex w-full select-none justify-center">
       <div className="flex w-full justify-between text-4xl xs:text-5xl sm:text-7xl lg:text-8xl xl:mx-20 xl:text-7xl">
         <div className={`${styles.leftArrow} ${styles.arrowWrapper}`}>
           <button
diff --git a/components/Schedule/index.jsx b/components/Schedule/index.jsx
index c37d794f..d0cd706d 100644
--- a/components/Schedule/index.jsx
+++ b/components/Schedule/index.jsx
@@ -162,7 +162,7 @@ export default function Schedule(props) {
 
   return (
     <div
-      className={`px-5 md:px-32 xl:grid xl:grid-cols-2 xl:px-16 2xl:px-32 bg-${props.color} relative pt-20`}
+      className={`px-5 md:px-32 xl:grid xl:grid-cols-2 xl:px-16 2xl:px-32 bg-${props.color} relative select-none pt-20`}
     >
       <div className="mb-20 xl:mb-0">
         <div className="sticky top-12 z-50">
diff --git a/components/Select/index.tsx b/components/Select/index.tsx
index 2f1f5f7d..bbd8379c 100644
--- a/components/Select/index.tsx
+++ b/components/Select/index.tsx
@@ -34,7 +34,7 @@ export default function Select({
     <div>
       <label
         htmlFor={id}
-        className={`pl-6 font-iregular text-${fgColor} mt-5 block text-sm`}
+        className={`pl-6 font-iregular text-${fgColor} mt-5 block select-none text-sm`}
       >
         {text}
       </label>
diff --git a/layout/Attendee/Badgedex/Badgedex.tsx b/layout/Attendee/Badgedex/Badgedex.tsx
index 12b7b5ba..1b658f8b 100644
--- a/layout/Attendee/Badgedex/Badgedex.tsx
+++ b/layout/Attendee/Badgedex/Badgedex.tsx
@@ -49,13 +49,13 @@ function Badgedex() {
   return (
     <Layout title="BadgeDex" description="Explore all existing badges">
       <div className="border-slate-400 pt-10 text-white xl:flex xl:flex-auto">
-        <div className="m-auto flex flex-auto space-x-5">
+        <div className="m-auto flex flex-auto select-none space-x-5">
           <p className="mb-10 text-2xl font-bold xl:mb-0">Filter by</p>
           <BadgeFilter onChange={updateFilter} />
         </div>
         <div className="flex w-auto font-bold lg:w-1/2 xl:w-auto">
-          <div className="my-auto text-2xl">Show</div>
-          <div className="flex flex-row-reverse gap-x-8">
+          <div className="my-auto select-none text-2xl">Show</div>
+          <div className="flex select-none flex-row-reverse gap-x-8">
             <button
               className={`font-iregular bg-${
                 all ? "white" : "quinary"
diff --git a/layout/Attendee/Identifier/Identifier.tsx b/layout/Attendee/Identifier/Identifier.tsx
index 581cc424..a07114e6 100644
--- a/layout/Attendee/Identifier/Identifier.tsx
+++ b/layout/Attendee/Identifier/Identifier.tsx
@@ -12,7 +12,7 @@ function Identifier() {
       description="Scan this QR Code to identify yourself to the staff"
     >
       <div className="mt-12 grid-cols-2 overflow-hidden">
-        <div className="flex h-full justify-center overflow-hidden rounded-md lg:h-96">
+        <div className="flex h-full select-none justify-center overflow-hidden rounded-md lg:h-96">
           <QRCodeCanvas uuid={user.id} />
         </div>
       </div>
diff --git a/layout/Attendee/Inventory/Inventory.tsx b/layout/Attendee/Inventory/Inventory.tsx
index d3e5f564..05781632 100644
--- a/layout/Attendee/Inventory/Inventory.tsx
+++ b/layout/Attendee/Inventory/Inventory.tsx
@@ -28,7 +28,7 @@ function Inventory() {
       title="Inventory"
       description="Check the prizes that you have accumulated throughout the week"
     >
-      <div className="my-5">
+      <div className="my-5 select-none">
         <button
           className={`font-iregular bg-${
             tab ? "quinary" : "white"
diff --git a/layout/Attendee/Profile/Profile.tsx b/layout/Attendee/Profile/Profile.tsx
index 4f3c9494..4464b19f 100644
--- a/layout/Attendee/Profile/Profile.tsx
+++ b/layout/Attendee/Profile/Profile.tsx
@@ -112,7 +112,7 @@ function Profile({ courses }) {
 
           <Form onSubmit={handleSubmitForm} id="profile-form">
             <div className="pl-6">
-              <div className="relative h-[220px] w-[220px] overflow-hidden rounded-full border-2 border-white hover:border-quinary">
+              <div className="relative h-[220px] w-[220px] select-none overflow-hidden rounded-full border-2 border-white hover:border-quinary">
                 {photoFileUrl == null ? (
                   <img
                     src="/images/mascot-head.png"
@@ -174,7 +174,7 @@ function Profile({ courses }) {
             />
 
             <button
-              className="inline-block h-auto pl-6 pb-5 text-quinary underline"
+              className="inline-block h-auto select-none pl-6 pb-5 text-quinary underline"
               onClick={(e) => {
                 e.preventDefault();
                 onResetPassword();
@@ -251,7 +251,7 @@ function Profile({ courses }) {
           </div>
           <div className="mt-10 text-white">
             <Heading text="Upload CV" />
-            <CVInput cv={user?.cv} onSubmit={submitCV}></CVInput>
+            <CVInput cv={user?.cv} onSubmit={submitCV} />
           </div>
         </div>
       </div>
diff --git a/layout/Attendee/Profile/components/CVInput/index.tsx b/layout/Attendee/Profile/components/CVInput/index.tsx
index d9a9fac4..d7f55914 100644
--- a/layout/Attendee/Profile/components/CVInput/index.tsx
+++ b/layout/Attendee/Profile/components/CVInput/index.tsx
@@ -36,7 +36,7 @@ export default function CVInput({ cv, onSubmit }) {
     <>
       {uploading ? (
         <form onSubmit={handleSubmit} id="cv-form" className="mt-2">
-          <label className="m-auto inline-block w-full cursor-pointer rounded-lg border-2 border-quinary text-center duration-500 hover:bg-quinary hover:opacity-50">
+          <label className="m-auto inline-block w-full cursor-pointer select-none rounded-lg border-2 border-quinary text-center duration-500 hover:bg-quinary hover:opacity-50">
             <BookOpenIcon className="m-auto h-12 w-12 flex-shrink-0" />
 
             <input
@@ -64,7 +64,7 @@ export default function CVInput({ cv, onSubmit }) {
                 &#10003;
               </span>
             </label>
-            <label className="ml-2 text-sm">
+            <label className="ml-2 select-none text-sm">
               By submitting your CV you are consenting to it being shared with
               the companies you visit during the event
             </label>
diff --git a/layout/Attendee/Profile/components/CheckpointTracker/index.tsx b/layout/Attendee/Profile/components/CheckpointTracker/index.tsx
index 3addc0a5..d3af663e 100644
--- a/layout/Attendee/Profile/components/CheckpointTracker/index.tsx
+++ b/layout/Attendee/Profile/components/CheckpointTracker/index.tsx
@@ -15,7 +15,7 @@ function Step({ count, progress, checkpoints }) {
 export default function CheckpointTracker({ checkpoints, progress }) {
   const ml = (progress / checkpoints) * 100 + "%";
   return (
-    <div className="w-80 py-5">
+    <div className="w-80 select-none py-5">
       <div>
         <span className="font-iregular" style={{ marginLeft: ml }}>
           🏁
diff --git a/layout/Attendee/Store/components/Product/index.tsx b/layout/Attendee/Store/components/Product/index.tsx
index 307cf061..6e2dbee3 100644
--- a/layout/Attendee/Store/components/Product/index.tsx
+++ b/layout/Attendee/Store/components/Product/index.tsx
@@ -13,7 +13,7 @@ export default function Product({ name, id, image, price, enabled }) {
           <img
             src={image}
             alt={name}
-            className="h-full w-full object-cover object-center lg:h-full lg:w-full"
+            className="h-full w-full select-none object-cover object-center lg:h-full lg:w-full"
           />
         </div>
       </div>
diff --git a/layout/Attendee/Wheel/Wheel.tsx b/layout/Attendee/Wheel/Wheel.tsx
index 6cbf0c1a..56fa88c4 100644
--- a/layout/Attendee/Wheel/Wheel.tsx
+++ b/layout/Attendee/Wheel/Wheel.tsx
@@ -224,7 +224,7 @@ function WheelPage() {
 
           <div className="mt-10">
             <Heading text="Awards"></Heading>
-            <div className="mb-5 grid w-full grid-cols-6 pb-3">
+            <div className="mb-5 grid w-full select-none grid-cols-6 pb-3">
               <div className="text-center">
                 <p className="text-iregular pr-4">Image</p>
               </div>
diff --git a/layout/Attendee/Wheel/components/ListItem3Cols/index.tsx b/layout/Attendee/Wheel/components/ListItem3Cols/index.tsx
index ddf90cca..6ff2dcc2 100644
--- a/layout/Attendee/Wheel/components/ListItem3Cols/index.tsx
+++ b/layout/Attendee/Wheel/components/ListItem3Cols/index.tsx
@@ -15,14 +15,16 @@ export default function ListItem3Cols({
       <div className="text-left">
         <p className="font-ibold">{user}</p>
       </div>
-      <div className="justify-self-end">
+      <div className="select-none justify-self-end">
         <img src={prize.avatar} className="w-10" />
       </div>
       <div className="col-span-2 ml-4 text-left">
         <p className="text-iregular">{prize.name}</p>
       </div>
       <div className="text-right">
-        <p className="text-ibold pr-4 font-bold text-quinary">{when}</p>
+        <p className="text-ibold select-none pr-4 font-bold text-quinary">
+          {when}
+        </p>
       </div>
     </div>
   );
diff --git a/layout/Attendee/Wheel/components/ListItem4Cols/index.tsx b/layout/Attendee/Wheel/components/ListItem4Cols/index.tsx
index 0df2d83e..562aa040 100644
--- a/layout/Attendee/Wheel/components/ListItem4Cols/index.tsx
+++ b/layout/Attendee/Wheel/components/ListItem4Cols/index.tsx
@@ -10,7 +10,7 @@ export default function ListItem4Cols({
   }
   return (
     <div className={`mb-5 w-full pb-3 ${border} grid grid-cols-6 items-center`}>
-      <div className="justify-self-center">
+      <div className="select-none justify-self-center">
         <img src={img} className="w-6" />
       </div>
       <div className="col-span-3 text-left">
diff --git a/layout/Attendee/Wheel/components/WheelMessage/index.tsx b/layout/Attendee/Wheel/components/WheelMessage/index.tsx
index e5fd699d..2e210bc6 100644
--- a/layout/Attendee/Wheel/components/WheelMessage/index.tsx
+++ b/layout/Attendee/Wheel/components/WheelMessage/index.tsx
@@ -8,7 +8,7 @@ export default function WheelMessage({ title, description, onExit }) {
       <div className="fixed inset-0 z-30 h-full w-screen bg-white opacity-70"></div>
       <Dialog
         open={true}
-        className="fixed top-1/2 left-1/2 z-50 -translate-y-2/4 -translate-x-2/4 overflow-y-auto rounded-3xl border-8 border-secondary bg-white p-10 px-12 drop-shadow-xl"
+        className="fixed top-1/2 left-1/2 z-50 -translate-y-2/4 -translate-x-2/4 select-none overflow-y-auto rounded-3xl border-8 border-secondary bg-white p-10 px-12 drop-shadow-xl"
         onClose={(_) => {}}
       >
         <Dialog.Overlay />
diff --git a/layout/Attendees/Attendees.tsx b/layout/Attendees/Attendees.tsx
index f2f8f7a4..8d765867 100644
--- a/layout/Attendees/Attendees.tsx
+++ b/layout/Attendees/Attendees.tsx
@@ -36,7 +36,7 @@ function Profile() {
         <div className="col-span-1 float-left w-full xl:w-1/2">
           <Heading text="User Profile"></Heading>
           <div className="pl-6">
-            <div className="relative h-[220px] w-[220px] overflow-hidden rounded-full border-2 border-white hover:border-quinary">
+            <div className="relative h-[220px] w-[220px] select-none overflow-hidden rounded-full border-2 border-white hover:border-quinary">
               {attendee.avatar == null ? (
                 <img
                   src="/images/mascot-head.png"
@@ -75,7 +75,9 @@ function Profile() {
       <div className="mt-10">
         <Heading text="Badges"></Heading>
         <div className="mt-5 flex flex-auto space-x-5">
-          <p className="mb-10 text-2xl font-bold xl:mb-0">Filter by</p>
+          <p className="mb-10 select-none text-2xl font-bold xl:mb-0">
+            Filter by
+          </p>
           <BadgeFilter onChange={updateFilter} />
         </div>
         <div className="mt-8 grid grid-cols-1 gap-y-3 sm:grid-cols-2 md:grid-cols-2 lg:grid-cols-4 xl:grid-cols-6">
diff --git a/layout/Challenges/components/Challenges/Challenge/index.tsx b/layout/Challenges/components/Challenges/Challenge/index.tsx
index dcf0a9cd..6371e868 100644
--- a/layout/Challenges/components/Challenges/Challenge/index.tsx
+++ b/layout/Challenges/components/Challenges/Challenge/index.tsx
@@ -41,7 +41,7 @@ export default function Challenge(props: IProps) {
     >
       <div className="sticky top-60">
         <div>
-          <h2 className="font-terminal-uppercase text-3xl text-white md:text-4xl xl:text-5xl">
+          <h2 className="font-terminal-uppercase select-none text-3xl text-white md:text-4xl xl:text-5xl">
             {props.title}
           </h2>
           <p className="mt-10 font-iregular text-white">{props.description}</p>
diff --git a/layout/Challenges/components/Challenges/index.jsx b/layout/Challenges/components/Challenges/index.jsx
index 1a91c3b5..9b03e8d0 100644
--- a/layout/Challenges/components/Challenges/index.jsx
+++ b/layout/Challenges/components/Challenges/index.jsx
@@ -9,7 +9,7 @@ export default function Challenges() {
     <div className="spacing relative z-20 flex w-full flex-col px-40 py-10">
       <div className="mb-24 grid grid-cols-1 gap-20 xl:grid-cols-2">
         <div className="hidden xl:flex">
-          <ul className="font-terminal-uppercase text-xl">
+          <ul className="font-terminal-uppercase select-none text-xl">
             {Object.keys(challenges).map((i) => (
               <li
                 key={i}
diff --git a/layout/Challenges/components/Hero/index.jsx b/layout/Challenges/components/Hero/index.jsx
index bed04b30..9b445cb1 100644
--- a/layout/Challenges/components/Hero/index.jsx
+++ b/layout/Challenges/components/Hero/index.jsx
@@ -8,7 +8,7 @@ const Animation = dynamic(() => import("@components/Animation"), {
 
 export default function Hero() {
   return (
-    <div className=" bg-secondary">
+    <div className=" select-none bg-secondary">
       <div className="spacing relative z-20 md:pb-32">
         <Animation type="2" />
         <div className="pt-2">
diff --git a/layout/FAQs/FAQs.tsx b/layout/FAQs/FAQs.tsx
index 892e10f2..2cda99fb 100644
--- a/layout/FAQs/FAQs.tsx
+++ b/layout/FAQs/FAQs.tsx
@@ -13,7 +13,7 @@ function Faq() {
       <Navbar bgColor="primary" button="quinary" fgColor="white">
         <div className="spacing flex flex-col justify-between bg-primary py-20 lg:h-3/4 lg:flex-row">
           <div className="mb-10 text-white lg:w-2/5">
-            <h1 className="font-terminal-uppercase mb-4 text-4xl font-bold lg:text-6xl">
+            <h1 className="font-terminal-uppercase mb-4 select-none text-4xl font-bold lg:text-6xl">
               Frequently Asked Questions
             </h1>
             <p className="text-lg">
diff --git a/layout/FAQs/components/FindUs/index.tsx b/layout/FAQs/components/FindUs/index.tsx
index b5015166..e60f6bee 100644
--- a/layout/FAQs/components/FindUs/index.tsx
+++ b/layout/FAQs/components/FindUs/index.tsx
@@ -6,7 +6,7 @@ export default function FindUs() {
   return (
     <section className="spacing flex flex-col bg-primary py-20 lg:flex-row lg:justify-between">
       <div className="mb-10 mr-10 flex flex-col text-white">
-        <h2 className="font-terminal-uppercase mb-2 text-6xl">
+        <h2 className="font-terminal-uppercase mb-2 select-none text-6xl">
           How to find us
         </h2>
 
@@ -28,7 +28,7 @@ export default function FindUs() {
           <li className="">Phone: +351 253 604 448</li>
         </ul>
       </div>
-      <div className="w-full lg:w-3/5">
+      <div className="w-full select-none lg:w-3/5">
         <img src="/images/map/location.svg" alt="" />
       </div>
     </section>
diff --git a/layout/FAQs/components/Question/index.tsx b/layout/FAQs/components/Question/index.tsx
index d4b49686..38efc1a1 100644
--- a/layout/FAQs/components/Question/index.tsx
+++ b/layout/FAQs/components/Question/index.tsx
@@ -18,7 +18,7 @@ export default function Question({
 
   return (
     <div className="border-t-2 border-white py-4 text-white">
-      <h2 className="font-terminal-uppercase mb-4 text-2xl md:text-4xl">
+      <h2 className="font-terminal-uppercase mb-4 select-none text-2xl md:text-4xl">
         {title}
       </h2>
       <div
@@ -31,12 +31,12 @@ export default function Question({
       <div className="flex items-center justify-end">
         <Link
           href={href}
-          className="font-terminal-uppercase mr-4 text-sm text-quinary"
+          className="font-terminal-uppercase mr-4 select-none text-sm text-quinary"
         >
           {link}
         </Link>
         <button
-          className="font-terminal-uppercase w-16 transform rounded-full bg-quinary px-2 text-xl text-white transition-transform duration-300 hover:scale-110"
+          className="font-terminal-uppercase w-16 transform select-none rounded-full bg-quinary px-2 text-xl text-white transition-transform duration-300 hover:scale-110"
           onClick={() =>
             setShowQuestion((prevShowQuestion) => !prevShowQuestion)
           }
diff --git a/layout/Home/components/Hero/ExpectList/index.jsx b/layout/Home/components/Hero/ExpectList/index.jsx
index 57954a99..e2476922 100644
--- a/layout/Home/components/Hero/ExpectList/index.jsx
+++ b/layout/Home/components/Hero/ExpectList/index.jsx
@@ -1,7 +1,7 @@
 export default function ExpectList() {
   return (
     <div className="mt-20 w-3/5 text-white sm:mt-0">
-      <h3 className="md:text5xl font-terminal-uppercase text-4xl">
+      <h3 className="md:text5xl font-terminal-uppercase select-none text-4xl">
         What you can expect:
       </h3>
       <ul className="mt-8 list-disc pl-4 font-iregular">
diff --git a/layout/Home/components/Hero/Organization/index.jsx b/layout/Home/components/Hero/Organization/index.jsx
index 7308a5c4..2b89fe36 100644
--- a/layout/Home/components/Hero/Organization/index.jsx
+++ b/layout/Home/components/Hero/Organization/index.jsx
@@ -10,6 +10,7 @@ export default function Organization() {
           width="120"
           height="41"
           alt="CeSIUM"
+          className="select-none"
         />
       </a>
     </div>
diff --git a/layout/Home/components/Hero/Pitch/index.jsx b/layout/Home/components/Hero/Pitch/index.jsx
index 4811e564..b3048322 100644
--- a/layout/Home/components/Hero/Pitch/index.jsx
+++ b/layout/Home/components/Hero/Pitch/index.jsx
@@ -2,7 +2,7 @@ import Button from "@components/Button";
 
 export default function Pitch() {
   return (
-    <div className="xl:9/12 font-terminal-uppercase w-full text-white lg:w-9/12">
+    <div className="xl:9/12 font-terminal-uppercase w-full select-none text-white lg:w-9/12">
       <h2 className="text-4xl font-bold">
         We gather speakers, attract partners and give our imagination wings, all
         for this to be your favorite week.
diff --git a/layout/Home/components/Hero/index.tsx b/layout/Home/components/Hero/index.tsx
index 0d40b5b3..ca55af33 100644
--- a/layout/Home/components/Hero/index.tsx
+++ b/layout/Home/components/Hero/index.tsx
@@ -21,7 +21,7 @@ export default function Hero() {
     <div className="bg-secondary">
       <div className="spacing relative z-40 pb-32">
         <Animation type="1" />
-        <div className="pt-2">
+        <div className="select-none pt-2">
           <Title />
         </div>
         <div className="relative mt-20 grid grid-cols-2">
@@ -36,7 +36,7 @@ export default function Hero() {
             <Organization />
           </div>
           {isAuthenticated || (
-            <div className="absolute right-0 block lg:hidden">
+            <div className="absolute right-0 block select-none lg:hidden">
               <JoinUs button="quinary" fgColor="white" />
             </div>
           )}
diff --git a/layout/Home/components/Partners/index.jsx b/layout/Home/components/Partners/index.jsx
index 959060fd..b15cdeac 100644
--- a/layout/Home/components/Partners/index.jsx
+++ b/layout/Home/components/Partners/index.jsx
@@ -5,13 +5,13 @@ import partners from "/data/partners";
 export default function Partners() {
   return (
     <div className="spacing w-full bg-secondary pt-20 pb-20">
-      <h2 className="font-terminal-uppercase py-10 text-center text-5xl text-white lg:text-6xl">
+      <h2 className="font-terminal-uppercase select-none py-10 text-center text-5xl text-white lg:text-6xl">
         Partners who made this possible
       </h2>
       <div className="my-10 flex flex-wrap items-center justify-center gap-10">
         {partners.map((partner, i) => (
           <div
-            className="m-auto w-40 grayscale filter hover:filter-none"
+            className="m-auto w-40 select-none grayscale filter hover:filter-none"
             key={i}
           >
             <a href={partner.url} target="_blank" rel="noreferrer">
diff --git a/layout/Home/components/Speakers/index.jsx b/layout/Home/components/Speakers/index.jsx
index f2a880df..b22937f0 100644
--- a/layout/Home/components/Speakers/index.jsx
+++ b/layout/Home/components/Speakers/index.jsx
@@ -9,14 +9,14 @@ export default function Speakers() {
   return (
     <div className="spacing flex flex-col justify-around bg-secondary pt-20 lg:flex-row">
       <div className="mb-10 lg:w-1/2">
-        <h2 className="font-terminal-uppercase mb-8 text-4xl text-white xs:text-5xl lg:text-6xl">
+        <h2 className="font-terminal-uppercase mb-8 select-none text-4xl text-white xs:text-5xl lg:text-6xl">
           Here’s a selection of this year’s speakers
         </h2>
         <div className="xs:w-70 w-60 sm:w-80">
           <Link href="/speakers">
             <Button
               title="MEET THE SPEAKERS"
-              className="h-20 w-full border-4 border-white text-white hover:border-quinary hover:bg-quinary"
+              className="h-20 w-full border-4 border-white text-white hover:border-quinary hover:bg-quinary select-none"
               bold={true}
             />
           </Link>
diff --git a/layout/Home/components/Sponsors/index.jsx b/layout/Home/components/Sponsors/index.jsx
index 7176910b..d5761bda 100644
--- a/layout/Home/components/Sponsors/index.jsx
+++ b/layout/Home/components/Sponsors/index.jsx
@@ -21,7 +21,7 @@ export default function Sponsors(props) {
   const [val, setValue] = useState(0);
 
   return (
-    <div className="spacing bg-tertiary py-20 text-white">
+    <div className="spacing select-none bg-tertiary py-20 text-white">
       <h2 className="font-terminal-uppercase flex justify-center py-10 text-center text-4xl xs:text-5xl sm:text-6xl md:text-8xl">
         Our amazing sponsors
       </h2>
diff --git a/layout/Login/Login.tsx b/layout/Login/Login.tsx
index ed36b7ef..015c01b7 100644
--- a/layout/Login/Login.tsx
+++ b/layout/Login/Login.tsx
@@ -15,7 +15,7 @@ import { LoginForm } from "./components";
 
 function Login() {
   return (
-    <div className="min-h-screen overflow-hidden bg-secondary">
+    <div className="min-h-screen select-none overflow-hidden bg-secondary">
       <Return componentStyle="sm:ml-20 mt-20 sm:mt-20" />
       <img
         className="absolute -left-[380px] bottom-0 hidden w-[750px] xl:block"
diff --git a/layout/Product/Product.tsx b/layout/Product/Product.tsx
index 7a3c893c..1566b7f9 100644
--- a/layout/Product/Product.tsx
+++ b/layout/Product/Product.tsx
@@ -41,7 +41,7 @@ function ProductSlug() {
       <div className="bg-primary">
         <div className="mx-auto max-w-2xl py-16 px-4 sm:py-24 sm:px-6 lg:grid lg:max-w-7xl lg:grid-cols-2 lg:gap-x-8 lg:px-8">
           {/* Product details */}
-          <div className="lg:max-w-lg lg:self-end">
+          <div className="select-none lg:max-w-lg lg:self-end">
             <Link
               href="/attendee/store"
               className="text-center font-imedium text-quinary"
@@ -68,7 +68,7 @@ function ProductSlug() {
               <img
                 src={product.image}
                 alt={product.name}
-                className="h-full w-full object-cover object-center"
+                className="h-full w-full select-none object-cover object-center"
               />
             </div>
           </div>
diff --git a/layout/Schedule/components/Hero/index.jsx b/layout/Schedule/components/Hero/index.jsx
index 054ed147..c5aeddd7 100644
--- a/layout/Schedule/components/Hero/index.jsx
+++ b/layout/Schedule/components/Hero/index.jsx
@@ -9,7 +9,7 @@ const Animation = dynamic(() => import("@components/Animation"), {
 export default function Hero() {
   return (
     <div className="bg-tertiary">
-      <div className="spacing relative z-20 pb-32">
+      <div className="spacing relative z-20 select-none pb-32">
         <Animation type="3" />
         <div className="pt-2">
           <Title />
diff --git a/layout/SignUp/SignUp.tsx b/layout/SignUp/SignUp.tsx
index 52171290..8418bd54 100644
--- a/layout/SignUp/SignUp.tsx
+++ b/layout/SignUp/SignUp.tsx
@@ -11,7 +11,7 @@ import Text from "@layout/moonstone/authentication/Text";
 
 function Signup({ courses }) {
   return (
-    <div className="min-h-screen overflow-hidden bg-secondary">
+    <div className="min-h-screen select-none overflow-hidden bg-secondary">
       <Return componentStyle="sm:ml-14 mt-10 sm:mt-20 mb-6" />
       <div className="flex flex-col items-center justify-center sm:mt-16">
         <Title text="Sign up" />
diff --git a/layout/Speakers/components/Hero/index.jsx b/layout/Speakers/components/Hero/index.jsx
index 4f61ac79..fa5ebe2e 100644
--- a/layout/Speakers/components/Hero/index.jsx
+++ b/layout/Speakers/components/Hero/index.jsx
@@ -8,7 +8,7 @@ const Animation = dynamic(() => import("@components/Animation"), {
 
 export default function Hero() {
   return (
-    <div className="spacing bg-secondary pb-40">
+    <div className="spacing select-none bg-secondary pb-40">
       <div className="relative z-20">
         <Animation type="2" />
         <div className="pt-2">
diff --git a/layout/Speakers/components/Schedule/Table/Block/index.jsx b/layout/Speakers/components/Schedule/Table/Block/index.jsx
index 34af5668..45527f0e 100644
--- a/layout/Speakers/components/Schedule/Table/Block/index.jsx
+++ b/layout/Speakers/components/Schedule/Table/Block/index.jsx
@@ -27,7 +27,7 @@ export default function Block({
   return (
     <div key={id} className="border-t-2 border-white py-4 text-white">
       <div className="mb-2 flex">
-        <div className="w-[210px]">
+        <div className="w-[210px] select-none">
           <Image
             src={`/images/speakers/${id}.png`}
             width="210"
@@ -78,7 +78,7 @@ export default function Block({
             </div>
           </div>
 
-          <div className="z-50 flex items-center justify-end">
+          <div className="z-50 flex select-none items-center justify-end">
             <p className="grow text-gray-400">{talk}</p>
             {description && (
               <button
diff --git a/layout/Speakers/components/Schedule/index.jsx b/layout/Speakers/components/Schedule/index.jsx
index ec4ecb75..e8842698 100644
--- a/layout/Speakers/components/Schedule/index.jsx
+++ b/layout/Speakers/components/Schedule/index.jsx
@@ -107,7 +107,7 @@ export default function Schedule(props) {
 
   return (
     <section className="spacing relative bg-secondary pb-20 lg:pt-10 2xl:grid 2xl:grid-cols-2">
-      <div className="relative z-50 mb-10 grid place-items-center text-white sm:flex sm:flex-col md:mr-10 md:place-items-start">
+      <div className="relative z-50 mb-10 grid select-none place-items-center text-white sm:flex sm:flex-col md:mr-10 md:place-items-start">
         <Day date={date} previousDay={previous_day} nextDay={next_day} />
         <p className="text-md mt-10 w-5/6 font-iregular md:px-20">
           During this week, you have the opportunity to interact with many
diff --git a/layout/Sponsor/Scanner/Scanner.tsx b/layout/Sponsor/Scanner/Scanner.tsx
index 1d28bc00..95d4f49f 100644
--- a/layout/Sponsor/Scanner/Scanner.tsx
+++ b/layout/Sponsor/Scanner/Scanner.tsx
@@ -48,7 +48,7 @@ const SponsorBadges: React.FC = () => {
       title="Scanner"
       description="Recompensa os teus visitantes com o badge"
     >
-      <div className="mt-5">
+      <div className="mt-5 select-none">
         <QRScanner
           handleCode={handleUUID}
           pauseRef={pauseRef}
diff --git a/layout/Sponsor/Visitors/Visitors.tsx b/layout/Sponsor/Visitors/Visitors.tsx
index 55b95db0..7691392c 100644
--- a/layout/Sponsor/Visitors/Visitors.tsx
+++ b/layout/Sponsor/Visitors/Visitors.tsx
@@ -64,7 +64,7 @@ const SponsorVisitors: React.FC = () => {
       <div className="mt-5 h-screen text-white">
         {visitors.filter((v) => v.cv != null).length > 0 && (
           <button
-            className="m-auto mb-5 block rounded-full bg-quinary px-5 py-2 font-ibold text-2xl text-white"
+            className="m-auto mb-5 block select-none rounded-full bg-quinary px-5 py-2 font-ibold text-2xl text-white"
             onClick={downloadCVs}
           >
             {downloading ? "Downloading" : "Download All CV's"}
@@ -79,7 +79,7 @@ const SponsorVisitors: React.FC = () => {
               <img
                 alt={visitor.name}
                 src={visitor.avatar}
-                className="mb-2 h-40 w-40 rounded-full border-2 border-white object-cover hover:border-pink-500"
+                className="mb-2 h-40 w-40 select-none rounded-full border-2 border-white object-cover hover:border-pink-500"
               />
               <p className="text-center">{visitor.name}</p>
               <p className="text-center">{visitor.email}</p>
diff --git a/layout/Staff/Badges/Badges.tsx b/layout/Staff/Badges/Badges.tsx
index 0cfc9ae5..fc372715 100644
--- a/layout/Staff/Badges/Badges.tsx
+++ b/layout/Staff/Badges/Badges.tsx
@@ -86,7 +86,9 @@ function Badges() {
         <>
           <div className="pt-10 text-white xl:flex xl:flex-auto">
             <div className="flex flex-auto space-x-5">
-              <p className="mb-10 text-2xl font-bold xl:mb-0">Filter by</p>
+              <p className="mb-10 select-none text-2xl font-bold xl:mb-0">
+                Filter by
+              </p>
 
               <Filter onChange={updateFilter} />
             </div>
diff --git a/layout/Staff/Identifier/Identifier.tsx b/layout/Staff/Identifier/Identifier.tsx
index 7e2009d3..900d0a40 100644
--- a/layout/Staff/Identifier/Identifier.tsx
+++ b/layout/Staff/Identifier/Identifier.tsx
@@ -50,7 +50,7 @@ function Identifier() {
 
   return (
     <Layout title="Identifier" description="Identify an attendee">
-      <div className="mt-5">
+      <div className="mt-5 select-none">
         <QRScanner
           handleCode={handleUUID}
           pauseRef={pauseRef}
diff --git a/layout/Staff/Prizes/Prizes.tsx b/layout/Staff/Prizes/Prizes.tsx
index 3cc516a5..4c9e76e4 100644
--- a/layout/Staff/Prizes/Prizes.tsx
+++ b/layout/Staff/Prizes/Prizes.tsx
@@ -19,7 +19,7 @@ function Prizes() {
 
   return (
     <Layout title="Prizes" description="Mark a prize as redeemed">
-      <div className="mt-5">
+      <div className="mt-5 select-none">
         <QRScanner
           handleCode={handleUUID}
           pauseRef={pauseRef}
diff --git a/layout/Team/components/Hero/index.jsx b/layout/Team/components/Hero/index.jsx
index aa6f93f4..1eff9efd 100644
--- a/layout/Team/components/Hero/index.jsx
+++ b/layout/Team/components/Hero/index.jsx
@@ -9,7 +9,7 @@ const Animation = dynamic(() => import("@components/Animation"), {
 
 export default function Hero() {
   return (
-    <div className="spacing bg-primary">
+    <div className="spacing select-none bg-primary">
       <div className="relative z-50">
         <Animation type="1" />
         <div className="pt-2">
diff --git a/layout/Team/components/Organization/Member/index.jsx b/layout/Team/components/Organization/Member/index.jsx
index 77baf39a..9934211d 100644
--- a/layout/Team/components/Organization/Member/index.jsx
+++ b/layout/Team/components/Organization/Member/index.jsx
@@ -22,6 +22,7 @@ export default function Member({
         width="210"
         height="210"
         alt={name}
+        className="select-none"
       />
       <p className="text-md font-terminal-uppercase mb-1"> {name} </p>
       <div className="flex">
diff --git a/layout/Team/components/Organization/index.jsx b/layout/Team/components/Organization/index.jsx
index 5850ba96..f318cb25 100644
--- a/layout/Team/components/Organization/index.jsx
+++ b/layout/Team/components/Organization/index.jsx
@@ -53,7 +53,7 @@ export default function Organization() {
   return (
     <section className="spacing grid grid-cols-1 gap-x-32 gap-y-8 bg-primary py-20 lg:grid-cols-2">
       <div className="text-white">
-        <h2 className="font-terminal-uppercase mb-4 text-4xl font-bold">
+        <h2 className="font-terminal-uppercase mb-4 select-none text-4xl font-bold">
           Organization
         </h2>
         <p className="font-imedium">
@@ -73,7 +73,7 @@ export default function Organization() {
         list={sortListMembers(team["marketing"].list).slice(0, 2)}
       />
 
-      <div className="hidden items-center justify-center lg:flex">
+      <div className="hidden select-none items-center justify-center lg:flex">
         <Animation />
       </div>
 
diff --git a/layout/shared/Leaderboard/Leaderboard.tsx b/layout/shared/Leaderboard/Leaderboard.tsx
index 0c92b071..26a3d7af 100644
--- a/layout/shared/Leaderboard/Leaderboard.tsx
+++ b/layout/shared/Leaderboard/Leaderboard.tsx
@@ -121,10 +121,9 @@ function Leaderboard() {
               previousDay={previous_day}
               nextDay={next_day}
               fontSize="lg"
-              className=""
             />
           ) : (
-            <h2 className="font-terminal-uppercase text-center text-4xl text-quinary xs:text-5xl sm:text-7xl md:text-8xl">
+            <h2 className="font-terminal-uppercase select-none text-center text-4xl text-quinary xs:text-5xl sm:text-7xl md:text-8xl">
               All Time
             </h2>
           )}
diff --git a/layout/shared/Leaderboard/components/Table/index.tsx b/layout/shared/Leaderboard/components/Table/index.tsx
index fe57fe53..b3067077 100644
--- a/layout/shared/Leaderboard/components/Table/index.tsx
+++ b/layout/shared/Leaderboard/components/Table/index.tsx
@@ -59,7 +59,7 @@ export default function Table({ list, user, maxUsersToShow }) {
 
   return (
     <div className="overflow-hidden">
-      <div className="mt-12 h-8 grid-cols-3 pt-2 ">
+      <div className="mt-12 h-8 select-none grid-cols-3 pt-2">
         <div className="col-span-1 float-left w-1/3 text-left font-iregular">
           Rank
         </div>