From 5f7be5a018273adaf053ceaa0f721021063266ee Mon Sep 17 00:00:00 2001
From: Jared Drueco <drueco03@gmail.com>
Date: Sat, 6 Jan 2024 12:13:47 -0700
Subject: [PATCH] Tailwind config setup + init landing page

---
 frontend/src/App.jsx                   |  2 ++
 frontend/src/views/landing/Landing.jsx | 20 ++++++++++++++++++++
 frontend/tailwind.config.js            | 10 +++++++++-
 3 files changed, 31 insertions(+), 1 deletion(-)
 create mode 100644 frontend/src/views/landing/Landing.jsx

diff --git a/frontend/src/App.jsx b/frontend/src/App.jsx
index 64279ef..d0251aa 100644
--- a/frontend/src/App.jsx
+++ b/frontend/src/App.jsx
@@ -1,5 +1,6 @@
 import { BrowserRouter, Routes, Route } from 'react-router-dom';
 
+import Landing from './views/landing/Landing';
 import PatientHome from './views/patient/PatientHome';
 import PractitionerDashboard from './views/practitioner/PractitionerDashboard';
 
@@ -7,6 +8,7 @@ const App = () => {
   return (
     <BrowserRouter>
       <Routes>
+        <Route path="/" element={<Landing />} />
         <Route path="/patient/:patientID" element={<PatientHome />} />
         <Route path="/practitioner/dashboard" element={<PractitionerDashboard />} />
       </Routes>
diff --git a/frontend/src/views/landing/Landing.jsx b/frontend/src/views/landing/Landing.jsx
new file mode 100644
index 0000000..0f3adca
--- /dev/null
+++ b/frontend/src/views/landing/Landing.jsx
@@ -0,0 +1,20 @@
+import { Link } from 'react-router-dom';
+
+const Landing = () => {
+  return (
+    <div className="min-h-screen bg-white dark:bg-dark-teal flex flex-col text-dark-teal dark:text-white items-center justify-center">
+      <h1 className="text-4xl font-bold mb-6">Welcome to MobilityMate</h1>
+      <p className="text-lg  mb-4">Your companion for physiotherapy and mobility exercises.</p>
+      <div className="flex space-x-4">
+        <Link to="/patient/home" className="px-6 py-2 bg-blue-500 text-white rounded hover:bg-blue-700 transition duration-300">
+          Patient Area
+        </Link>
+        <Link to="/practitioner/dashboard" className="px-6 py-2 bg-green-500 text-white rounded hover:bg-green-700 transition duration-300">
+          Practitioner Area
+        </Link>
+      </div>
+    </div>
+  );
+};
+
+export default Landing;
\ No newline at end of file
diff --git a/frontend/tailwind.config.js b/frontend/tailwind.config.js
index d37737f..cbe04a7 100644
--- a/frontend/tailwind.config.js
+++ b/frontend/tailwind.config.js
@@ -4,8 +4,16 @@ export default {
     "./index.html",
     "./src/**/*.{js,ts,jsx,tsx}",
   ],
+  darkMode: 'media',
   theme: {
-    extend: {},
+    extend: {
+      colors: {
+        'dark-teal': '#022B3A',
+        'light-teal': '#1F7A8C',
+        'baby-blue': '#BFDBF7',
+        'smooth-gray': '#E1E5F2',
+      },
+    },
   },
   plugins: [],
 }