feat: add faq page

client/src/components/FAQItem.tsx

@@ -0,0 +1,18 @@
+type FAQItem = {
+    question: string;
+    answer: string;
+};
+
+type Props = {
+    stats: FAQItem;
+}
+
+export default function FAQItem({ stats }: Props) { 
+
+    return(
+        <div className="mb-8">
+            <h2 className="text-xl font-bold mb-2">{stats.question}</h2>
+            <p className="text-lg mb-4">{stats.answer}</p>
+        </div>
+    );
+}

client/src/components/Navbar.tsx

@@ -17,6 +17,7 @@ export default function Navbar() {
           <NavLink to="/events" className={linkClass}>events</NavLink>
           <NavLink to="/sign-up" className={linkClass}>Sign Up</NavLink>
           <NavLink to="/gallery" className={linkClass}>Gallery</NavLink>
+          <NavLink to="/FAQ" className={linkClass}>FAQ</NavLink>
         </div>
       </div>
     </nav>

client/src/main.tsx

@@ -14,6 +14,7 @@ import Gallery from './pages/Gallery'
 import Team from "./pages/Team";
 import Contact from "./pages/Contact";
 import Sponsors from "./pages/Sponsors";
+import FAQ from './pages/Frequent-Asked-Question'
 
 {/* project team imports */}
 import Pruna from "./pages/project-team/Pruna"
@@ -33,6 +34,7 @@ const router = createBrowserRouter([
       { path: 'project-team',    element: <ProjectTeam /> },
       { path: 'sign-up',         element: <SignUp />},
       { path: 'gallery',         element: <Gallery />},
+      { path: 'faq',             element: <FAQ /> },
       { path: "contact", element: <Contact /> },
       { path: "sponsors", element: <Sponsors />},
 

client/src/pages/Frequent-Asked-Question.tsx

@@ -0,0 +1,52 @@
+import FAQItem from "../components/FAQItem";
+import { useEffect } from "react";
+
+
+export default function FrequentAskedQuestions(){
+    useEffect(() => {
+            document.title = "FAQ | UMSA";
+            }, []);
+
+    return(
+
+        <>
+        <h1 className="text-3xl font-bold mb-8">Frequently Asked Questions</h1>
+
+        <div className="columns-1 md:columns-2 gap-8">
+            <FAQItem
+                stats = {{
+                    question: "Does it cost to join UMSA?",
+                    answer: "The price to join UMSA is $8 - for both new and returning members.",
+                }}/>
+            <FAQItem
+                stats = {{
+                    question: "How do I become a member of UMSA?",
+                    answer: "Shoot an e-mail to our helpful communication officers at comm.umsanz@gmail.com and we will be more the merrier to help you get things sorted out. You can also sign up online! Simply click on this link, and follow the step-by-step guide, and you're good to go! During the first week of every new semester, catch our booth at the University of Auckland's club expo.",
+                }}/>
+            <FAQItem
+                stats = {{
+                    question: "I'm not Malaysian, can I still join?",
+                    answer: "The more the merrier! You do not have to be a Malaysian to join the UMSA family. We happily welcome people from all cultures and backgrounds.",
+                }}/>
+            <FAQItem
+                stats = {{
+                    question: "I'm not Malaysian, can I still join?",
+                    answer: "The more the merrier! You do not have to be a Malaysian to join the UMSA family. We happily welcome people from all cultures and backgrounds.",
+                }}/>
+            <FAQItem
+                stats = {{
+                    question: "I'm not a UOA student, can I still join?",
+                    answer: "Absolutely! In fact, invite any other friends outside of the University of Auckland to join the family as well!",
+                }}/>
+            <FAQItem
+            stats = {{
+                question: "How do I find out or keep myself updated on UMSA's events?",
+                answer: "Make sure to follow our social media platforms! Keep yourself updated by checking UMSA's website, Facebook and Instagram constantly. We will be updating you with up-coming events, opportunities and what is going on with the community."
+            }}
+            />
+
+
+        </div>
+        </>
+    )
+}