From 606e77b1ac584aeb78a235c8343c54b26a10cccc Mon Sep 17 00:00:00 2001
From: Luke Liew Mouawad <ec22711@qmul.ac.uk>
Date: Mon, 1 Apr 2024 16:46:14 +0100
Subject: [PATCH 01/22] redesigning the line manager search

---
 .../Line_Manager_Home_Page/ConsultantCard.js  | 12 +++++
 .../ConsultantCard.module.css                 | 32 +++++++++++++
 .../ConsultantFinder.js                       | 39 +++++++++------
 .../ConsultantFinder.module.css               | 48 +++++++++++++++++++
 4 files changed, 116 insertions(+), 15 deletions(-)
 create mode 100644 frontend/src/Components/Line_Manager_Home_Page/ConsultantCard.js
 create mode 100644 frontend/src/Components/Line_Manager_Home_Page/ConsultantCard.module.css
 create mode 100644 frontend/src/Components/Line_Manager_Home_Page/ConsultantFinder.module.css

diff --git a/frontend/src/Components/Line_Manager_Home_Page/ConsultantCard.js b/frontend/src/Components/Line_Manager_Home_Page/ConsultantCard.js
new file mode 100644
index 00000000..51710e77
--- /dev/null
+++ b/frontend/src/Components/Line_Manager_Home_Page/ConsultantCard.js
@@ -0,0 +1,12 @@
+import styles from './ConsultantCard.module.css';
+
+export default function ConsultantCard (props) {
+    return(
+    <div className={styles.cardContainer}>
+        <figure>
+            <img className={styles.userIcon} src="/user_icon.png"/>
+        </figure>
+        <h2 className={styles.name}>{props.name}</h2>
+        <button className={styles.viewTimesheetBtn}>View Timesheet</button>
+    </div>)
+}
\ No newline at end of file
diff --git a/frontend/src/Components/Line_Manager_Home_Page/ConsultantCard.module.css b/frontend/src/Components/Line_Manager_Home_Page/ConsultantCard.module.css
new file mode 100644
index 00000000..1a3784cc
--- /dev/null
+++ b/frontend/src/Components/Line_Manager_Home_Page/ConsultantCard.module.css
@@ -0,0 +1,32 @@
+.cardContainer{
+    background-color: #AEAEAE;
+    padding: 1em;
+    width: 40%;
+    height: 15em;    
+    border-radius: 1.5em;
+    box-shadow: -0.2em 0.2em 0.2em hsla(0, 0%, 24%, 0.753);
+    position: absolute;
+}
+
+.userIcon{
+    width: 95%;
+}
+
+.name{
+    color: black;
+    position: absolute;
+    top: 50%;
+    left: 19%;
+}
+
+.viewTimesheetBtn{
+    background-color: #D9D9D9;
+    border: none;
+    border-radius: 1.25em;
+    padding: 0.55em;
+    font-size: 1em;
+    position: absolute;
+    top: 75%;
+    left: 20%;
+    cursor: pointer;
+}
\ No newline at end of file
diff --git a/frontend/src/Components/Line_Manager_Home_Page/ConsultantFinder.js b/frontend/src/Components/Line_Manager_Home_Page/ConsultantFinder.js
index 1dffdc08..ee7ffa9e 100644
--- a/frontend/src/Components/Line_Manager_Home_Page/ConsultantFinder.js
+++ b/frontend/src/Components/Line_Manager_Home_Page/ConsultantFinder.js
@@ -1,5 +1,7 @@
 import { useState } from "react"
 import { Link } from "react-router-dom";
+import styles from './ConsultantFinder.module.css';
+import ConsultantCard from "./ConsultantCard";
 
 //bunch of placeholder names
 const consultantPlaceholderNames = [
@@ -34,21 +36,28 @@ function ConsultantFinder() {
       };
 
     return(
-        <div id="search">
-            <input type="search"
-            value={search}
-            onChange={handleSearchChange}></input>
-            <p>My Consultants</p>
-            <ul>
-                {search === '' ? (
-                    consultantPlaceholderNames.map((result, index) => (
-                    <li><Link key={index}>{result}</Link></li> 
-                ))
-                ) : (
-                    searchResults.map((result, index) => (
-                    <li><Link key={index}>{result}</Link></li> 
-                )))}
-            </ul>
+        <div className={styles.pageContainer}>
+            <div className={styles.searchContainer}>
+                <h2 className={styles.searchTitle}>Search Consultant</h2>
+                <input type="search"
+                value={search}
+                onChange={handleSearchChange}
+                className={styles.searchBox}></input>
+            </div>
+
+            <div className={styles.searchResultsContainer}>
+                <p className={styles.myConsultantsTitle}>My Consultants</p>
+                <ul className={styles.searchResults}>
+                    {search === '' ? (
+                        consultantPlaceholderNames.map((result, index) => (
+                        <li><Link key={index}>{result}</Link></li> 
+                    ))
+                    ) : (
+                        searchResults.map((result, index) => (
+                        <li><ConsultantCard name={result} key={index}></ConsultantCard></li> 
+                    )))}
+                </ul>
+            </div>
         </div>
     )
 }
diff --git a/frontend/src/Components/Line_Manager_Home_Page/ConsultantFinder.module.css b/frontend/src/Components/Line_Manager_Home_Page/ConsultantFinder.module.css
new file mode 100644
index 00000000..7bf5e5c2
--- /dev/null
+++ b/frontend/src/Components/Line_Manager_Home_Page/ConsultantFinder.module.css
@@ -0,0 +1,48 @@
+.pageContainer{
+    display: flex;
+    flex-direction: column;
+}
+
+.searchContainer{
+    background-color: white;
+    display: flex;
+    flex-direction: column;
+    width: 25%;
+    position: absolute;
+    left: 37.5%;
+}
+
+.searchBox{
+    background-color: #012E6E;
+    position: absolute;
+    bottom: 18%;
+    left: 15%;
+    width: 70%;
+    padding: 0.8em;
+    color: white;
+    border: none;
+}
+
+.searchTitle{
+    color: black;
+    text-align: center;
+}
+
+.searchResults{
+    list-style-type: none;
+}
+
+.searchResultsContainer{
+    width: 25%;
+    position: absolute;
+    left: 37.5%;
+    top: 40%;
+}
+
+.myConsultantsTitle{
+    text-align: center;
+    position: absolute;
+    left: 38%;
+    top: -20%;
+}
+

From 937a8aeabcaee86e8c9a5b052a9b77ef0da784a8 Mon Sep 17 00:00:00 2001
From: Luke Liew Mouawad <ec22711@qmul.ac.uk>
Date: Tue, 2 Apr 2024 01:45:24 +0100
Subject: [PATCH 02/22] fetch data from endpoint for timesheet viewing

---
 .../ConsultantCard.module.css                 |  1 +
 .../View_Timesheet_Page/TimesheetTable.js     | 27 +++++++++++++++++++
 2 files changed, 28 insertions(+)

diff --git a/frontend/src/Components/Line_Manager_Home_Page/ConsultantCard.module.css b/frontend/src/Components/Line_Manager_Home_Page/ConsultantCard.module.css
index 1a3784cc..206ea6c3 100644
--- a/frontend/src/Components/Line_Manager_Home_Page/ConsultantCard.module.css
+++ b/frontend/src/Components/Line_Manager_Home_Page/ConsultantCard.module.css
@@ -17,6 +17,7 @@
     position: absolute;
     top: 50%;
     left: 19%;
+    text-align: center;
 }
 
 .viewTimesheetBtn{
diff --git a/frontend/src/Components/View_Timesheet_Page/TimesheetTable.js b/frontend/src/Components/View_Timesheet_Page/TimesheetTable.js
index 8c429329..d78b82af 100644
--- a/frontend/src/Components/View_Timesheet_Page/TimesheetTable.js
+++ b/frontend/src/Components/View_Timesheet_Page/TimesheetTable.js
@@ -1,6 +1,33 @@
 import styles from './TimesheetTable.module.css';
+import { useState, useEffect } from 'react';
 
 export default function TimesheetTable() {
+
+    const [timesheets, setTimesheets] = useState([]);
+      
+    useEffect(() => {
+        fetch('http://127.0.0.1:5000/list_weekly_timesheets', {
+                method: "GET",
+                headers: { "Content-Type": "application/json" },
+                credentials: 'include',
+            }).then(response => {
+                if (response.ok) {
+                    return response.json();
+                } 
+                else {
+                    throw new Error('User Creation Failed with Status: ' + response.status);
+                }
+            }).then(data => {
+                // Data fetched successfully
+                console.log(data)
+                setTimesheets(data);
+            }).catch(error => {
+                console.error(error);
+            });
+    }, []);
+
+    console.log("stored stuff:",timesheets)
+
     return(
         <div>
             <table className={styles.timesheetTable}>

From cf163eda64ce27ca9183819e43dfd177f8f06156 Mon Sep 17 00:00:00 2001
From: Luke Liew Mouawad <ec22711@qmul.ac.uk>
Date: Tue, 2 Apr 2024 21:21:01 +0100
Subject: [PATCH 03/22] view timesheet page now displays data for days in the
 table

---
 .../View_Timesheet_Page/TimesheetTable.js     | 134 ++++++++++--------
 .../ViewTimesheetHeader.js                    |   4 +-
 .../Consultant/view_current_timesheet_page.js |   4 +-
 3 files changed, 75 insertions(+), 67 deletions(-)

diff --git a/frontend/src/Components/View_Timesheet_Page/TimesheetTable.js b/frontend/src/Components/View_Timesheet_Page/TimesheetTable.js
index d78b82af..ac553f41 100644
--- a/frontend/src/Components/View_Timesheet_Page/TimesheetTable.js
+++ b/frontend/src/Components/View_Timesheet_Page/TimesheetTable.js
@@ -1,79 +1,89 @@
+import ViewTimesheetHeader from "../../Components/View_Timesheet_Page/ViewTimesheetHeader";
 import styles from './TimesheetTable.module.css';
 import { useState, useEffect } from 'react';
 
 export default function TimesheetTable() {
 
     const [timesheets, setTimesheets] = useState([]);
+
+    var arrayOfDays = []
+    var daysOfWeek = ["Sunday", "Monday", "Tuesday", "Wednesday", "Thursday", "Friday", "Saturday"];
+
       
     useEffect(() => {
-        fetch('http://127.0.0.1:5000/list_weekly_timesheets', {
-                method: "GET",
-                headers: { "Content-Type": "application/json" },
-                credentials: 'include',
-            }).then(response => {
-                if (response.ok) {
-                    return response.json();
-                } 
-                else {
-                    throw new Error('User Creation Failed with Status: ' + response.status);
-                }
-            }).then(data => {
-                // Data fetched successfully
-                console.log(data)
-                setTimesheets(data);
-            }).catch(error => {
-                console.error(error);
-            });
+        const fetchData = async () =>{
+            try{
+                await fetch('http://127.0.0.1:5000/list_weekly_timesheets', {
+                        method: "GET",
+                        headers: { "Content-Type": "application/json" },
+                        credentials: 'include',
+                    }).then(response => {
+                        if (response.ok) {
+                            return response.json();
+                        } 
+                        else {
+                            throw new Error('User Creation Failed with Status: ' + response.status);
+                        }
+                    }).then(data => {
+                        // Data fetched successfully
+                        console.log(data)
+                        setTimesheets(data);
+                    }).catch(error => {
+                        console.error(error);
+                    });
+            } catch(error) {
+                console.log("error fetching data")
+            }
+        };
+        fetchData();
     }, []);
 
+    if(timesheets === null) {
+        return(
+            <p>Loading data</p>
+        )
+    }
     console.log("stored stuff:",timesheets)
 
-    return(
+    let counter = 0
+    Object.entries(timesheets).map(entry => {
+        arrayOfDays.push(entry[1])
+        const [day, month, year] = arrayOfDays[counter].day.split('/');
+        const formattedDate = `${month}/${day}/${year}`; 
+        const currentDay = new Date(formattedDate).getDay()
+        arrayOfDays[counter].day_of_week = daysOfWeek[currentDay]
+        console.log(arrayOfDays[counter].day_of_week)
+        counter++
+    })
+
+return ( 
+    <>
+        {arrayOfDays.length > 0 && <ViewTimesheetHeader currentWeek={arrayOfDays[0].week_start}/>}
         <div>
             <table className={styles.timesheetTable}>
-                <tr className={styles.tableRow}>
-                    <th className={styles.tableData}>DAY</th>
-                    <th className={styles.tableData}>DATE</th>
-                    <th className={styles.tableData}>START TIME</th>
-                    <th className={styles.tableData}>END TIME</th>
-                    <th className={styles.tableData}>HOURS WORKED</th>
-                </tr>
-                <tr className={styles.tableRow}>
-                    <td className={styles.tableData}>Monday</td>
-                    <td className={styles.tableData}>01/04/2024</td>
-                    <td className={styles.tableData}>09:05</td>
-                    <td className={styles.tableData}>17:30</td>
-                    <td className={styles.tableData}>8 Hours <br/> 25 Minutes</td>
-                </tr>
-                <tr className={styles.tableRow}>
-                    <td className={styles.tableData}>Tuesday</td>
-                    <td className={styles.tableData}>02/04/2024</td>
-                    <td className={styles.tableData}>09:05</td>
-                    <td className={styles.tableData}>17:30</td>
-                    <td className={styles.tableData}>8 Hours <br/> 25 Minutes</td>
-                </tr>
-                <tr className={styles.tableRow}>
-                    <td className={styles.tableData}>Wednesday</td>
-                    <td className={styles.tableData}>03/04/2024</td>
-                    <td className={styles.tableData}>09:05</td>
-                    <td className={styles.tableData}>17:30</td>
-                    <td className={styles.tableData}>8 Hours <br/> 25 Minutes</td>
-                </tr>
-                <tr className={styles.tableRow}>
-                    <td className={styles.tableData}>Thursday</td>
-                    <td className={styles.tableData}>04/04/2024</td>
-                    <td className={styles.tableData}>09:05</td>
-                    <td className={styles.tableData}>17:30</td>
-                    <td className={styles.tableData}>8 Hours <br/> 25 Minutes</td>
-                </tr>
-                <tr className={styles.tableRow}>
-                    <td className={styles.tableData}>Friday</td>
-                    <td className={styles.tableData}>05/04/2024</td>
-                    <td className={styles.tableData}>09:05</td>
-                    <td className={styles.tableData}>17:30</td>
-                    <td className={styles.tableData}>8 Hours <br/> 25 Minutes</td>
-                </tr>
+                <thead>
+                    <tr className={styles.tableRow}>
+                        <th className={styles.tableData}>DAY</th>
+                        <th className={styles.tableData}>DATE</th>
+                        <th className={styles.tableData}>START TIME</th>
+                        <th className={styles.tableData}>END TIME</th>
+                        <th className={styles.tableData}>HOURS WORKED</th>
+                    </tr>
+                </thead>
+                <tbody>
+                    {arrayOfDays.map((dayData, index) => (
+                        <tr key={index} className={styles.tableRow}>
+                            <td className={styles.tableData}>{dayData.day_of_week}</td>
+                            <td className={styles.tableData}>{dayData.day}</td>
+                            <td className={styles.tableData}>{dayData.start_work}</td>
+                            <td className={styles.tableData}>{dayData.end_work}</td>
+                            <td className={styles.tableData}>{dayData.hours_worked}</td>
+                        </tr>
+                    ))}
+                </tbody>
             </table>
         </div>
-    )
+    </>
+);
+
 }
\ No newline at end of file
diff --git a/frontend/src/Components/View_Timesheet_Page/ViewTimesheetHeader.js b/frontend/src/Components/View_Timesheet_Page/ViewTimesheetHeader.js
index 55fb6954..39b245c2 100644
--- a/frontend/src/Components/View_Timesheet_Page/ViewTimesheetHeader.js
+++ b/frontend/src/Components/View_Timesheet_Page/ViewTimesheetHeader.js
@@ -1,8 +1,8 @@
 import styles from './ViewTimesheetHeader.module.css';
 
-export default function ViewTimesheetHeader() {
+export default function ViewTimesheetHeader(props) {
     return(<header className={styles.headerContainer}>
         <h1>My Timesheet</h1>
-        <h2 className={styles.weekStarting}>Week starting : 01/04/2024</h2>
+        <h2 className={styles.weekStarting}>Week starting : {props.currentWeek}</h2>
     </header>)
 }
\ No newline at end of file
diff --git a/frontend/src/Pages/Consultant/view_current_timesheet_page.js b/frontend/src/Pages/Consultant/view_current_timesheet_page.js
index a516adad..def2b601 100644
--- a/frontend/src/Pages/Consultant/view_current_timesheet_page.js
+++ b/frontend/src/Pages/Consultant/view_current_timesheet_page.js
@@ -1,4 +1,3 @@
-import ViewTimesheetHeader from "../../Components/View_Timesheet_Page/ViewTimesheetHeader";
 import ConsultantDetails from "../../Components/View_Timesheet_Page/ConsultantDetails";
 import DailyRate from "../../Components/View_Timesheet_Page/DailyRate";
 import TimesheetTable from "../../Components/View_Timesheet_Page/TimesheetTable";
@@ -9,11 +8,10 @@ function ViewCurrentTimesheetPage () {
     document.title = "Current Timesheet Viewer Page";
 
     return(<>
-        <ViewTimesheetHeader/>
         <ConsultantDetails/>
         <DailyRate/>
         <TimesheetTable/>
-        <Link to="/"><button className={styles.backButton}>Back</button></Link>
+        <Link to="/consultant_home_page"><button className={styles.backButton}>Back</button></Link>
     </>)
 }
 

From 3ae8668284c5dae4789d49d3f3381e7a5cf3b3c4 Mon Sep 17 00:00:00 2001
From: krish <114755077+krish2903@users.noreply.github.com>
Date: Tue, 2 Apr 2024 22:31:27 +0000
Subject: [PATCH 04/22] Finished create timesheet page

---
 .../IT_Technician_Page/ITLinks.module.css     |  2 +-
 .../UserAccountCreation.module.css            |  1 -
 .../Day_Header/Day_Header.module.css          |  7 +++++
 .../Form_At_Day/form_at_day.module.css        | 29 +++++++++++++++----
 .../Form_At_Day/timesheet_form_day.js         |  8 ++---
 .../Timesheet_Links.module.css                | 25 +++++++++++++---
 .../Timesheet_Links/timesheet_page_links.js   |  8 ++---
 .../Consultant/timesheet_recording_page.js    | 22 ++++++++------
 .../timesheet_recording_page.module.css       | 24 +++++++++++++++
 9 files changed, 98 insertions(+), 28 deletions(-)
 create mode 100644 frontend/src/Pages/Consultant/timesheet_recording_page.module.css

diff --git a/frontend/src/Components/IT_Technician_Page/ITLinks.module.css b/frontend/src/Components/IT_Technician_Page/ITLinks.module.css
index 92fe3dec..cc3c0188 100644
--- a/frontend/src/Components/IT_Technician_Page/ITLinks.module.css
+++ b/frontend/src/Components/IT_Technician_Page/ITLinks.module.css
@@ -1,9 +1,9 @@
 
-
 .navbar {
     display: flex;
     flex-direction: column;
     justify-content: center;
+    align-items: center;
     gap: 50px;
 }
 
diff --git a/frontend/src/Components/IT_Technician_Page/UserAccountCreation.module.css b/frontend/src/Components/IT_Technician_Page/UserAccountCreation.module.css
index f08a5784..92001d39 100644
--- a/frontend/src/Components/IT_Technician_Page/UserAccountCreation.module.css
+++ b/frontend/src/Components/IT_Technician_Page/UserAccountCreation.module.css
@@ -99,7 +99,6 @@
 
 .userAccountForm input[type=submit]{
     width: 70%;
-    width: 52%;
     margin-top: 5%;
     cursor: pointer;
     background: linear-gradient(to right, #012E6E 0%, #4d016e 100%);
diff --git a/frontend/src/Components/Timesheet_Recording_Page/Day_Header/Day_Header.module.css b/frontend/src/Components/Timesheet_Recording_Page/Day_Header/Day_Header.module.css
index 136a2d9c..d17f4775 100644
--- a/frontend/src/Components/Timesheet_Recording_Page/Day_Header/Day_Header.module.css
+++ b/frontend/src/Components/Timesheet_Recording_Page/Day_Header/Day_Header.module.css
@@ -1,3 +1,10 @@
 .DayHeader{
     text-align: center;
+}
+
+.DayHeader h2 {
+    margin: 0;
+    font-family: "Poppins", sans-serif;
+    font-size: 14pt;
+    color: #012E6E;
 }
\ No newline at end of file
diff --git a/frontend/src/Components/Timesheet_Recording_Page/Form_At_Day/form_at_day.module.css b/frontend/src/Components/Timesheet_Recording_Page/Form_At_Day/form_at_day.module.css
index 97a69b79..50c49af7 100644
--- a/frontend/src/Components/Timesheet_Recording_Page/Form_At_Day/form_at_day.module.css
+++ b/frontend/src/Components/Timesheet_Recording_Page/Form_At_Day/form_at_day.module.css
@@ -7,8 +7,27 @@
 }
 
 .TimesheetFormContainer{
-    background-color: rgb(212, 212, 212);
-    border: solid 0.1em black;
-    width: 15%;
-    margin: 3%;
-}
\ No newline at end of file
+    background-color: #d4e5fe;
+    border-radius: 15px;
+    padding: 2%;
+    font-family: "Poppins", sans-serif;
+    font-size: 12pt;
+    color: #151515;
+}
+
+.buttons{
+    font-family: "Poppins", sans-serif;
+    cursor: pointer;
+    background: linear-gradient(to right, #012E6E 0%, #4d016e 100%);
+    border-radius: 10px;
+    color: white;
+    text-align: center;
+    width: 100%;
+    padding: 3%;
+}
+
+.buttons:disabled {
+    background: linear-gradient(to right, #012e6e94 0%, #4d016e92 100%);
+    color: rgba(255, 255, 255, 0.707);
+}
+
diff --git a/frontend/src/Components/Timesheet_Recording_Page/Form_At_Day/timesheet_form_day.js b/frontend/src/Components/Timesheet_Recording_Page/Form_At_Day/timesheet_form_day.js
index 516a1c96..679b55be 100644
--- a/frontend/src/Components/Timesheet_Recording_Page/Form_At_Day/timesheet_form_day.js
+++ b/frontend/src/Components/Timesheet_Recording_Page/Form_At_Day/timesheet_form_day.js
@@ -93,21 +93,21 @@ function TimesheetFormDay() {
         return (
             <div className={styles.TimesheetFormContainer}>
                 {/* Pass the formatted date to the DayHeader */}
-                <DayHeader day={formattedDate} />
+                <DayHeader className={styles.dayHeader} day={formattedDate} />
 
                 <div>
                     <p>Start Time: {startTime ? startTime.toLocaleTimeString() : ''}</p>
-                    <button onClick={handleStartTime} disabled={startTime !== null}>Start Time</button>
+                    <button className={styles.buttons} onClick={handleStartTime} disabled={startTime !== null}>Start Time</button>
                 </div>
                 <div>
                     <p>End Time: {endTime ? endTime.toLocaleTimeString() : ''}</p>
-                    <button onClick={handleEndTime} disabled={startTime === null || endTime !== null}>End Time</button>
+                    <button className={styles.buttons} onClick={handleEndTime} disabled={startTime === null || endTime !== null}>End Time</button>
                 </div>
                 <div>
                     <p>{duration}</p>
                 </div>
                 <div>
-                    <button onClick={handleSubmit} disabled={submitted || !duration}>Submit Timesheet</button>
+                    <button className={styles.buttons} onClick={handleSubmit} disabled={submitted || !duration}>Submit Timesheet</button>
                 </div>
             </div>
         );
diff --git a/frontend/src/Components/Timesheet_Recording_Page/Timesheet_Links/Timesheet_Links.module.css b/frontend/src/Components/Timesheet_Recording_Page/Timesheet_Links/Timesheet_Links.module.css
index 1042c85f..83e29a7d 100644
--- a/frontend/src/Components/Timesheet_Recording_Page/Timesheet_Links/Timesheet_Links.module.css
+++ b/frontend/src/Components/Timesheet_Recording_Page/Timesheet_Links/Timesheet_Links.module.css
@@ -1,6 +1,23 @@
+
+.linksContainer {
+    width: 100%;
+    display: flex;
+    justify-content: center;
+    gap: 3%;
+    font-family: "Poppins", sans-serif;
+    font-size: 12pt;
+    margin-top: 3%;
+    margin-bottom: 3%;
+}
+
 .TimesheetPageLink{
-    padding: 1em;
-    margin: 1em;
-    width: 5%;
-    background-color: ghostwhite;
+    cursor: pointer;
+    background: linear-gradient(to right, #012E6E 0%, #4d016e 100%);
+    box-shadow: 0 2px 5px rgba(255, 255, 255, 0.456); 
+    border-radius: 10px;
+    color: white;
+    text-transform: uppercase;
+    text-decoration: none;
+    text-align: center;
+    width: 10%;
 }
\ No newline at end of file
diff --git a/frontend/src/Components/Timesheet_Recording_Page/Timesheet_Links/timesheet_page_links.js b/frontend/src/Components/Timesheet_Recording_Page/Timesheet_Links/timesheet_page_links.js
index 19f087e2..40a4f8c0 100644
--- a/frontend/src/Components/Timesheet_Recording_Page/Timesheet_Links/timesheet_page_links.js
+++ b/frontend/src/Components/Timesheet_Recording_Page/Timesheet_Links/timesheet_page_links.js
@@ -4,10 +4,10 @@ import styles from "../Timesheet_Links/Timesheet_Links.module.css"
 function TimesheetPageLinks() {
     return(
         <>
-            <nav>
-                <Link to="/consultant_home_page"><button className={styles.TimesheetPageLink}>Save</button></Link>
-                <Link to="/consultant_home_page"><button className={styles.TimesheetPageLink}>Submit</button></Link>
-                <Link to="/consultant_home_page"><button className={styles.TimesheetPageLink}>Back</button></Link>
+            <nav className={styles.linksContainer}>
+                <Link className={styles.TimesheetPageLink} to="/consultant_home_page"><p>Save</p></Link>
+                <Link className={styles.TimesheetPageLink} to="/consultant_home_page"><p>Submit</p></Link>
+                <Link className={styles.TimesheetPageLink} to="/consultant_home_page"><p>Back</p></Link>
             </nav>
         </>
     )
diff --git a/frontend/src/Pages/Consultant/timesheet_recording_page.js b/frontend/src/Pages/Consultant/timesheet_recording_page.js
index 15e3a3fb..45f1c57d 100644
--- a/frontend/src/Pages/Consultant/timesheet_recording_page.js
+++ b/frontend/src/Pages/Consultant/timesheet_recording_page.js
@@ -1,21 +1,25 @@
-import TimesheetFormDay from "../../Components/Timesheet_Recording_Page/Form_At_Day/timesheet_form_day"
-import TimesheetPageLinks from "../../Components/Timesheet_Recording_Page/Timesheet_Links/timesheet_page_links"
+import TimesheetFormDay from "../../Components/Timesheet_Recording_Page/Form_At_Day/timesheet_form_day";
+import TimesheetPageLinks from "../../Components/Timesheet_Recording_Page/Timesheet_Links/timesheet_page_links";
+import styles from "./timesheet_recording_page.module.css";
 
-function TimesheetRecordingPage(){
-    return(
+function TimesheetRecordingPage() {
+    return (
         <>
-            <h1>Timesheet Recording Page</h1><br/>
+            <h1 className={styles.heading}>Timesheet Recording Page</h1>
 
             {/*this just adds days to the timesheet form*/}
             {/*<TimesheetFormDay day="Monday"/>*/}
             {/*<TimesheetFormDay day="Tuesday"/>*/}
             {/*<TimesheetFormDay day="Wednesday"/>*/}
             {/*<TimesheetFormDay day="Thursday"/>*/}
-
-            <TimesheetFormDay day="Friday"/><br/>
-            <TimesheetPageLinks/>
+            <div className={styles.mainContainer}>
+                <div className={styles.weekContainer}>
+                    <TimesheetFormDay day="Monday" />
+                </div>
+                <TimesheetPageLinks />
+            </div>
         </>
-    )    
+    )
 }
 
 export default TimesheetRecordingPage
\ No newline at end of file
diff --git a/frontend/src/Pages/Consultant/timesheet_recording_page.module.css b/frontend/src/Pages/Consultant/timesheet_recording_page.module.css
new file mode 100644
index 00000000..15913d2c
--- /dev/null
+++ b/frontend/src/Pages/Consultant/timesheet_recording_page.module.css
@@ -0,0 +1,24 @@
+
+.heading {
+    margin: 0;
+    padding: 3%;
+    text-align: center;
+    font-family: "Poppins", sans-serif;
+    color: white;
+}
+
+.mainContainer {
+    width: 100%;
+    display: flex;
+    flex-direction: column;
+    justify-content: center;
+    align-items: center;
+}
+
+.weekContainer {
+    width: 90%;
+    display: flex;
+    justify-content: center;
+    text-align: center;
+    gap: 3%;
+}
\ No newline at end of file

From 34f9f1a641ac2787f39337386eeaecba2e821b0f Mon Sep 17 00:00:00 2001
From: delterr <hasanahmadcodes@gmail.com>
Date: Wed, 3 Apr 2024 00:04:05 +0100
Subject: [PATCH 05/22] started on weekly approvals, added consultant and line
 manager names to payload

---
 .../679eaac484e8efec851e5d02a21b12ac          | Bin 79 -> 79 bytes
 .../d809bf2dcbe2110e634be9cd9bce2102          | Bin 79 -> 79 bytes
 backend/timesheets/routes.py                  |  31 ++++++++++++++++--
 3 files changed, 29 insertions(+), 2 deletions(-)

diff --git a/backend/flask_session/679eaac484e8efec851e5d02a21b12ac b/backend/flask_session/679eaac484e8efec851e5d02a21b12ac
index 6b00d6ac230988bb985c0df58546ab318935d513..11db5fbb0e027d3b14d94c11ec8b6852a4ee11ea 100644
GIT binary patch
delta 9
QcmebGXa4lqWFoT<01{0DivR!s

delta 9
QcmebGXWqQUcp|e801xB?8~^|S

diff --git a/backend/flask_session/d809bf2dcbe2110e634be9cd9bce2102 b/backend/flask_session/d809bf2dcbe2110e634be9cd9bce2102
index 3ab4dca67e5b1117b30d76e9e19ba87705bd6542..a0193b2fa7eb83b868b47d5338c3cd1935798b35 100644
GIT binary patch
delta 45
zcmebGXI8##GLczR+1NbA%sesC$k@Ov*~Hi)*&^A{EY;A$)X31>IL+A1cuJ`r01*re
A>;M1&

delta 45
zcmebGXI{3&cp|f=a!QJ+S#qkGd1_ixiiwG_aiUR@v1PKEp{a?fQL=@J>6B7E05$;)
A3;+NC

diff --git a/backend/timesheets/routes.py b/backend/timesheets/routes.py
index 318406ec..c7b0c5f1 100644
--- a/backend/timesheets/routes.py
+++ b/backend/timesheets/routes.py
@@ -146,6 +146,7 @@ class ListWeeklyTimesheetsView(MethodView):
     def get(self):
         user_id = session.get("user_id")
         consultant = Consultant.query.filter_by(id=user_id).first()
+        line_manager = LineManager.query.filter_by(username=consultant.line_manager)
         print(consultant)
         
         if consultant == None:
@@ -160,10 +161,35 @@ def get(self):
         for timesheet in timesheets:
             hours_worked = str(timedelta(seconds=timesheet.hours_worked))
             day = f"{timesheet.day.day}/{timesheet.day.month}/{timesheet.day.year}"
-            json_dict[timesheet.id] = {"start_work": timesheet.start_work_time, "end_work": timesheet.end_work_time, "week_start": week_start, "hours_worked": hours_worked, "day": day}
+            json_dict[timesheet.id] = {"start_work": timesheet.start_work_time, "end_work": timesheet.end_work_time, 
+                                       "week_start": week_start, "hours_worked": hours_worked, "day": day, 
+                                       "consultant_name": f"{consultant.firstname} {consultant.lastname}", "line_manager_name": line_manager}
         return jsonify(json_dict), 200
     
 
+class WeeklyTimesheetsApprovalView(MethodView):
+    def post(self, consultant_username, flag):
+        user_id = session.get("user_id")
+        line_manager = LineManager.query.filter_by(id=user_id)
+        consultant = Consultant.query.filter_by(username=consultant_username)
+        
+        week_start = datetime.today()  - timedelta(days=datetime.today().weekday() % 7)
+        week_start = datetime(week_start.year, week_start.month, week_start.day)
+        week_start = f"{week_start.day}/{week_start.month}/{week_start.year}"
+        timesheets = Timesheet.query.filter_by(week_start_date=week_start, username=consultant_username).all()
+        
+        for timesheet in timesheets :
+            if flag == "approve":
+                timesheet.status = "approved"
+                db.session.commit()
+            elif flag == "disapprove":
+                timesheet.status = "disapproved"
+            else:
+                return jsonify({"Error": "Invalid flag"}), 400
+        
+        return jsonify("Success"), 200
+        
+
 class ListConsultantsView(MethodView):
     def get(self):
         user_id = session.get("user_id")
@@ -328,7 +354,8 @@ def post(self):
 app.add_url_rule("/delete_timesheet/<timesheet_id>", view_func=timesheets_view, methods=["DELETE"])
 app.add_url_rule("/list_timesheets", view_func=ListTimesheetsView.as_view("list_timesheets_view"), methods=["GET"])
 app.add_url_rule("/list_weekly_timesheets", view_func=ListWeeklyTimesheetsView.as_view("list_weekly_timesheets_view"), methods=["GET"])
-app.add_url_rule("/list_timesheets/<consultant_id>", view_func=ListConsultantTimesheetsView.as_view("list_consultant_timesheets_view"), methods=["GET"])
+app.add_url_rule("/list_weekly_timesheets/<consultant_username>/<flag>", view_func=WeeklyTimesheetsApprovalView.as_view("list_weekly_timesheets_approval"), methods=["POST"])
+app.add_url_rule("/list_timesheets/<consultant_id>", view_func=ListConsultantTimesheetsView.as_view("list_consultant_timesheets_viewpost"), methods=["GET"])
 app.add_url_rule("/approve_timesheet/<timesheet_id>", view_func=TimesheetApprovalView.as_view("timesheet_approval_view"), methods=["POST"])
 app.add_url_rule("/disapprove_timesheet/<timesheet_id>", view_func=TimesheetDisapprovalView.as_view("timesheet_disapproval_view"), methods=["POST"])
 

From 34aeb20ad03c27d5c13d28dea08a276c4d8b1802 Mon Sep 17 00:00:00 2001
From: delterr <hasanahmadcodes@gmail.com>
Date: Wed, 3 Apr 2024 00:07:02 +0100
Subject: [PATCH 06/22] fix typo

---
 backend/timesheets/routes.py | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/backend/timesheets/routes.py b/backend/timesheets/routes.py
index c7b0c5f1..13f8fd08 100644
--- a/backend/timesheets/routes.py
+++ b/backend/timesheets/routes.py
@@ -146,7 +146,7 @@ class ListWeeklyTimesheetsView(MethodView):
     def get(self):
         user_id = session.get("user_id")
         consultant = Consultant.query.filter_by(id=user_id).first()
-        line_manager = LineManager.query.filter_by(username=consultant.line_manager)
+        line_manager = LineManager.query.filter_by(username=consultant.line_manager).first()
         print(consultant)
         
         if consultant == None:
@@ -163,7 +163,7 @@ def get(self):
             day = f"{timesheet.day.day}/{timesheet.day.month}/{timesheet.day.year}"
             json_dict[timesheet.id] = {"start_work": timesheet.start_work_time, "end_work": timesheet.end_work_time, 
                                        "week_start": week_start, "hours_worked": hours_worked, "day": day, 
-                                       "consultant_name": f"{consultant.firstname} {consultant.lastname}", "line_manager_name": line_manager}
+                                       "consultant_name": f"{consultant.firstname} {consultant.lastname}", "line_manager_name": consultant.line_manager}
         return jsonify(json_dict), 200
     
 

From 6b58afe96d7c7f968d37d71e87d3589ac7193cfe Mon Sep 17 00:00:00 2001
From: Luke Liew Mouawad <ec22711@qmul.ac.uk>
Date: Wed, 3 Apr 2024 00:08:54 +0100
Subject: [PATCH 07/22] line manager consultant search page changes

---
 .../ConsultantCard.module.css                 | 17 +++++++---------
 .../ConsultantFinder.js                       |  9 ++++-----
 .../ConsultantFinder.module.css               | 20 +++++++++++++++----
 3 files changed, 27 insertions(+), 19 deletions(-)

diff --git a/frontend/src/Components/Line_Manager_Home_Page/ConsultantCard.module.css b/frontend/src/Components/Line_Manager_Home_Page/ConsultantCard.module.css
index 206ea6c3..99d0b9eb 100644
--- a/frontend/src/Components/Line_Manager_Home_Page/ConsultantCard.module.css
+++ b/frontend/src/Components/Line_Manager_Home_Page/ConsultantCard.module.css
@@ -1,11 +1,12 @@
 .cardContainer{
     background-color: #AEAEAE;
-    padding: 1em;
-    width: 40%;
-    height: 15em;    
+    padding: 1em; 
     border-radius: 1.5em;
     box-shadow: -0.2em 0.2em 0.2em hsla(0, 0%, 24%, 0.753);
-    position: absolute;
+    margin: 1pc;
+    max-height: 60%;
+    width: 50%;
+    flex-shrink: 0;
 }
 
 .userIcon{
@@ -14,9 +15,6 @@
 
 .name{
     color: black;
-    position: absolute;
-    top: 50%;
-    left: 19%;
     text-align: center;
 }
 
@@ -26,8 +24,7 @@
     border-radius: 1.25em;
     padding: 0.55em;
     font-size: 1em;
-    position: absolute;
-    top: 75%;
-    left: 20%;
     cursor: pointer;
+    position: absolute;
+    bottom: 60%;
 }
\ No newline at end of file
diff --git a/frontend/src/Components/Line_Manager_Home_Page/ConsultantFinder.js b/frontend/src/Components/Line_Manager_Home_Page/ConsultantFinder.js
index ee7ffa9e..419b62a4 100644
--- a/frontend/src/Components/Line_Manager_Home_Page/ConsultantFinder.js
+++ b/frontend/src/Components/Line_Manager_Home_Page/ConsultantFinder.js
@@ -1,5 +1,4 @@
 import { useState } from "react"
-import { Link } from "react-router-dom";
 import styles from './ConsultantFinder.module.css';
 import ConsultantCard from "./ConsultantCard";
 
@@ -47,16 +46,16 @@ function ConsultantFinder() {
 
             <div className={styles.searchResultsContainer}>
                 <p className={styles.myConsultantsTitle}>My Consultants</p>
-                <ul className={styles.searchResults}>
+                <div className={styles.searchResults}>
                     {search === '' ? (
                         consultantPlaceholderNames.map((result, index) => (
-                        <li><Link key={index}>{result}</Link></li> 
+                        <ConsultantCard name={result} key={index}></ConsultantCard>
                     ))
                     ) : (
                         searchResults.map((result, index) => (
-                        <li><ConsultantCard name={result} key={index}></ConsultantCard></li> 
+                        <ConsultantCard name={result} key={index}></ConsultantCard>
                     )))}
-                </ul>
+                </div>
             </div>
         </div>
     )
diff --git a/frontend/src/Components/Line_Manager_Home_Page/ConsultantFinder.module.css b/frontend/src/Components/Line_Manager_Home_Page/ConsultantFinder.module.css
index 7bf5e5c2..c736e7f8 100644
--- a/frontend/src/Components/Line_Manager_Home_Page/ConsultantFinder.module.css
+++ b/frontend/src/Components/Line_Manager_Home_Page/ConsultantFinder.module.css
@@ -10,6 +10,7 @@
     width: 25%;
     position: absolute;
     left: 37.5%;
+    top: 12%;
 }
 
 .searchBox{
@@ -29,14 +30,25 @@
 }
 
 .searchResults{
-    list-style-type: none;
+    display: grid;
+    grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
+    grid-template-rows: 1fr;
+    align-items: center;
+    justify-items: center;
+    gap: 0px;
+    z-index: 1;
+    width: 80%;
+    max-height: 35em;
+    overflow: auto;
+    position: absolute;
+    left: 10%;
+    background-color: #D9D9D9;
 }
 
 .searchResultsContainer{
-    width: 25%;
+    width: 100%;
     position: absolute;
-    left: 37.5%;
-    top: 40%;
+    top: 35%;
 }
 
 .myConsultantsTitle{

From 7b4835a0b8b51715265696305962807646957ef2 Mon Sep 17 00:00:00 2001
From: delterr <hasanahmadcodes@gmail.com>
Date: Wed, 3 Apr 2024 00:16:39 +0100
Subject: [PATCH 08/22] nother bug fix lol

---
 .../679eaac484e8efec851e5d02a21b12ac              | Bin 79 -> 79 bytes
 backend/timesheets/routes.py                      |   5 +++--
 2 files changed, 3 insertions(+), 2 deletions(-)

diff --git a/backend/flask_session/679eaac484e8efec851e5d02a21b12ac b/backend/flask_session/679eaac484e8efec851e5d02a21b12ac
index 11db5fbb0e027d3b14d94c11ec8b6852a4ee11ea..b7dd24c47092b81d10a2a4237124e50944054d53 100644
GIT binary patch
delta 9
QcmebGXLc+woyhD101NB_XaE2J

delta 9
QcmebGXa4lqWFoT<01{0DivR!s

diff --git a/backend/timesheets/routes.py b/backend/timesheets/routes.py
index 13f8fd08..66969798 100644
--- a/backend/timesheets/routes.py
+++ b/backend/timesheets/routes.py
@@ -146,7 +146,7 @@ class ListWeeklyTimesheetsView(MethodView):
     def get(self):
         user_id = session.get("user_id")
         consultant = Consultant.query.filter_by(id=user_id).first()
-        line_manager = LineManager.query.filter_by(username=consultant.line_manager).first()
+        # line_manager = LineManager.query.filter_by(username=consultant.line_manager.username).first()
         print(consultant)
         
         if consultant == None:
@@ -163,7 +163,8 @@ def get(self):
             day = f"{timesheet.day.day}/{timesheet.day.month}/{timesheet.day.year}"
             json_dict[timesheet.id] = {"start_work": timesheet.start_work_time, "end_work": timesheet.end_work_time, 
                                        "week_start": week_start, "hours_worked": hours_worked, "day": day, 
-                                       "consultant_name": f"{consultant.firstname} {consultant.lastname}", "line_manager_name": consultant.line_manager}
+                                       "consultant_name": f"{consultant.firstname} {consultant.lastname}", 
+                                       "line_manager_name": f"{consultant.line_manager.firstname} {consultant.line_manager.lastname}"}
         return jsonify(json_dict), 200
     
 

From 88518545d1aa3059209fc88caed4d790ed05e349 Mon Sep 17 00:00:00 2001
From: Luke Liew Mouawad <ec22711@qmul.ac.uk>
Date: Wed, 3 Apr 2024 00:48:03 +0100
Subject: [PATCH 09/22] view timesheet page now displays all info (excluding
 hourly rate)

---
 .../View_Timesheet_Page/ConsultantDetails.js  | 22 ++++++++++++++++---
 .../View_Timesheet_Page/TimesheetTable.js     |  2 ++
 .../Consultant/view_current_timesheet_page.js |  2 --
 3 files changed, 21 insertions(+), 5 deletions(-)

diff --git a/frontend/src/Components/View_Timesheet_Page/ConsultantDetails.js b/frontend/src/Components/View_Timesheet_Page/ConsultantDetails.js
index 442e12fb..4159c29f 100644
--- a/frontend/src/Components/View_Timesheet_Page/ConsultantDetails.js
+++ b/frontend/src/Components/View_Timesheet_Page/ConsultantDetails.js
@@ -1,15 +1,31 @@
 import styles from './ConsultantDetails.module.css';
 
-export default function ConsultantDetails() {
+function formatName(name){
+    let newName = ""
+    for(let i=0; i<name.length; i++) {
+        if(i==0 || name.charAt(i-1) == " "){
+            newName += name.charAt(i).toUpperCase()
+        }
+        else{
+            newName += name.charAt(i)
+        }
+    }
+    return newName
+}
+
+export default function ConsultantDetails(props) {
+    let consultantName = formatName(props.consultantName)
+    let lineManagerName = formatName(props.lineManagerName)
+
     return(
     <div className={styles.consultantDetailsContainer}>
         <div className={styles.consultantNameContainer}>
             <h2>Consultant Name:</h2>
-            <h2 className={styles.consultantName}>John Doe</h2>
+            <h2 className={styles.consultantName}>{consultantName}</h2>
         </div>
         <div className={styles.lineManagerContainer}>
             <h2>Line Manager Name:</h2>
-            <h2 className={styles.lineManagerName}>Jane Doe</h2>
+            <h2 className={styles.lineManagerName}>{lineManagerName}</h2>
         </div>
     </div>)
 }
\ No newline at end of file
diff --git a/frontend/src/Components/View_Timesheet_Page/TimesheetTable.js b/frontend/src/Components/View_Timesheet_Page/TimesheetTable.js
index ac553f41..6fdf19de 100644
--- a/frontend/src/Components/View_Timesheet_Page/TimesheetTable.js
+++ b/frontend/src/Components/View_Timesheet_Page/TimesheetTable.js
@@ -1,6 +1,7 @@
 import ViewTimesheetHeader from "../../Components/View_Timesheet_Page/ViewTimesheetHeader";
 import styles from './TimesheetTable.module.css';
 import { useState, useEffect } from 'react';
+import ConsultantDetails from "../../Components/View_Timesheet_Page/ConsultantDetails";
 
 export default function TimesheetTable() {
 
@@ -58,6 +59,7 @@ export default function TimesheetTable() {
 
 return ( 
     <>
+        {arrayOfDays.length > 0 && <ConsultantDetails consultantName={arrayOfDays[0].consultant_name} lineManagerName={arrayOfDays[0].line_manager_name}/>}
         {arrayOfDays.length > 0 && <ViewTimesheetHeader currentWeek={arrayOfDays[0].week_start}/>}
         <div>
             <table className={styles.timesheetTable}>
diff --git a/frontend/src/Pages/Consultant/view_current_timesheet_page.js b/frontend/src/Pages/Consultant/view_current_timesheet_page.js
index def2b601..ab0c6671 100644
--- a/frontend/src/Pages/Consultant/view_current_timesheet_page.js
+++ b/frontend/src/Pages/Consultant/view_current_timesheet_page.js
@@ -1,4 +1,3 @@
-import ConsultantDetails from "../../Components/View_Timesheet_Page/ConsultantDetails";
 import DailyRate from "../../Components/View_Timesheet_Page/DailyRate";
 import TimesheetTable from "../../Components/View_Timesheet_Page/TimesheetTable";
 import { Link } from "react-router-dom";
@@ -8,7 +7,6 @@ function ViewCurrentTimesheetPage () {
     document.title = "Current Timesheet Viewer Page";
 
     return(<>
-        <ConsultantDetails/>
         <DailyRate/>
         <TimesheetTable/>
         <Link to="/consultant_home_page"><button className={styles.backButton}>Back</button></Link>

From a50c035f0f924985c4617444f1ccb11a0b7d60de Mon Sep 17 00:00:00 2001
From: Ilyas Mohamed Ali <i.ali@se22.qmul.ac.uk>
Date: Wed, 3 Apr 2024 01:25:18 +0100
Subject: [PATCH 10/22] Finance team page

---
 frontend/public/index.html                    |  9 ++-
 frontend/src/App.js                           | 54 ++++++++++----
 .../Finance_Team_Page/SetHourlyRate.js        | 60 +++++++++++++++
 .../SetHourlyRate.module.css                  | 51 +++++++++++++
 .../Finance_Team_Page/ViewTimesheet.js        | 73 +++++++++++++++++++
 .../ViewTimesheet.module.css                  | 22 ++++++
 .../finance_team_mem_home_page.js             | 33 +++++++--
 .../finance_team_member_home_page.module.css  | 25 +++++++
 8 files changed, 300 insertions(+), 27 deletions(-)
 create mode 100644 frontend/src/Components/Finance_Team_Page/SetHourlyRate.js
 create mode 100644 frontend/src/Components/Finance_Team_Page/SetHourlyRate.module.css
 create mode 100644 frontend/src/Components/Finance_Team_Page/ViewTimesheet.js
 create mode 100644 frontend/src/Components/Finance_Team_Page/ViewTimesheet.module.css
 create mode 100644 frontend/src/Pages/Finance_Team/finance_team_member_home_page.module.css

diff --git a/frontend/public/index.html b/frontend/public/index.html
index 4f8a892b..5350f792 100644
--- a/frontend/public/index.html
+++ b/frontend/public/index.html
@@ -15,9 +15,12 @@
       user's mobile device or desktop. See https://developers.google.com/web/fundamentals/web-app-manifest/
     -->
     <link rel="manifest" href="%PUBLIC_URL%/manifest.json" />
-    <link rel="preconnect" href="https://fonts.googleapis.com">
-    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
-    <link href="https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,100;0,300;0,400;0,500;0,700;0,900;1,100;1,300;1,400;1,500;1,700;1,900&display=swap" rel="stylesheet">
+    <link rel="preconnect" href="https://fonts.googleapis.com" />
+    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
+    <link
+      href="https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,100;0,300;0,400;0,500;0,700;0,900;1,100;1,300;1,400;1,500;1,700;1,900&display=swap"
+      rel="stylesheet"
+    />
     <!--
       Notice the use of %PUBLIC_URL% in the tags above.
       It will be replaced with the URL of the `public` folder during the build.
diff --git a/frontend/src/App.js b/frontend/src/App.js
index 83c6a0bf..e3b389cb 100644
--- a/frontend/src/App.js
+++ b/frontend/src/App.js
@@ -1,8 +1,10 @@
-import { HashRouter, Routes, Route} from "react-router-dom";
+import { HashRouter, Routes, Route } from "react-router-dom";
 import MainHome from "./Pages/Main/main_home";
 import LoginPage from "./Pages/Main/login_page";
 import ConsultantHomePage from "./Pages/Consultant/consultant_home_page";
 import FinanceTeamMemberHomePage from "./Pages/Finance_Team/finance_team_mem_home_page";
+import SetHourlyRate from "./Components/Finance_Team_Page/SetHourlyRate";
+import ViewTimesheet from "./Components/Finance_Team_Page/ViewTimesheet";
 import ITTechnicianHomePage from "./Pages/IT_Technician/it_technician_home_page";
 import LineManagerHomePage from "./Pages/Line_Manager/line_manager_home_page";
 import TimesheetRecordingPage from "./Pages/Consultant/timesheet_recording_page";
@@ -11,25 +13,45 @@ import ItDifficultiesPage from "./Pages/IT_Technician/it_difficulties_page";
 import TimesheetEditRequestsPage from "./Pages/IT_Technician/timesheet_edit_requests_page";
 import ItUserCreationPage from "./Pages/IT_Technician/it_user_creation_page";
 
-function App() 
-{
-  return(
+function App() {
+  return (
     <HashRouter>
       <Routes>
-        <Route path="/" element={<MainHome/>}/>
-        <Route path="/login_page" element={<LoginPage/>}/>
-        <Route path="/consultant_home_page" element={<ConsultantHomePage/>}/>
-        <Route path="/finance_team_member_home_page" element={<FinanceTeamMemberHomePage/>}/>
-        <Route path="/it_technician_home_page" element={<ITTechnicianHomePage/>}/>
-        <Route path="/line_manager_home_page" element={<LineManagerHomePage/>}/>
-        <Route path="/timesheet_recording_page" element={<TimesheetRecordingPage/>}/>
-        <Route path="/consultant_finder_page" element={<ConsultantFinderPage/>}/>
-        <Route path="/it_difficulties" element={<ItDifficultiesPage/>}/>
-        <Route path="/timesheet_edit_requests" element={<TimesheetEditRequestsPage/>}/>
-        <Route path="/it_user_creation" element={<ItUserCreationPage/>}/>
+        <Route path="/" element={<MainHome />} />
+        <Route path="/login_page" element={<LoginPage />} />
+        <Route path="/consultant_home_page" element={<ConsultantHomePage />} />
+        <Route
+          path="/finance_team_member_home_page"
+          element={<FinanceTeamMemberHomePage />}
+        />
+        <Route path="/set_hourly_rate" element={<SetHourlyRate />} />
+        <Route path="/view_timesheet" element={<ViewTimesheet />} />
+
+        <Route
+          path="/it_technician_home_page"
+          element={<ITTechnicianHomePage />}
+        />
+        <Route
+          path="/line_manager_home_page"
+          element={<LineManagerHomePage />}
+        />
+        <Route
+          path="/timesheet_recording_page"
+          element={<TimesheetRecordingPage />}
+        />
+        <Route
+          path="/consultant_finder_page"
+          element={<ConsultantFinderPage />}
+        />
+        <Route path="/it_difficulties" element={<ItDifficultiesPage />} />
+        <Route
+          path="/timesheet_edit_requests"
+          element={<TimesheetEditRequestsPage />}
+        />
+        <Route path="/it_user_creation" element={<ItUserCreationPage />} />
       </Routes>
     </HashRouter>
-  )
+  );
 }
 
 export default App;
diff --git a/frontend/src/Components/Finance_Team_Page/SetHourlyRate.js b/frontend/src/Components/Finance_Team_Page/SetHourlyRate.js
new file mode 100644
index 00000000..6ec99fa8
--- /dev/null
+++ b/frontend/src/Components/Finance_Team_Page/SetHourlyRate.js
@@ -0,0 +1,60 @@
+import React, { useState } from "react";
+import styles from "./SetHourlyRate.module.css"; // Import the CSS file
+
+function SetHourlyRate() {
+  const [consultantName, setConsultantName] = useState("");
+  const [hourlyRate, setHourlyRate] = useState("");
+
+  const handleConsultantNameChange = (event) => {
+    setConsultantName(event.target.value);
+  };
+
+  const handleHourlyRateChange = (event) => {
+    setHourlyRate(event.target.value);
+  };
+
+  const handleSubmit = (event) => {
+    event.preventDefault();
+    // Here, you can send the data to the backend
+    // For now, let's just log the data to the console
+    console.log("Consultant Name:", consultantName);
+    console.log("Hourly Rate:", hourlyRate);
+  };
+
+  return (
+    <div className={styles.setHourlyRateContainer}>
+      <h2 className={styles.setHourlyRateTitle}>Set Hourly Rate</h2>
+      <form onSubmit={handleSubmit}>
+        <div className={styles.inputGroup}>
+          <label className={styles.setHourlyRateLabel}>
+            Consultant Name:
+            <input
+              type="text"
+              value={consultantName}
+              onChange={handleConsultantNameChange}
+              className={styles.setHourlyRateInput}
+              placeholder="Enter consultant's name"
+            />
+          </label>
+        </div>
+        <div className={styles.inputGroup}>
+          <label className={styles.setHourlyRateLabel}>
+            Hourly Rate:
+            <input
+              type="number"
+              value={hourlyRate}
+              onChange={handleHourlyRateChange}
+              className={styles.setHourlyRateInput}
+              placeholder="Enter hourly rate"
+            />
+          </label>
+        </div>
+        <button type="submit" className={styles.setHourlyRateButton}>
+          Set Hourly Rate
+        </button>
+      </form>
+    </div>
+  );
+}
+
+export default SetHourlyRate;
diff --git a/frontend/src/Components/Finance_Team_Page/SetHourlyRate.module.css b/frontend/src/Components/Finance_Team_Page/SetHourlyRate.module.css
new file mode 100644
index 00000000..c944afec
--- /dev/null
+++ b/frontend/src/Components/Finance_Team_Page/SetHourlyRate.module.css
@@ -0,0 +1,51 @@
+/* SetHourlyRate.module.css */
+
+/* Container styles */
+.setHourlyRateContainer {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: flex-start;
+  height: 100vh; /* Set the container height to viewport height */
+  padding: 20px; /* Add padding */
+}
+
+/* Title styles */
+.setHourlyRateTitle {
+  text-align: center;
+  font-family: Cambria, Cochin, Georgia, Times, "Times New Roman", serif;
+  font-size: 30pt;
+  margin-bottom: 50px; /* Add margin at the bottom */
+}
+
+/* Label styles */
+.setHourlyRateLabel {
+  font-size: 18px; /* Increase font size */
+  margin-bottom: 10px;
+  color: #060000; /* Change text color */
+}
+
+/* Input styles */
+.setHourlyRateInput {
+  padding: 10px;
+  width: 300px;
+  border: 1px solid #ccc;
+  border-radius: 4px;
+  font-size: 16px;
+  margin-bottom: 20px;
+}
+
+/* Button styles */
+.setHourlyRateButton {
+  padding: 10px 20px;
+  background-color: #007bff;
+  color: #fff;
+  border: none;
+  border-radius: 4px;
+  font-size: 16px;
+  cursor: pointer;
+}
+
+.setHourlyRateButton:hover {
+  background-color: #0056b3;
+}
diff --git a/frontend/src/Components/Finance_Team_Page/ViewTimesheet.js b/frontend/src/Components/Finance_Team_Page/ViewTimesheet.js
new file mode 100644
index 00000000..34cdfab4
--- /dev/null
+++ b/frontend/src/Components/Finance_Team_Page/ViewTimesheet.js
@@ -0,0 +1,73 @@
+// ViewTimesheet.js
+
+import React, { useState } from "react";
+import styles from "./ViewTimesheet.module.css"; // Import CSS module
+
+function ViewTimesheet() {
+  // Mock data for demonstration
+  const [consultantName, setConsultantName] = useState("");
+  const [timesheetData, setTimesheetData] = useState(null);
+
+  const handleConsultantNameChange = (event) => {
+    setConsultantName(event.target.value);
+  };
+
+  const handleSubmit = (event) => {
+    event.preventDefault();
+    // Here you can fetch timesheet data from the backend based on the consultant's name
+    // For demonstration, let's just log the entered consultant's name
+    console.log("Consultant Name:", consultantName);
+    // Reset the input field after submission
+    setConsultantName("");
+    // Set timesheet data retrieved from the backend (or mock data)
+    setTimesheetData({
+      date: "2024-04-01",
+      hoursWorked: 8,
+      project: "Project X",
+      task: "Task A",
+      description: "Worked on Task A for Project X",
+    });
+  };
+
+  return (
+    <div className={styles.timesheetContainer}>
+      <h2 className={styles.timesheetTitle}>View Timesheet</h2>
+      <form onSubmit={handleSubmit}>
+        <label>
+          Enter Consultant's Name:
+          <input
+            type="text"
+            value={consultantName}
+            onChange={handleConsultantNameChange}
+            className={styles.consultantNameInput}
+          />
+        </label>
+        <button type="submit" className={styles.searchButton}>
+          Search
+        </button>
+      </form>
+      {timesheetData && (
+        <div className={styles.timesheetBox}>
+          <p>
+            <strong>Date:</strong> {timesheetData.date}
+          </p>
+          <p>
+            <strong>Hours Worked:</strong> {timesheetData.hoursWorked}
+          </p>
+          <p>
+            <strong>Project:</strong> {timesheetData.project}
+          </p>
+          <p>
+            <strong>Task:</strong> {timesheetData.task}
+          </p>
+          <p>
+            <strong>Description:</strong> {timesheetData.description}
+          </p>
+          {/* Additional data fields as needed */}
+        </div>
+      )}
+    </div>
+  );
+}
+
+export default ViewTimesheet;
diff --git a/frontend/src/Components/Finance_Team_Page/ViewTimesheet.module.css b/frontend/src/Components/Finance_Team_Page/ViewTimesheet.module.css
new file mode 100644
index 00000000..6fa2af04
--- /dev/null
+++ b/frontend/src/Components/Finance_Team_Page/ViewTimesheet.module.css
@@ -0,0 +1,22 @@
+/* ViewTimesheet.module.css */
+
+.timesheetContainer {
+  width: 80%;
+  margin: 0 auto;
+}
+
+.timesheetTitle {
+  text-align: center;
+}
+
+.timesheetBox {
+  background-color: #fff;
+  border: 1px solid #ccc;
+  border-radius: 5px;
+  padding: 20px;
+  margin-top: 20px;
+}
+
+.timesheetBox p {
+  margin-bottom: 10px;
+}
diff --git a/frontend/src/Pages/Finance_Team/finance_team_mem_home_page.js b/frontend/src/Pages/Finance_Team/finance_team_mem_home_page.js
index 5b909488..9b703ae5 100644
--- a/frontend/src/Pages/Finance_Team/finance_team_mem_home_page.js
+++ b/frontend/src/Pages/Finance_Team/finance_team_mem_home_page.js
@@ -1,11 +1,28 @@
-function FinanceTeamMemberHomePage () {
-    document.title = "Finance Team Member Home Page";
+// FinanceTeamMemberHomePage.js
+import React from "react";
+import { Link } from "react-router-dom";
+import styles from "./finance_team_member_home_page.module.css"; // Import the CSS file
 
-    return(
-        <>
-            <h1>Finance Team Member Home Page</h1>
-        </>
-    )
+function FinanceTeamMemberHomePage() {
+  return (
+    <div className={styles.financeTeamMemberContainer}>
+      <h1 className={styles.financeTeamMemberHeading}>
+        Finance Team Member Home Page
+      </h1>
+      <div style={{ textAlign: "center" }}>
+        <Link to="/set_hourly_rate">
+          <button className={styles.financeTeamMemberButton}>
+            Set Hourly Rate
+          </button>
+        </Link>
+        <Link to="/view_timesheet">
+          <button className={styles.financeTeamMemberButton}>
+            View Timesheet
+          </button>
+        </Link>
+      </div>
+    </div>
+  );
 }
 
-export default FinanceTeamMemberHomePage;
\ No newline at end of file
+export default FinanceTeamMemberHomePage;
diff --git a/frontend/src/Pages/Finance_Team/finance_team_member_home_page.module.css b/frontend/src/Pages/Finance_Team/finance_team_member_home_page.module.css
new file mode 100644
index 00000000..ee59f4e2
--- /dev/null
+++ b/frontend/src/Pages/Finance_Team/finance_team_member_home_page.module.css
@@ -0,0 +1,25 @@
+/* FinanceTeamMemberHomePage.module.css */
+
+/* Button styles */
+.financeTeamMemberButton {
+  padding: 30px 60px;
+  background-color: #ffffff;
+  color: #0a0a0a;
+  border: none;
+  border-radius: 4px;
+  font-size: 16px;
+  cursor: pointer;
+  margin: 0 10px; /* Add margin to both sides of the button */
+}
+
+.financeTeamMemberButton:first-child {
+  margin-right: 10px; /* Add margin only to the right of the first button */
+}
+
+.financeTeamMemberButton:last-child {
+  margin-left: 10px; /* Add margin only to the left of the last button */
+}
+
+.financeTeamMemberButton:hover {
+  background-color: #0056b3;
+}

From 3b5b749327846f65f1d03f852fcc8c2351506f56 Mon Sep 17 00:00:00 2001
From: Luke Liew Mouawad <ec22711@qmul.ac.uk>
Date: Wed, 3 Apr 2024 01:45:21 +0100
Subject: [PATCH 11/22] fix

---
 frontend/src/App.js | 3 ---
 1 file changed, 3 deletions(-)

diff --git a/frontend/src/App.js b/frontend/src/App.js
index 26ddf35c..fd917946 100644
--- a/frontend/src/App.js
+++ b/frontend/src/App.js
@@ -18,7 +18,6 @@ function App() {
   return (
     <HashRouter>
       <Routes>
-<<<<<<< HEAD
         <Route path="/" element={<MainHome />} />
         <Route path="/login_page" element={<LoginPage />} />
         <Route path="/consultant_home_page" element={<ConsultantHomePage />} />
@@ -51,7 +50,6 @@ function App() {
           element={<TimesheetEditRequestsPage />}
         />
         <Route path="/it_user_creation" element={<ItUserCreationPage />} />
-=======
         <Route path="/" element={<MainHome/>}/>
         <Route path="/login_page" element={<LoginPage/>}/>
         <Route path="/consultant_home_page" element={<ConsultantHomePage/>}/>
@@ -64,7 +62,6 @@ function App() {
         <Route path="/timesheet_edit_requests" element={<TimesheetEditRequestsPage/>}/>
         <Route path="/it_user_creation" element={<ItUserCreationPage/>}/>
         <Route path="/current_timesheet_viewer" element={<ViewCurrentTimesheetPage/>}/>
->>>>>>> 7b4835a0b8b51715265696305962807646957ef2
       </Routes>
     </HashRouter>
   );

From dc27d3d255a76084900e380f2da55c2000e3120c Mon Sep 17 00:00:00 2001
From: Luke Liew Mouawad <ec22711@qmul.ac.uk>
Date: Wed, 3 Apr 2024 13:37:54 +0100
Subject: [PATCH 12/22] made a responsive nav bar for user pages

---
 .../2029240f6d1128be89ddc32729463129          | Bin 9 -> 9 bytes
 .../7a973a1ecebb180f9fe7c30101047a60          | Bin 0 -> 79 bytes
 .../Consultant/record_timesheet.svg           |   1 +
 .../Consultant/view_saved_timesheets.svg      |   1 +
 .../Consultant/view_timesheet.svg             |   1 +
 .../public/Home_Page_Icons/house-solid.svg    |   1 +
 frontend/src/Components/Global/Navbar.js      |  26 ++++++++++
 .../src/Components/Global/Navbar.module.css   |  49 ++++++++++++++++++
 .../Consultant/ConsultantHomePage.module.css  |  11 ++++
 .../Pages/Consultant/consultant_home_page.js  |  15 ++++--
 10 files changed, 101 insertions(+), 4 deletions(-)
 create mode 100644 backend/flask_session/7a973a1ecebb180f9fe7c30101047a60
 create mode 100644 frontend/public/Home_Page_Icons/Consultant/record_timesheet.svg
 create mode 100644 frontend/public/Home_Page_Icons/Consultant/view_saved_timesheets.svg
 create mode 100644 frontend/public/Home_Page_Icons/Consultant/view_timesheet.svg
 create mode 100644 frontend/public/Home_Page_Icons/house-solid.svg
 create mode 100644 frontend/src/Components/Global/Navbar.js
 create mode 100644 frontend/src/Components/Global/Navbar.module.css
 create mode 100644 frontend/src/Pages/Consultant/ConsultantHomePage.module.css

diff --git a/backend/flask_session/2029240f6d1128be89ddc32729463129 b/backend/flask_session/2029240f6d1128be89ddc32729463129
index 7f5741f13017ee705ea34021d222a06a6ee2a6c9..ffb2cd9bfd75610267f6ba499787709ee5ac010d 100644
GIT binary patch
literal 9
QcmZQzU|?uq^=8%s00XiC0ssI2

literal 9
QcmZQzU|?uq^=8ro00XcA0RR91

diff --git a/backend/flask_session/7a973a1ecebb180f9fe7c30101047a60 b/backend/flask_session/7a973a1ecebb180f9fe7c30101047a60
new file mode 100644
index 0000000000000000000000000000000000000000..f1074ec469a1cdaee7a456ef3e5f40b5e8ba498f
GIT binary patch
literal 79
zcmey#YnIl)I@N&z0&1sd^l-%&q!#5S=B4J9OzG%hFD*_jiqA}$(xYH$l4NXbY;Krp
eVVY!OW|3lPoNAhCn4FrNoNQ{8l4v%iR1W~zuo(XU

literal 0
HcmV?d00001

diff --git a/frontend/public/Home_Page_Icons/Consultant/record_timesheet.svg b/frontend/public/Home_Page_Icons/Consultant/record_timesheet.svg
new file mode 100644
index 00000000..2df374ff
--- /dev/null
+++ b/frontend/public/Home_Page_Icons/Consultant/record_timesheet.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><!--!Font Awesome Free 6.5.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2024 Fonticons, Inc.--><path d="M362.7 19.3L314.3 67.7 444.3 197.7l48.4-48.4c25-25 25-65.5 0-90.5L453.3 19.3c-25-25-65.5-25-90.5 0zm-71 71L58.6 323.5c-10.4 10.4-18 23.3-22.2 37.4L1 481.2C-1.5 489.7 .8 498.8 7 505s15.3 8.5 23.7 6.1l120.3-35.4c14.1-4.2 27-11.8 37.4-22.2L421.7 220.3 291.7 90.3z"/></svg>
\ No newline at end of file
diff --git a/frontend/public/Home_Page_Icons/Consultant/view_saved_timesheets.svg b/frontend/public/Home_Page_Icons/Consultant/view_saved_timesheets.svg
new file mode 100644
index 00000000..ea97d652
--- /dev/null
+++ b/frontend/public/Home_Page_Icons/Consultant/view_saved_timesheets.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 576 512"><!--!Font Awesome Free 6.5.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2024 Fonticons, Inc.--><path d="M88.7 223.8L0 375.8V96C0 60.7 28.7 32 64 32H181.5c17 0 33.3 6.7 45.3 18.7l26.5 26.5c12 12 28.3 18.7 45.3 18.7H416c35.3 0 64 28.7 64 64v32H144c-22.8 0-43.8 12.1-55.3 31.8zm27.6 16.1C122.1 230 132.6 224 144 224H544c11.5 0 22 6.1 27.7 16.1s5.7 22.2-.1 32.1l-112 192C453.9 474 443.4 480 432 480H32c-11.5 0-22-6.1-27.7-16.1s-5.7-22.2 .1-32.1l112-192z"/></svg>
\ No newline at end of file
diff --git a/frontend/public/Home_Page_Icons/Consultant/view_timesheet.svg b/frontend/public/Home_Page_Icons/Consultant/view_timesheet.svg
new file mode 100644
index 00000000..7d0b03ac
--- /dev/null
+++ b/frontend/public/Home_Page_Icons/Consultant/view_timesheet.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512"><!--!Font Awesome Free 6.5.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2024 Fonticons, Inc.--><path d="M128 0c17.7 0 32 14.3 32 32V64H288V32c0-17.7 14.3-32 32-32s32 14.3 32 32V64h48c26.5 0 48 21.5 48 48v48H0V112C0 85.5 21.5 64 48 64H96V32c0-17.7 14.3-32 32-32zM0 192H448V464c0 26.5-21.5 48-48 48H48c-26.5 0-48-21.5-48-48V192zm64 80v32c0 8.8 7.2 16 16 16h32c8.8 0 16-7.2 16-16V272c0-8.8-7.2-16-16-16H80c-8.8 0-16 7.2-16 16zm128 0v32c0 8.8 7.2 16 16 16h32c8.8 0 16-7.2 16-16V272c0-8.8-7.2-16-16-16H208c-8.8 0-16 7.2-16 16zm144-16c-8.8 0-16 7.2-16 16v32c0 8.8 7.2 16 16 16h32c8.8 0 16-7.2 16-16V272c0-8.8-7.2-16-16-16H336zM64 400v32c0 8.8 7.2 16 16 16h32c8.8 0 16-7.2 16-16V400c0-8.8-7.2-16-16-16H80c-8.8 0-16 7.2-16 16zm144-16c-8.8 0-16 7.2-16 16v32c0 8.8 7.2 16 16 16h32c8.8 0 16-7.2 16-16V400c0-8.8-7.2-16-16-16H208zm112 16v32c0 8.8 7.2 16 16 16h32c8.8 0 16-7.2 16-16V400c0-8.8-7.2-16-16-16H336c-8.8 0-16 7.2-16 16z"/></svg>
\ No newline at end of file
diff --git a/frontend/public/Home_Page_Icons/house-solid.svg b/frontend/public/Home_Page_Icons/house-solid.svg
new file mode 100644
index 00000000..c6bbed4b
--- /dev/null
+++ b/frontend/public/Home_Page_Icons/house-solid.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 576 512"><!--!Font Awesome Free 6.5.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2024 Fonticons, Inc.--><path d="M575.8 255.5c0 18-15 32.1-32 32.1h-32l.7 160.2c0 2.7-.2 5.4-.5 8.1V472c0 22.1-17.9 40-40 40H456c-1.1 0-2.2 0-3.3-.1c-1.4 .1-2.8 .1-4.2 .1H416 392c-22.1 0-40-17.9-40-40V448 384c0-17.7-14.3-32-32-32H256c-17.7 0-32 14.3-32 32v64 24c0 22.1-17.9 40-40 40H160 128.1c-1.5 0-3-.1-4.5-.2c-1.2 .1-2.4 .2-3.6 .2H104c-22.1 0-40-17.9-40-40V360c0-.9 0-1.9 .1-2.8V287.6H32c-18 0-32-14-32-32.1c0-9 3-17 10-24L266.4 8c7-7 15-8 22-8s15 2 21 7L564.8 231.5c8 7 12 15 11 24z"/></svg>
\ No newline at end of file
diff --git a/frontend/src/Components/Global/Navbar.js b/frontend/src/Components/Global/Navbar.js
new file mode 100644
index 00000000..99f9dd36
--- /dev/null
+++ b/frontend/src/Components/Global/Navbar.js
@@ -0,0 +1,26 @@
+import { Link } from 'react-router-dom'
+import styles from './Navbar.module.css'
+
+export default function Navbar(props) {
+    let linksArray = props.links
+    console.log(linksArray)
+
+    return(<nav className={styles.navbar}>
+        <ul className={styles.navContainer}>
+            <li className={styles.navElement}>
+                <Link className={styles.navLink} to="/">
+                    <img className={styles.icon} src="./Home_Page_Icons/house-solid.svg"/>
+                    <p className={styles.navText} href="/">{props.homePageTitle}</p>
+                </Link>
+            </li>
+            {linksArray.map( (navElement, index) =>(
+                <li key={index} className={styles.navElement}>
+                    <Link className={styles.navLink} to={navElement.pageLink}>
+                        <img className={styles.icon} src={navElement.iconPath}/>
+                        <p className={styles.navText}>{navElement.pageName}</p>
+                    </Link>
+                </li>
+            ))}
+        </ul>
+    </nav>)
+}
\ No newline at end of file
diff --git a/frontend/src/Components/Global/Navbar.module.css b/frontend/src/Components/Global/Navbar.module.css
new file mode 100644
index 00000000..0fff4272
--- /dev/null
+++ b/frontend/src/Components/Global/Navbar.module.css
@@ -0,0 +1,49 @@
+.navbar{
+    background-color: #D9D9D9;
+    width: 5rem;
+    height: 100vh;
+    display: flex;
+    flex-direction: column;
+    align-items:start;
+    transition: width 200ms ease;
+    overflow: hidden;
+}
+
+.navbar:hover{
+    width: 16rem;
+}
+
+.navbar:hover .navText{
+    display: block;
+}
+
+.navElement a{
+    color: black;
+    text-decoration: none;
+}
+
+.navContainer{
+    padding: 0;
+    list-style-type: none;
+}
+
+.navLink{
+    display: flex;
+    align-items: center;
+    height: 5rem;
+}
+
+.navText{
+    margin-left: 0rem;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+    overflow: hidden;
+    display: none;
+    font-size: large;
+}
+
+.icon{
+    min-width: 3rem;
+    margin: 0 1rem;
+    width: 2rem;
+}
\ No newline at end of file
diff --git a/frontend/src/Pages/Consultant/ConsultantHomePage.module.css b/frontend/src/Pages/Consultant/ConsultantHomePage.module.css
new file mode 100644
index 00000000..e1077ad8
--- /dev/null
+++ b/frontend/src/Pages/Consultant/ConsultantHomePage.module.css
@@ -0,0 +1,11 @@
+.main{
+    margin-left: 5rem;
+    padding: 1rem;
+    position: absolute;
+    left: 40rem;
+}
+
+body{
+    margin: 0;
+    padding: 0;
+}
\ No newline at end of file
diff --git a/frontend/src/Pages/Consultant/consultant_home_page.js b/frontend/src/Pages/Consultant/consultant_home_page.js
index 336d6fab..c825f5ba 100644
--- a/frontend/src/Pages/Consultant/consultant_home_page.js
+++ b/frontend/src/Pages/Consultant/consultant_home_page.js
@@ -1,12 +1,19 @@
 import ConsultantLinks from "../../Components/Consultant_Home_Page/ConsultantLinks";
+import Navbar from "../../Components/Global/Navbar";
+import styles from './ConsultantHomePage.module.css'
 
 function ConsultantHomePage () {
     document.title = "Consultant Home Page";
 
-    return(
-        <>
-            <h1>Consultant Home Page</h1>
-            <ConsultantLinks/>
+    let links = [{pageName : "Create Timesheet", pageLink : "/timesheet_recording_page", iconPath : "./Home_Page_Icons/Consultant/record_timesheet.svg"}, 
+    {pageName : "View Timesheet", pageLink : "/current_timesheet_viewer", iconPath : "./Home_Page_Icons/Consultant/view_timesheet.svg"},
+    {pageName : "View Saved Timesheets", pageLink : "/", iconPath : "./Home_Page_Icons/Consultant/view_saved_timesheets.svg"}]
+
+    return(<>
+            <main className={styles.main}>
+                <h1>Consultant Home Page</h1>
+            </main>
+            <Navbar homePageTitle="Consultant Home Page" links={links}/>
         </>
     )
 }

From 49e475c5f78ee8cb9d3efefc90ead569677b1de5 Mon Sep 17 00:00:00 2001
From: Luke Liew Mouawad <ec22711@qmul.ac.uk>
Date: Wed, 3 Apr 2024 15:26:19 +0100
Subject: [PATCH 13/22] added nav bar to every single page

---
 .../Finance_Team_Page/SetHourlyRate.js        | 71 ++++++++--------
 .../SetHourlyRate.module.css                  |  1 +
 .../Finance_Team_Page/ViewTimesheet.js        | 81 ++++++++++---------
 .../ViewTimesheet.module.css                  |  2 +
 frontend/src/Components/Global/Navbar.js      |  2 +-
 .../src/Components/Global/Navbar.module.css   |  5 ++
 .../LineManagerLinks.js                       |  1 -
 .../View_Timesheet_Page/ConsultantDetails.js  | 12 +--
 .../ConsultantDetails.module.css              | 26 +++---
 .../ViewTimesheetHeader.module.css            |  4 +-
 .../Consultant/ConsultantHomePage.module.css  |  2 -
 .../TimesheetRecordingPage.module.css         | 10 +++
 .../Consultant/TimesheetViewPage.module.css   | 10 +++
 .../Pages/Consultant/consultant_home_page.js  |  5 +-
 .../Consultant/timesheet_recording_page.js    | 24 +++---
 .../Consultant/view_current_timesheet_page.js | 14 +++-
 .../finance_team_mem_home_page.js             | 30 +++----
 .../finance_team_member_home_page.module.css  | 10 +++
 .../ITDifficultiesPage.module.css             |  4 +
 .../IT_Technician/it_difficulties_page.js     | 25 ++++--
 .../IT_Technician/it_technician_home_page.js  | 12 ++-
 .../it_technician_home_page.module.css        | 18 ++---
 .../IT_Technician/it_user_creation_page.js    | 15 +++-
 .../it_user_creation_page.module.css          |  5 ++
 .../ConsultantFinderPage.module.css           |  9 +++
 .../LineManagerHomePage.module.css            |  9 +++
 .../Line_Manager/consultant_finder_page.js    | 13 ++-
 .../Line_Manager/line_manager_home_page.js    | 11 ++-
 28 files changed, 272 insertions(+), 159 deletions(-)
 create mode 100644 frontend/src/Pages/Consultant/TimesheetRecordingPage.module.css
 create mode 100644 frontend/src/Pages/IT_Technician/ITDifficultiesPage.module.css
 create mode 100644 frontend/src/Pages/Line_Manager/ConsultantFinderPage.module.css
 create mode 100644 frontend/src/Pages/Line_Manager/LineManagerHomePage.module.css

diff --git a/frontend/src/Components/Finance_Team_Page/SetHourlyRate.js b/frontend/src/Components/Finance_Team_Page/SetHourlyRate.js
index 6ec99fa8..5e8ddc1d 100644
--- a/frontend/src/Components/Finance_Team_Page/SetHourlyRate.js
+++ b/frontend/src/Components/Finance_Team_Page/SetHourlyRate.js
@@ -1,7 +1,11 @@
 import React, { useState } from "react";
 import styles from "./SetHourlyRate.module.css"; // Import the CSS file
+import Navbar from "../../Components/Global/Navbar";
 
 function SetHourlyRate() {
+  let links = [{pageName : "Set Hourly Rate Page", pageLink : "/set_hourly_rate", iconPath : "./Home_Page_Icons/Consultant/record_timesheet.svg"},
+  {pageName : "View Timesheet Page", pageLink : "/view_timesheet", iconPath : "./Home_Page_Icons/Consultant/view_timesheet.svg"}]
+
   const [consultantName, setConsultantName] = useState("");
   const [hourlyRate, setHourlyRate] = useState("");
 
@@ -22,38 +26,41 @@ function SetHourlyRate() {
   };
 
   return (
-    <div className={styles.setHourlyRateContainer}>
-      <h2 className={styles.setHourlyRateTitle}>Set Hourly Rate</h2>
-      <form onSubmit={handleSubmit}>
-        <div className={styles.inputGroup}>
-          <label className={styles.setHourlyRateLabel}>
-            Consultant Name:
-            <input
-              type="text"
-              value={consultantName}
-              onChange={handleConsultantNameChange}
-              className={styles.setHourlyRateInput}
-              placeholder="Enter consultant's name"
-            />
-          </label>
-        </div>
-        <div className={styles.inputGroup}>
-          <label className={styles.setHourlyRateLabel}>
-            Hourly Rate:
-            <input
-              type="number"
-              value={hourlyRate}
-              onChange={handleHourlyRateChange}
-              className={styles.setHourlyRateInput}
-              placeholder="Enter hourly rate"
-            />
-          </label>
-        </div>
-        <button type="submit" className={styles.setHourlyRateButton}>
-          Set Hourly Rate
-        </button>
-      </form>
-    </div>
+    <>
+      <Navbar homePageTitle="Finance Team Home Page" homePageLink="/finance_team_member_home_page" links={links}/>
+      <div className={styles.setHourlyRateContainer}>
+        <h2 className={styles.setHourlyRateTitle}>Set Hourly Rate</h2>
+        <form onSubmit={handleSubmit}>
+          <div className={styles.inputGroup}>
+            <label className={styles.setHourlyRateLabel}>
+              Consultant Name:
+              <input
+                type="text"
+                value={consultantName}
+                onChange={handleConsultantNameChange}
+                className={styles.setHourlyRateInput}
+                placeholder="Enter consultant's name"
+              />
+            </label>
+          </div>
+          <div className={styles.inputGroup}>
+            <label className={styles.setHourlyRateLabel}>
+              Hourly Rate:
+              <input
+                type="number"
+                value={hourlyRate}
+                onChange={handleHourlyRateChange}
+                className={styles.setHourlyRateInput}
+                placeholder="Enter hourly rate"
+              />
+            </label>
+          </div>
+          <button type="submit" className={styles.setHourlyRateButton}>
+            Set Hourly Rate
+          </button>
+        </form>
+      </div>
+    </>
   );
 }
 
diff --git a/frontend/src/Components/Finance_Team_Page/SetHourlyRate.module.css b/frontend/src/Components/Finance_Team_Page/SetHourlyRate.module.css
index c944afec..342de2d9 100644
--- a/frontend/src/Components/Finance_Team_Page/SetHourlyRate.module.css
+++ b/frontend/src/Components/Finance_Team_Page/SetHourlyRate.module.css
@@ -8,6 +8,7 @@
   justify-content: flex-start;
   height: 100vh; /* Set the container height to viewport height */
   padding: 20px; /* Add padding */
+  margin-left: 5rem;
 }
 
 /* Title styles */
diff --git a/frontend/src/Components/Finance_Team_Page/ViewTimesheet.js b/frontend/src/Components/Finance_Team_Page/ViewTimesheet.js
index 34cdfab4..40d340f7 100644
--- a/frontend/src/Components/Finance_Team_Page/ViewTimesheet.js
+++ b/frontend/src/Components/Finance_Team_Page/ViewTimesheet.js
@@ -2,8 +2,12 @@
 
 import React, { useState } from "react";
 import styles from "./ViewTimesheet.module.css"; // Import CSS module
+import Navbar from "../../Components/Global/Navbar";
 
 function ViewTimesheet() {
+  let links = [{pageName : "Set Hourly Rate Page", pageLink : "/set_hourly_rate", iconPath : "./Home_Page_Icons/Consultant/record_timesheet.svg"},
+  {pageName : "View Timesheet Page", pageLink : "/view_timesheet", iconPath : "./Home_Page_Icons/Consultant/view_timesheet.svg"}]
+
   // Mock data for demonstration
   const [consultantName, setConsultantName] = useState("");
   const [timesheetData, setTimesheetData] = useState(null);
@@ -30,43 +34,46 @@ function ViewTimesheet() {
   };
 
   return (
-    <div className={styles.timesheetContainer}>
-      <h2 className={styles.timesheetTitle}>View Timesheet</h2>
-      <form onSubmit={handleSubmit}>
-        <label>
-          Enter Consultant's Name:
-          <input
-            type="text"
-            value={consultantName}
-            onChange={handleConsultantNameChange}
-            className={styles.consultantNameInput}
-          />
-        </label>
-        <button type="submit" className={styles.searchButton}>
-          Search
-        </button>
-      </form>
-      {timesheetData && (
-        <div className={styles.timesheetBox}>
-          <p>
-            <strong>Date:</strong> {timesheetData.date}
-          </p>
-          <p>
-            <strong>Hours Worked:</strong> {timesheetData.hoursWorked}
-          </p>
-          <p>
-            <strong>Project:</strong> {timesheetData.project}
-          </p>
-          <p>
-            <strong>Task:</strong> {timesheetData.task}
-          </p>
-          <p>
-            <strong>Description:</strong> {timesheetData.description}
-          </p>
-          {/* Additional data fields as needed */}
-        </div>
-      )}
-    </div>
+    <>
+      <Navbar homePageTitle="Finance Team Home Page" homePageLink="/finance_team_member_home_page" links={links}/>
+      <div className={styles.timesheetContainer}>
+        <h2 className={styles.timesheetTitle}>View Timesheet</h2>
+        <form onSubmit={handleSubmit}>
+          <label>
+            Enter Consultant's Name:
+            <input
+              type="text"
+              value={consultantName}
+              onChange={handleConsultantNameChange}
+              className={styles.consultantNameInput}
+            />
+          </label>
+          <button type="submit" className={styles.searchButton}>
+            Search
+          </button>
+        </form>
+        {timesheetData && (
+          <div className={styles.timesheetBox}>
+            <p>
+              <strong>Date:</strong> {timesheetData.date}
+            </p>
+            <p>
+              <strong>Hours Worked:</strong> {timesheetData.hoursWorked}
+            </p>
+            <p>
+              <strong>Project:</strong> {timesheetData.project}
+            </p>
+            <p>
+              <strong>Task:</strong> {timesheetData.task}
+            </p>
+            <p>
+              <strong>Description:</strong> {timesheetData.description}
+            </p>
+            {/* Additional data fields as needed */}
+          </div>
+        )}
+      </div>
+    </>
   );
 }
 
diff --git a/frontend/src/Components/Finance_Team_Page/ViewTimesheet.module.css b/frontend/src/Components/Finance_Team_Page/ViewTimesheet.module.css
index 6fa2af04..1bf5f17c 100644
--- a/frontend/src/Components/Finance_Team_Page/ViewTimesheet.module.css
+++ b/frontend/src/Components/Finance_Team_Page/ViewTimesheet.module.css
@@ -1,12 +1,14 @@
 /* ViewTimesheet.module.css */
 
 .timesheetContainer {
+  margin-left: 5rem;
   width: 80%;
   margin: 0 auto;
 }
 
 .timesheetTitle {
   text-align: center;
+  margin-top: 0;
 }
 
 .timesheetBox {
diff --git a/frontend/src/Components/Global/Navbar.js b/frontend/src/Components/Global/Navbar.js
index 99f9dd36..8cf59067 100644
--- a/frontend/src/Components/Global/Navbar.js
+++ b/frontend/src/Components/Global/Navbar.js
@@ -8,7 +8,7 @@ export default function Navbar(props) {
     return(<nav className={styles.navbar}>
         <ul className={styles.navContainer}>
             <li className={styles.navElement}>
-                <Link className={styles.navLink} to="/">
+                <Link className={styles.navLink} to={props.homePageLink}>
                     <img className={styles.icon} src="./Home_Page_Icons/house-solid.svg"/>
                     <p className={styles.navText} href="/">{props.homePageTitle}</p>
                 </Link>
diff --git a/frontend/src/Components/Global/Navbar.module.css b/frontend/src/Components/Global/Navbar.module.css
index 0fff4272..c4b66112 100644
--- a/frontend/src/Components/Global/Navbar.module.css
+++ b/frontend/src/Components/Global/Navbar.module.css
@@ -7,12 +7,17 @@
     align-items:start;
     transition: width 200ms ease;
     overflow: hidden;
+    position: fixed;
 }
 
 .navbar:hover{
     width: 16rem;
 }
 
+.navbar:hover body{
+    margin-left: 15rem;
+}
+
 .navbar:hover .navText{
     display: block;
 }
diff --git a/frontend/src/Components/Line_Manager_Home_Page/LineManagerLinks.js b/frontend/src/Components/Line_Manager_Home_Page/LineManagerLinks.js
index 1881cbe5..c6148744 100644
--- a/frontend/src/Components/Line_Manager_Home_Page/LineManagerLinks.js
+++ b/frontend/src/Components/Line_Manager_Home_Page/LineManagerLinks.js
@@ -5,7 +5,6 @@ function LineManagerLinks(){
     return(
         <>
             <nav>
-                <Link to="/timesheet_recording_page"><p></p></Link>
                 <Link to="/consultant_finder_page"><p>View Consultants</p></Link>
                 <Link to="/"><p>Back</p></Link>
                 <LogoutButton/>
diff --git a/frontend/src/Components/View_Timesheet_Page/ConsultantDetails.js b/frontend/src/Components/View_Timesheet_Page/ConsultantDetails.js
index 4159c29f..53271c9c 100644
--- a/frontend/src/Components/View_Timesheet_Page/ConsultantDetails.js
+++ b/frontend/src/Components/View_Timesheet_Page/ConsultantDetails.js
@@ -19,13 +19,13 @@ export default function ConsultantDetails(props) {
 
     return(
     <div className={styles.consultantDetailsContainer}>
-        <div className={styles.consultantNameContainer}>
-            <h2>Consultant Name:</h2>
-            <h2 className={styles.consultantName}>{consultantName}</h2>
+        <div className={styles.userNameContainer}>
+            <h2 className={styles.element}>Consultant Name:</h2>
+            <h2 className={styles.element}>{consultantName}</h2>
         </div>
-        <div className={styles.lineManagerContainer}>
-            <h2>Line Manager Name:</h2>
-            <h2 className={styles.lineManagerName}>{lineManagerName}</h2>
+        <div className={styles.userNameContainer}>
+            <h2 className={styles.element}>Line Manager Name:</h2>
+            <h2 className={styles.element}>{lineManagerName}</h2>
         </div>
     </div>)
 }
\ No newline at end of file
diff --git a/frontend/src/Components/View_Timesheet_Page/ConsultantDetails.module.css b/frontend/src/Components/View_Timesheet_Page/ConsultantDetails.module.css
index dac65ee3..7b655a65 100644
--- a/frontend/src/Components/View_Timesheet_Page/ConsultantDetails.module.css
+++ b/frontend/src/Components/View_Timesheet_Page/ConsultantDetails.module.css
@@ -1,26 +1,22 @@
 .consultantDetailsContainer{
     display: flex;
     flex-direction: column;
-    width: 30%;
-    position: absolute;
+    width: 20%;
+    align-items: center;
     top: 5%;
     text-align: center;
+    gap: 4rem;
+    margin-top: 3rem;
+    margin-left: 5rem;
 }
 
-.consultantName{
-    position: absolute;
-    top: 25%;
-    left: 42%;
-}
+.userNameContainer{
+    display: flex;
+    flex-direction: column;
+    gap: 1rem;
 
-.lineManagerContainer{
-    position: absolute;
-    top: 70%;
-    left: 31%;
 }
 
-.lineManagerName{
-    position: absolute;
-    top: 25%;
-    left: 25%;
+.element{
+    margin: 0;
 }
\ No newline at end of file
diff --git a/frontend/src/Components/View_Timesheet_Page/ViewTimesheetHeader.module.css b/frontend/src/Components/View_Timesheet_Page/ViewTimesheetHeader.module.css
index b78a414c..ca88b7ac 100644
--- a/frontend/src/Components/View_Timesheet_Page/ViewTimesheetHeader.module.css
+++ b/frontend/src/Components/View_Timesheet_Page/ViewTimesheetHeader.module.css
@@ -5,14 +5,14 @@
     flex-direction:column;
     width: 30%;
     position: absolute;
-    left: 35%;
+    left: 43%;
     top: 2%;
     font-family: 'Roboto', sans-serif;
 }
 
 .weekStarting{
     position: absolute;
-    left: 25%;
+    left: -5%;
     top: 60%;
     font-family: 'Roboto', sans-serif;
 }
\ No newline at end of file
diff --git a/frontend/src/Pages/Consultant/ConsultantHomePage.module.css b/frontend/src/Pages/Consultant/ConsultantHomePage.module.css
index e1077ad8..fbc13664 100644
--- a/frontend/src/Pages/Consultant/ConsultantHomePage.module.css
+++ b/frontend/src/Pages/Consultant/ConsultantHomePage.module.css
@@ -1,8 +1,6 @@
 .main{
     margin-left: 5rem;
     padding: 1rem;
-    position: absolute;
-    left: 40rem;
 }
 
 body{
diff --git a/frontend/src/Pages/Consultant/TimesheetRecordingPage.module.css b/frontend/src/Pages/Consultant/TimesheetRecordingPage.module.css
new file mode 100644
index 00000000..0cea1d6c
--- /dev/null
+++ b/frontend/src/Pages/Consultant/TimesheetRecordingPage.module.css
@@ -0,0 +1,10 @@
+.main{
+    margin-left: 5rem;
+    padding: 1rem;
+}
+
+
+body{
+    margin: 0;
+    padding: 0;
+}
\ No newline at end of file
diff --git a/frontend/src/Pages/Consultant/TimesheetViewPage.module.css b/frontend/src/Pages/Consultant/TimesheetViewPage.module.css
index fb7f6353..1355a5cf 100644
--- a/frontend/src/Pages/Consultant/TimesheetViewPage.module.css
+++ b/frontend/src/Pages/Consultant/TimesheetViewPage.module.css
@@ -1,5 +1,15 @@
 @import url('https://fonts.googleapis.com/css2?family=Roboto:wght@400;700&display=swap');
 
+.main{
+    margin-left: 5rem;
+    padding: 1rem;
+}
+
+body{
+    margin: 0;
+    padding: 0;
+}
+
 .pageContainer{
     font-family: 'Roboto', sans-serif;
 }
diff --git a/frontend/src/Pages/Consultant/consultant_home_page.js b/frontend/src/Pages/Consultant/consultant_home_page.js
index c825f5ba..0d339bbc 100644
--- a/frontend/src/Pages/Consultant/consultant_home_page.js
+++ b/frontend/src/Pages/Consultant/consultant_home_page.js
@@ -1,4 +1,4 @@
-import ConsultantLinks from "../../Components/Consultant_Home_Page/ConsultantLinks";
+import LogoutButton from "../../Components/Global/LogoutButton";
 import Navbar from "../../Components/Global/Navbar";
 import styles from './ConsultantHomePage.module.css'
 
@@ -10,10 +10,11 @@ function ConsultantHomePage () {
     {pageName : "View Saved Timesheets", pageLink : "/", iconPath : "./Home_Page_Icons/Consultant/view_saved_timesheets.svg"}]
 
     return(<>
+            <Navbar homePageTitle="Consultant Home Page" homePageLink="/consultant_home_page" links={links}/>
             <main className={styles.main}>
                 <h1>Consultant Home Page</h1>
+                <LogoutButton/>
             </main>
-            <Navbar homePageTitle="Consultant Home Page" links={links}/>
         </>
     )
 }
diff --git a/frontend/src/Pages/Consultant/timesheet_recording_page.js b/frontend/src/Pages/Consultant/timesheet_recording_page.js
index 15e3a3fb..a285cd77 100644
--- a/frontend/src/Pages/Consultant/timesheet_recording_page.js
+++ b/frontend/src/Pages/Consultant/timesheet_recording_page.js
@@ -1,19 +1,21 @@
 import TimesheetFormDay from "../../Components/Timesheet_Recording_Page/Form_At_Day/timesheet_form_day"
-import TimesheetPageLinks from "../../Components/Timesheet_Recording_Page/Timesheet_Links/timesheet_page_links"
+import Navbar from "../../Components/Global/Navbar"
+import styles from "./TimesheetRecordingPage.module.css"
 
 function TimesheetRecordingPage(){
-    return(
-        <>
-            <h1>Timesheet Recording Page</h1><br/>
+    document.title = "Timesheet Recording Page"
 
-            {/*this just adds days to the timesheet form*/}
-            {/*<TimesheetFormDay day="Monday"/>*/}
-            {/*<TimesheetFormDay day="Tuesday"/>*/}
-            {/*<TimesheetFormDay day="Wednesday"/>*/}
-            {/*<TimesheetFormDay day="Thursday"/>*/}
+    let links = [{pageName : "Create Timesheet", pageLink : "/timesheet_recording_page", iconPath : "./Home_Page_Icons/Consultant/record_timesheet.svg"}, 
+    {pageName : "View Timesheet", pageLink : "/current_timesheet_viewer", iconPath : "./Home_Page_Icons/Consultant/view_timesheet.svg"},
+    {pageName : "View Saved Timesheets", pageLink : "/", iconPath : "./Home_Page_Icons/Consultant/view_saved_timesheets.svg"}]
 
-            <TimesheetFormDay day="Friday"/><br/>
-            <TimesheetPageLinks/>
+    return(
+        <>
+            <Navbar homePageTitle="Consultant Home Page" homePageLink="/consultant_home_page" links={links}/>
+            <main className={styles.main}>
+                <h1>Timesheet Recording Page</h1><br/>
+                <TimesheetFormDay day="Friday"/><br/>
+            </main>
         </>
     )    
 }
diff --git a/frontend/src/Pages/Consultant/view_current_timesheet_page.js b/frontend/src/Pages/Consultant/view_current_timesheet_page.js
index ab0c6671..c1bcfd78 100644
--- a/frontend/src/Pages/Consultant/view_current_timesheet_page.js
+++ b/frontend/src/Pages/Consultant/view_current_timesheet_page.js
@@ -1,15 +1,21 @@
 import DailyRate from "../../Components/View_Timesheet_Page/DailyRate";
 import TimesheetTable from "../../Components/View_Timesheet_Page/TimesheetTable";
-import { Link } from "react-router-dom";
 import styles from './TimesheetViewPage.module.css';
+import Navbar from "../../Components/Global/Navbar";
 
 function ViewCurrentTimesheetPage () {
     document.title = "Current Timesheet Viewer Page";
 
+    let links = [{pageName : "Create Timesheet", pageLink : "/timesheet_recording_page", iconPath : "./Home_Page_Icons/Consultant/record_timesheet.svg"}, 
+    {pageName : "View Timesheet", pageLink : "/current_timesheet_viewer", iconPath : "./Home_Page_Icons/Consultant/view_timesheet.svg"},
+    {pageName : "View Saved Timesheets", pageLink : "/", iconPath : "./Home_Page_Icons/Consultant/view_saved_timesheets.svg"}]
+
     return(<>
-        <DailyRate/>
-        <TimesheetTable/>
-        <Link to="/consultant_home_page"><button className={styles.backButton}>Back</button></Link>
+        <Navbar homePageTitle="Consultant Home Page" homePageLink="/consultant_home_page" links={links}/>
+        <main className={styles.main}>
+            <DailyRate/>
+            <TimesheetTable/>
+        </main>
     </>)
 }
 
diff --git a/frontend/src/Pages/Finance_Team/finance_team_mem_home_page.js b/frontend/src/Pages/Finance_Team/finance_team_mem_home_page.js
index 9b703ae5..6189910a 100644
--- a/frontend/src/Pages/Finance_Team/finance_team_mem_home_page.js
+++ b/frontend/src/Pages/Finance_Team/finance_team_mem_home_page.js
@@ -1,27 +1,23 @@
 // FinanceTeamMemberHomePage.js
 import React from "react";
-import { Link } from "react-router-dom";
 import styles from "./finance_team_member_home_page.module.css"; // Import the CSS file
+import Navbar from "../../Components/Global/Navbar";
 
 function FinanceTeamMemberHomePage() {
+  document.title = "Finance Team Home Page"
+
+  let links = [{pageName : "Set Hourly Rate Page", pageLink : "/set_hourly_rate", iconPath : "./Home_Page_Icons/Consultant/record_timesheet.svg"},
+              {pageName : "View Timesheet Page", pageLink : "/view_timesheet", iconPath : "./Home_Page_Icons/Consultant/view_timesheet.svg"}]
+
   return (
-    <div className={styles.financeTeamMemberContainer}>
-      <h1 className={styles.financeTeamMemberHeading}>
-        Finance Team Member Home Page
-      </h1>
-      <div style={{ textAlign: "center" }}>
-        <Link to="/set_hourly_rate">
-          <button className={styles.financeTeamMemberButton}>
-            Set Hourly Rate
-          </button>
-        </Link>
-        <Link to="/view_timesheet">
-          <button className={styles.financeTeamMemberButton}>
-            View Timesheet
-          </button>
-        </Link>
+    <>
+      <Navbar homePageTitle="Finance Team Home Page" homePageLink="/finance_team_member_home_page" links={links}/>
+      <div className={styles.financeTeamMemberContainer}>
+        <h1 className={styles.financeTeamMemberHeading}>
+          Finance Team Member Home Page
+        </h1>
       </div>
-    </div>
+    </>
   );
 }
 
diff --git a/frontend/src/Pages/Finance_Team/finance_team_member_home_page.module.css b/frontend/src/Pages/Finance_Team/finance_team_member_home_page.module.css
index ee59f4e2..c8f0f5d8 100644
--- a/frontend/src/Pages/Finance_Team/finance_team_member_home_page.module.css
+++ b/frontend/src/Pages/Finance_Team/finance_team_member_home_page.module.css
@@ -1,5 +1,15 @@
 /* FinanceTeamMemberHomePage.module.css */
 
+.financeTeamMemberContainer{
+  margin-left: 5rem;
+  padding: 1rem;
+}
+
+body{
+  margin: 0;
+  padding: 0;
+}
+
 /* Button styles */
 .financeTeamMemberButton {
   padding: 30px 60px;
diff --git a/frontend/src/Pages/IT_Technician/ITDifficultiesPage.module.css b/frontend/src/Pages/IT_Technician/ITDifficultiesPage.module.css
new file mode 100644
index 00000000..89520214
--- /dev/null
+++ b/frontend/src/Pages/IT_Technician/ITDifficultiesPage.module.css
@@ -0,0 +1,4 @@
+.main{
+    margin-left: 5rem;
+    padding: 1rem;
+}
\ No newline at end of file
diff --git a/frontend/src/Pages/IT_Technician/it_difficulties_page.js b/frontend/src/Pages/IT_Technician/it_difficulties_page.js
index 565fac31..b177ea66 100644
--- a/frontend/src/Pages/IT_Technician/it_difficulties_page.js
+++ b/frontend/src/Pages/IT_Technician/it_difficulties_page.js
@@ -1,19 +1,28 @@
 import ITDifficultyHeader from "../../Components/IT_Technician_Page/ITDifficultyHeader";
 import ITDifficulty from "../../Components/IT_Technician_Page/ITDifficulty";
+import Navbar from "../../Components/Global/Navbar";
+import styles from "./ITDifficultiesPage.module.css";
 
 function IT_Difficulties_Page () {
     document.title = "IT Difficulties";
 
+    let links = [{pageName : "View It Difficulties", pageLink : "/it_difficulties", iconPath : "./Home_Page_Icons/Consultant/record_timesheet.svg"}, 
+    {pageName : "View Timesheet Edit Requests", pageLink : "/timesheet_edit_requests", iconPath : "./Home_Page_Icons/Consultant/view_timesheet.svg"},
+    {pageName : "Create User", pageLink : "/it_user_creation", iconPath : "./Home_Page_Icons/Consultant/view_saved_timesheets.svg"}]
+
     return(
         <>
-            <h1>IT Difficulties</h1>
-            <ITDifficultyHeader/><br/>
-            <ITDifficulty difficultyNo="1" difficultyTopic="Change Password Request" difficultySolved="Unsolved" technicianName="N/A"/><br/>
-            <ITDifficulty difficultyNo="2" difficultyTopic="Create New Account Request" difficultySolved="Unsolved" technicianName="N/A"/><br/>
-            <ITDifficulty difficultyNo="3" difficultyTopic="Check Database Update" difficultySolved="Unsolved" technicianName="N/A"/><br/>
-            <ITDifficulty difficultyNo="4" difficultyTopic="Data Protection Check" difficultySolved="Unsolved" technicianName="N/A"/><br/>
-            <ITDifficulty difficultyNo="5" difficultyTopic="Change Password Request" difficultySolved="Unsolved" technicianName="N/A"/><br/>
-            <ITDifficulty difficultyNo="6" difficultyTopic="Change Password Request" difficultySolved="Unsolved" technicianName="N/A"/>
+            <Navbar homePageTitle="IT Technician Home Page" homePageLink="/it_technician_home_page" links={links}/>
+            <div className={styles.main}>
+                <h1>IT Difficulties</h1>
+                <ITDifficultyHeader/><br/>
+                <ITDifficulty difficultyNo="1" difficultyTopic="Change Password Request" difficultySolved="Unsolved" technicianName="N/A"/><br/>
+                <ITDifficulty difficultyNo="2" difficultyTopic="Create New Account Request" difficultySolved="Unsolved" technicianName="N/A"/><br/>
+                <ITDifficulty difficultyNo="3" difficultyTopic="Check Database Update" difficultySolved="Unsolved" technicianName="N/A"/><br/>
+                <ITDifficulty difficultyNo="4" difficultyTopic="Data Protection Check" difficultySolved="Unsolved" technicianName="N/A"/><br/>
+                <ITDifficulty difficultyNo="5" difficultyTopic="Change Password Request" difficultySolved="Unsolved" technicianName="N/A"/><br/>
+                <ITDifficulty difficultyNo="6" difficultyTopic="Change Password Request" difficultySolved="Unsolved" technicianName="N/A"/>
+            </div>
         </>
     )
 }
diff --git a/frontend/src/Pages/IT_Technician/it_technician_home_page.js b/frontend/src/Pages/IT_Technician/it_technician_home_page.js
index 5cd542bf..e1657ce7 100644
--- a/frontend/src/Pages/IT_Technician/it_technician_home_page.js
+++ b/frontend/src/Pages/IT_Technician/it_technician_home_page.js
@@ -1,15 +1,21 @@
-import ITLinks from "../../Components/IT_Technician_Page/ITLinks";
 import styles from "./it_technician_home_page.module.css";
+import Navbar from "../../Components/Global/Navbar";
+import LogoutButton from "../../Components/Global/LogoutButton";
+
 
 function IT_Technician_HomePage() {
     document.title = "IT Technician Home Page";
 
+    let links = [{pageName : "View It Difficulties", pageLink : "/it_difficulties", iconPath : "./Home_Page_Icons/Consultant/record_timesheet.svg"}, 
+    {pageName : "View Timesheet Edit Requests", pageLink : "/timesheet_edit_requests", iconPath : "./Home_Page_Icons/Consultant/view_timesheet.svg"},
+    {pageName : "Create User", pageLink : "/it_user_creation", iconPath : "./Home_Page_Icons/Consultant/view_saved_timesheets.svg"}]
+
     return (
         <>
-            <img className={styles.backImg} src="./it_home_bg.png"/>
+            <Navbar homePageTitle="IT Technician Home Page" homePageLink="/it_technician_home_page" links={links}/>
             <div className={styles.mainContainer}>
                 <h1>Home</h1>
-                <ITLinks />
+                <LogoutButton/>
             </div>
         </>
     )
diff --git a/frontend/src/Pages/IT_Technician/it_technician_home_page.module.css b/frontend/src/Pages/IT_Technician/it_technician_home_page.module.css
index 135829d1..0372a5de 100644
--- a/frontend/src/Pages/IT_Technician/it_technician_home_page.module.css
+++ b/frontend/src/Pages/IT_Technician/it_technician_home_page.module.css
@@ -1,21 +1,19 @@
-
-.backImg {
-    position: absolute;
-    width: 100%;
-    height: 100vh;
-    filter: brightness(50%);
-}
-
 .mainContainer {
-    position: relative;
     display: flex;
     justify-content: space-evenly;
     align-items: center;
     height: 100vh;
+    margin-left: 5rem;
+    padding: 1rem;
 }
 
-.mainContainer h1 {
+.main h1 {
     font-family: "Poppins", sans-serif;
     font-size: 36pt;
     color: #ffffffd5;
+}
+
+body{
+    margin: 0;
+    padding: 0;
 }
\ No newline at end of file
diff --git a/frontend/src/Pages/IT_Technician/it_user_creation_page.js b/frontend/src/Pages/IT_Technician/it_user_creation_page.js
index 92001896..6cf5e6f1 100644
--- a/frontend/src/Pages/IT_Technician/it_user_creation_page.js
+++ b/frontend/src/Pages/IT_Technician/it_user_creation_page.js
@@ -1,14 +1,23 @@
 import UserAccountCreation from "../../Components/IT_Technician_Page/UserAccountCreation";
 import styles from "./it_user_creation_page.module.css";
+import Navbar from "../../Components/Global/Navbar";
 
 function IT_User_Creation_Page() {
     document.title = "IT Technician: User Creation Page";
 
+    let links = [{pageName : "View It Difficulties", pageLink : "/it_difficulties", iconPath : "./Home_Page_Icons/Consultant/record_timesheet.svg"}, 
+    {pageName : "View Timesheet Edit Requests", pageLink : "/timesheet_edit_requests", iconPath : "./Home_Page_Icons/Consultant/view_timesheet.svg"},
+    {pageName : "Create User", pageLink : "/it_user_creation", iconPath : "./Home_Page_Icons/Consultant/view_saved_timesheets.svg"}]
+
     return (
         <>
-            <div className={styles.container}>
-                <UserAccountCreation/>
-            </div>
+            <Navbar homePageTitle="IT Technician Home Page" homePageLink="/it_technician_home_page" links={links}/>
+
+            <main className={styles.main}>
+                <div className={styles.container}>
+                    <UserAccountCreation/>
+                </div>
+            </main>
         </>
     )
 }
diff --git a/frontend/src/Pages/IT_Technician/it_user_creation_page.module.css b/frontend/src/Pages/IT_Technician/it_user_creation_page.module.css
index 7b5275fc..f12ed881 100644
--- a/frontend/src/Pages/IT_Technician/it_user_creation_page.module.css
+++ b/frontend/src/Pages/IT_Technician/it_user_creation_page.module.css
@@ -1,4 +1,9 @@
 
 .container {
     background: #012E6E;
+}
+
+body{
+    margin: 0;
+    padding: 0;
 }
\ No newline at end of file
diff --git a/frontend/src/Pages/Line_Manager/ConsultantFinderPage.module.css b/frontend/src/Pages/Line_Manager/ConsultantFinderPage.module.css
new file mode 100644
index 00000000..fbc13664
--- /dev/null
+++ b/frontend/src/Pages/Line_Manager/ConsultantFinderPage.module.css
@@ -0,0 +1,9 @@
+.main{
+    margin-left: 5rem;
+    padding: 1rem;
+}
+
+body{
+    margin: 0;
+    padding: 0;
+}
\ No newline at end of file
diff --git a/frontend/src/Pages/Line_Manager/LineManagerHomePage.module.css b/frontend/src/Pages/Line_Manager/LineManagerHomePage.module.css
new file mode 100644
index 00000000..fbc13664
--- /dev/null
+++ b/frontend/src/Pages/Line_Manager/LineManagerHomePage.module.css
@@ -0,0 +1,9 @@
+.main{
+    margin-left: 5rem;
+    padding: 1rem;
+}
+
+body{
+    margin: 0;
+    padding: 0;
+}
\ No newline at end of file
diff --git a/frontend/src/Pages/Line_Manager/consultant_finder_page.js b/frontend/src/Pages/Line_Manager/consultant_finder_page.js
index abaccdc3..c6d109ee 100644
--- a/frontend/src/Pages/Line_Manager/consultant_finder_page.js
+++ b/frontend/src/Pages/Line_Manager/consultant_finder_page.js
@@ -1,10 +1,19 @@
 import ConsultantFinder from "../../Components/Line_Manager_Home_Page/ConsultantFinder";
+import Navbar from "../../Components/Global/Navbar";
+import styles from "./ConsultantFinderPage.module.css";
 
 function ConsultantFinderPage() {
+    document.title = "Consultant Finder Page";
+
+    let links = [{pageName : "Consultant Finder", pageLink : "/consultant_finder_page", iconPath : "./Home_Page_Icons/Consultant/record_timesheet.svg"}]
+
     return(
         <>
-            <h1>Consultant Finder</h1>
-            <ConsultantFinder/>
+            <Navbar homePageTitle="Line Manager Home Page" homePageLink="/line_manager_home_page" links={links}/>
+            <main className={styles.main}>
+                <h1>Consultant Finder</h1>
+                <ConsultantFinder/>
+            </main>
         </>
     )
 }
diff --git a/frontend/src/Pages/Line_Manager/line_manager_home_page.js b/frontend/src/Pages/Line_Manager/line_manager_home_page.js
index 5aa133f8..75d54c72 100644
--- a/frontend/src/Pages/Line_Manager/line_manager_home_page.js
+++ b/frontend/src/Pages/Line_Manager/line_manager_home_page.js
@@ -1,12 +1,17 @@
-import LineManagerLinks from "../../Components/Line_Manager_Home_Page/LineManagerLinks";
+import styles from "./LineManagerHomePage.module.css";
+import Navbar from "../../Components/Global/Navbar";
 
 function LineManagerHomePage(){
     document.title = "Line Manager Home Page";
 
+    let links = [{pageName : "Consultant Finder", pageLink : "/consultant_finder_page", iconPath : "./Home_Page_Icons/Consultant/record_timesheet.svg"}]
+
     return(
         <>
-            <h1>Line Manager Home Page</h1>
-            <LineManagerLinks/>
+            <Navbar homePageTitle="Line Manager Home Page" homePageLink="/line_manager_home_page" links={links}/>
+            <main className={styles.main}>
+                <h1>Line Manager Home Page</h1>
+            </main>
         </>
     )
 }

From e121e1ff95ce7305fdf024434877a1e3a00a9d49 Mon Sep 17 00:00:00 2001
From: Luke Liew Mouawad <ec22711@qmul.ac.uk>
Date: Wed, 3 Apr 2024 16:13:42 +0100
Subject: [PATCH 14/22] bug fixes with line manager page

---
 .../Line_Manager_Home_Page/ConsultantCard.js      |  2 +-
 .../ConsultantCard.module.css                     | 15 +++++++++++++--
 2 files changed, 14 insertions(+), 3 deletions(-)

diff --git a/frontend/src/Components/Line_Manager_Home_Page/ConsultantCard.js b/frontend/src/Components/Line_Manager_Home_Page/ConsultantCard.js
index 51710e77..d7817028 100644
--- a/frontend/src/Components/Line_Manager_Home_Page/ConsultantCard.js
+++ b/frontend/src/Components/Line_Manager_Home_Page/ConsultantCard.js
@@ -3,7 +3,7 @@ import styles from './ConsultantCard.module.css';
 export default function ConsultantCard (props) {
     return(
     <div className={styles.cardContainer}>
-        <figure>
+        <figure className={styles.iconContainer}>
             <img className={styles.userIcon} src="/user_icon.png"/>
         </figure>
         <h2 className={styles.name}>{props.name}</h2>
diff --git a/frontend/src/Components/Line_Manager_Home_Page/ConsultantCard.module.css b/frontend/src/Components/Line_Manager_Home_Page/ConsultantCard.module.css
index 99d0b9eb..47a13a3f 100644
--- a/frontend/src/Components/Line_Manager_Home_Page/ConsultantCard.module.css
+++ b/frontend/src/Components/Line_Manager_Home_Page/ConsultantCard.module.css
@@ -1,4 +1,7 @@
 .cardContainer{
+    display: flex;
+    flex-direction: column;
+    align-items: center;
     background-color: #AEAEAE;
     padding: 1em; 
     border-radius: 1.5em;
@@ -13,9 +16,17 @@
     width: 95%;
 }
 
+.iconContainer{
+    margin-bottom: 0;
+    margin-top: 0;
+}
+
 .name{
     color: black;
     text-align: center;
+    margin-top: 1rem;
+    margin-bottom: 0;
+    width: 20rem;
 }
 
 .viewTimesheetBtn{
@@ -25,6 +36,6 @@
     padding: 0.55em;
     font-size: 1em;
     cursor: pointer;
-    position: absolute;
-    bottom: 60%;
+    margin-top: 1rem;
+    margin-bottom: 3rem;
 }
\ No newline at end of file

From 2eaaf17154762940bc87dd81ee646b8b3dcb4e3b Mon Sep 17 00:00:00 2001
From: delterr <hasanahmadcodes@gmail.com>
Date: Wed, 3 Apr 2024 17:31:25 +0100
Subject: [PATCH 15/22] added endpoint for listing consultants

---
 .../679eaac484e8efec851e5d02a21b12ac          | Bin 79 -> 79 bytes
 .../d809bf2dcbe2110e634be9cd9bce2102          | Bin 79 -> 79 bytes
 backend/timesheets/routes.py                  |  26 +++++++++++-------
 3 files changed, 16 insertions(+), 10 deletions(-)

diff --git a/backend/flask_session/679eaac484e8efec851e5d02a21b12ac b/backend/flask_session/679eaac484e8efec851e5d02a21b12ac
index b7dd24c47092b81d10a2a4237124e50944054d53..38c94ea60c0aff07b8f4fda0305dd3870d9caffa 100644
GIT binary patch
delta 45
zcmebGXWpA+Hj!CV*}}reG|9}u$TG>q!o)JoG|9ru%se$MDcK;!)W9g!cuJ`r02f#c
Ah5!Hn

delta 45
zcmebGXLc+woye@IoRVT{mYiy4o|=}FVq#)!oM@C}Y?*9kXli0=lx$&QI;B((02<p2
AWdHyG

diff --git a/backend/flask_session/d809bf2dcbe2110e634be9cd9bce2102 b/backend/flask_session/d809bf2dcbe2110e634be9cd9bce2102
index a0193b2fa7eb83b868b47d5338c3cd1935798b35..2589197904728dc38dca774b99c4655c071a05c4 100644
GIT binary patch
delta 45
zcmebGXRbSFI+0mZIVHu^EIHN8JT)yT#l*zeIMFD{*fQD7(A31#DA~fqbV{in05R4K
A^8f$<

delta 45
zcmebGXI8##GLczR+1NbA%sesC$k@Ov*~Hi)*&^A{EY;A$)X31>IL+A1cuJ`r01*re
A>;M1&

diff --git a/backend/timesheets/routes.py b/backend/timesheets/routes.py
index 66969798..96446237 100644
--- a/backend/timesheets/routes.py
+++ b/backend/timesheets/routes.py
@@ -23,6 +23,22 @@ class HomeView(MethodView):
     def get(self):
         return "Done", 200
 
+class ListConsultantsView(MethodView):
+    def get(self):
+        user_id = session.get("user_id")
+        line_manager = LineManager.query.filter_by(id=user_id)
+        
+        if line_manager != None:
+            consultants = Consultant.query.filter_by(line_manager_id=user_id)
+        else:
+            return jsonify({"Error": "Unauthorized"}), 400
+        
+        json_dict = {}
+        for consultant in consultants:
+            json_dict[consultant.username] = {"username": consultant.username, "consultant_id": consultant.id}
+            
+        return jsonify(json_dict), 200
+        
 
 class CurrentUserView(MethodView):
     def get(self):
@@ -189,16 +205,6 @@ def post(self, consultant_username, flag):
                 return jsonify({"Error": "Invalid flag"}), 400
         
         return jsonify("Success"), 200
-        
-
-class ListConsultantsView(MethodView):
-    def get(self):
-        user_id = session.get("user_id")
-        consultants = Consultant.query.filter_by(line_manager_id=user_id)
-        json_dict = {}
-        for consultant in consultants:
-            json_dict[consultant.id] = consultant.username 
-        return jsonify(json_dict), 200
 
 class ListConsultantTimesheetsView(MethodView):
     def get(self, consultant_id):

From 9011ce87d212d086e6cb65c2e8753afc48f0fe73 Mon Sep 17 00:00:00 2001
From: delterr <hasanahmadcodes@gmail.com>
Date: Wed, 3 Apr 2024 17:48:53 +0100
Subject: [PATCH 16/22] update update

---
 .../679eaac484e8efec851e5d02a21b12ac              | Bin 79 -> 79 bytes
 backend/timesheets/routes.py                      |   2 +-
 2 files changed, 1 insertion(+), 1 deletion(-)

diff --git a/backend/flask_session/679eaac484e8efec851e5d02a21b12ac b/backend/flask_session/679eaac484e8efec851e5d02a21b12ac
index 38c94ea60c0aff07b8f4fda0305dd3870d9caffa..cf3196bc86d7f3dedbdcf08f36832d3aa6904644 100644
GIT binary patch
delta 7
OcmebGXZ$~r(GLI$4g!Aw

delta 7
OcmebGXWToH(GLI#1_C_*

diff --git a/backend/timesheets/routes.py b/backend/timesheets/routes.py
index 96446237..f6959a0d 100644
--- a/backend/timesheets/routes.py
+++ b/backend/timesheets/routes.py
@@ -155,7 +155,7 @@ def get(self):
         json_dict = {}
         timesheet_ids = [timesheet.id for timesheet in timesheets]
         for timesheet in timesheets:
-            json_dict[timesheet.id] = {"name": timesheet.consultant_name, "status": timesheet.status}
+            json_dict[timesheet.id] = {"id": timesheet.id, "name": timesheet.consultant_name, "status": timesheet.status}
         return jsonify(json_dict), 200
 
 class ListWeeklyTimesheetsView(MethodView):

From 366f46828a37ccd210e334bbfea215b34f4f7c5f Mon Sep 17 00:00:00 2001
From: Luke Liew Mouawad <ec22711@qmul.ac.uk>
Date: Wed, 3 Apr 2024 18:19:05 +0100
Subject: [PATCH 17/22] cleaned up line manager search page and added login
 button to navbar

---
 frontend/public/Home_Page_Icons/logout.svg             |  1 +
 frontend/src/Components/Global/LogoutButton.js         |  5 +++--
 frontend/src/Components/Global/LogoutButton.module.css | 10 ++++++++--
 frontend/src/Components/Global/Navbar.js               |  5 +++++
 frontend/src/Components/Global/Navbar.module.css       |  6 +++++-
 .../Line_Manager_Home_Page/ConsultantCard.module.css   |  3 ++-
 .../Line_Manager_Home_Page/ConsultantFinder.module.css |  3 ++-
 .../Pages/Consultant/TimesheetRecordingPage.module.css |  2 +-
 frontend/src/Pages/Consultant/consultant_home_page.js  |  1 -
 9 files changed, 27 insertions(+), 9 deletions(-)
 create mode 100644 frontend/public/Home_Page_Icons/logout.svg

diff --git a/frontend/public/Home_Page_Icons/logout.svg b/frontend/public/Home_Page_Icons/logout.svg
new file mode 100644
index 00000000..1b6b9710
--- /dev/null
+++ b/frontend/public/Home_Page_Icons/logout.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><!--!Font Awesome Free 6.5.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2024 Fonticons, Inc.--><path d="M377.9 105.9L500.7 228.7c7.2 7.2 11.3 17.1 11.3 27.3s-4.1 20.1-11.3 27.3L377.9 406.1c-6.4 6.4-15 9.9-24 9.9c-18.7 0-33.9-15.2-33.9-33.9l0-62.1-128 0c-17.7 0-32-14.3-32-32l0-64c0-17.7 14.3-32 32-32l128 0 0-62.1c0-18.7 15.2-33.9 33.9-33.9c9 0 17.6 3.6 24 9.9zM160 96L96 96c-17.7 0-32 14.3-32 32l0 256c0 17.7 14.3 32 32 32l64 0c17.7 0 32 14.3 32 32s-14.3 32-32 32l-64 0c-53 0-96-43-96-96L0 128C0 75 43 32 96 32l64 0c17.7 0 32 14.3 32 32s-14.3 32-32 32z"/></svg>
\ No newline at end of file
diff --git a/frontend/src/Components/Global/LogoutButton.js b/frontend/src/Components/Global/LogoutButton.js
index a504b116..f775020a 100644
--- a/frontend/src/Components/Global/LogoutButton.js
+++ b/frontend/src/Components/Global/LogoutButton.js
@@ -24,8 +24,9 @@ function LogoutButton () {
         });
     };
 
-    return(<div>
-        <button className={styles.Logout} onClick={handleLogout}>Logout</button>
+    return(<div className={styles.logoutContainer}>
+        <img className={styles.Logout} src='./Home_Page_Icons/logout.svg' onClick={handleLogout}/>
+        <p className={styles.logoutText}>Logout</p>
     </div>);
 }
 
diff --git a/frontend/src/Components/Global/LogoutButton.module.css b/frontend/src/Components/Global/LogoutButton.module.css
index 9b8d8f89..15dd1e84 100644
--- a/frontend/src/Components/Global/LogoutButton.module.css
+++ b/frontend/src/Components/Global/LogoutButton.module.css
@@ -1,11 +1,12 @@
 .Logout{
     padding: 0.7pc 0.1pc;
-    width: 100px;
+    width: 55px;
+    max-height: 40px;
     cursor: pointer;
     border: none;
     background-image: linear-gradient(to right, blue, purple);
     left: 20%;
-    border-radius: 25px;
+    border-radius: 10px;
     color: white;
     height: 3rem;
     text-align: center;
@@ -13,4 +14,9 @@
     padding-top: 0.5rem;
     font-family: Arial, Helvetica, sans-serif;
     font-size: 1rem;
+    margin-left: 0.65rem;
+}
+
+.logoutText{
+    margin-left: 0.95rem;
 }
\ No newline at end of file
diff --git a/frontend/src/Components/Global/Navbar.js b/frontend/src/Components/Global/Navbar.js
index 8cf59067..b979d186 100644
--- a/frontend/src/Components/Global/Navbar.js
+++ b/frontend/src/Components/Global/Navbar.js
@@ -1,5 +1,6 @@
 import { Link } from 'react-router-dom'
 import styles from './Navbar.module.css'
+import Logout from '../Global/LogoutButton'
 
 export default function Navbar(props) {
     let linksArray = props.links
@@ -21,6 +22,10 @@ export default function Navbar(props) {
                     </Link>
                 </li>
             ))}
+
         </ul>
+        <div className={styles.logoutButton}>
+                <Logout/>
+            </div>
     </nav>)
 }
\ No newline at end of file
diff --git a/frontend/src/Components/Global/Navbar.module.css b/frontend/src/Components/Global/Navbar.module.css
index c4b66112..158a98de 100644
--- a/frontend/src/Components/Global/Navbar.module.css
+++ b/frontend/src/Components/Global/Navbar.module.css
@@ -1,7 +1,7 @@
 .navbar{
     background-color: #D9D9D9;
     width: 5rem;
-    height: 100vh;
+    height: 100%;
     display: flex;
     flex-direction: column;
     align-items:start;
@@ -51,4 +51,8 @@
     min-width: 3rem;
     margin: 0 1rem;
     width: 2rem;
+}
+
+.logoutButton{
+    margin-top: auto;
 }
\ No newline at end of file
diff --git a/frontend/src/Components/Line_Manager_Home_Page/ConsultantCard.module.css b/frontend/src/Components/Line_Manager_Home_Page/ConsultantCard.module.css
index 47a13a3f..cb4ae7a9 100644
--- a/frontend/src/Components/Line_Manager_Home_Page/ConsultantCard.module.css
+++ b/frontend/src/Components/Line_Manager_Home_Page/ConsultantCard.module.css
@@ -7,7 +7,8 @@
     border-radius: 1.5em;
     box-shadow: -0.2em 0.2em 0.2em hsla(0, 0%, 24%, 0.753);
     margin: 1pc;
-    max-height: 60%;
+    max-height: 11rem;
+    min-height: 11rem;
     width: 50%;
     flex-shrink: 0;
 }
diff --git a/frontend/src/Components/Line_Manager_Home_Page/ConsultantFinder.module.css b/frontend/src/Components/Line_Manager_Home_Page/ConsultantFinder.module.css
index c736e7f8..2f5f6fbd 100644
--- a/frontend/src/Components/Line_Manager_Home_Page/ConsultantFinder.module.css
+++ b/frontend/src/Components/Line_Manager_Home_Page/ConsultantFinder.module.css
@@ -33,7 +33,7 @@
     display: grid;
     grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
     grid-template-rows: 1fr;
-    align-items: center;
+    align-items: flex-start;
     justify-items: center;
     gap: 0px;
     z-index: 1;
@@ -43,6 +43,7 @@
     position: absolute;
     left: 10%;
     background-color: #D9D9D9;
+    min-height: 35em;
 }
 
 .searchResultsContainer{
diff --git a/frontend/src/Pages/Consultant/TimesheetRecordingPage.module.css b/frontend/src/Pages/Consultant/TimesheetRecordingPage.module.css
index f4be51f3..6944c54e 100644
--- a/frontend/src/Pages/Consultant/TimesheetRecordingPage.module.css
+++ b/frontend/src/Pages/Consultant/TimesheetRecordingPage.module.css
@@ -14,7 +14,7 @@ body{
 .mainContainer {
     margin-left: 5rem;
     padding: 1rem;
-    width: 100%;
+    width: 90%;
     display: flex;
     flex-direction: column;
     justify-content: center;
diff --git a/frontend/src/Pages/Consultant/consultant_home_page.js b/frontend/src/Pages/Consultant/consultant_home_page.js
index 0d339bbc..d84332d1 100644
--- a/frontend/src/Pages/Consultant/consultant_home_page.js
+++ b/frontend/src/Pages/Consultant/consultant_home_page.js
@@ -13,7 +13,6 @@ function ConsultantHomePage () {
             <Navbar homePageTitle="Consultant Home Page" homePageLink="/consultant_home_page" links={links}/>
             <main className={styles.main}>
                 <h1>Consultant Home Page</h1>
-                <LogoutButton/>
             </main>
         </>
     )

From eae6c3f3d01e18668128c3a7e61e900fd7d4406e Mon Sep 17 00:00:00 2001
From: Luke Liew Mouawad <ec22711@qmul.ac.uk>
Date: Wed, 3 Apr 2024 19:24:01 +0100
Subject: [PATCH 18/22] connecting line manager search to backend

---
 .../ConsultantFinder.js                       | 42 ++++++++++++++++++-
 1 file changed, 41 insertions(+), 1 deletion(-)

diff --git a/frontend/src/Components/Line_Manager_Home_Page/ConsultantFinder.js b/frontend/src/Components/Line_Manager_Home_Page/ConsultantFinder.js
index 419b62a4..d2452289 100644
--- a/frontend/src/Components/Line_Manager_Home_Page/ConsultantFinder.js
+++ b/frontend/src/Components/Line_Manager_Home_Page/ConsultantFinder.js
@@ -1,4 +1,4 @@
-import { useState } from "react"
+import { useState, useEffect } from "react"
 import styles from './ConsultantFinder.module.css';
 import ConsultantCard from "./ConsultantCard";
 
@@ -18,10 +18,50 @@ const consultantPlaceholderNames = [
   ];
 //a
 
+//localhost:5000/list_consultants
+
 function ConsultantFinder() {
+    const [foundConsultants, setFoundConsultants] = useState([])
     const [search, setSearch] = useState('')
     const [searchResults, setSearchResults] = useState([])
 
+
+    useEffect(() => {
+        const fetchData = async () =>{
+            try{
+                await fetch('http://127.0.0.1:5000/list_consultants', {
+                        method: "GET",
+                        headers: { "Content-Type": "application/json" },
+                        credentials: 'include',
+                    }).then(response => {
+                        if (response.ok) {
+                            return response.json();
+                        } 
+                        else {
+                            throw new Error('Fetching Consultant Failed with Status: ' + response.status);
+                        }
+                    }).then(data => {
+                        // Data fetched successfully
+                        console.log(data)
+                        setFoundConsultants(data);
+                    }).catch(error => {
+                        console.error(error);
+                    });
+            } catch(error) {
+                console.log("error fetching data")
+            }
+        };
+        fetchData();
+    }, []);
+
+    if(foundConsultants === null) {
+        return(
+            <p>Loading data</p>
+        )
+    }
+    console.log("stored stuff:",foundConsultants)
+
+
     const handleSearchChange = (e) => {
         const searchText = e.target.value;
         setSearch(searchText);

From d2ed3b5fc166bf7fb776f0854cd6071a245178bc Mon Sep 17 00:00:00 2001
From: krish <114755077+krish2903@users.noreply.github.com>
Date: Wed, 3 Apr 2024 18:25:02 +0000
Subject: [PATCH 19/22] Set Hourly Page and User Creation Update

---
 .../Finance_Team_Page/SetHourlyRate.js        | 16 ++--
 .../SetHourlyRate.module.css                  | 90 +++++++++++++++----
 .../src/Components/Global/Navbar.module.css   | 11 ++-
 .../IT_Technician_Page/UserAccountCreation.js |  4 +-
 .../UserAccountCreation.module.css            | 47 ++++++++--
 .../Components/LoginForm/LoginForm.module.css | 23 ++---
 .../it_user_creation_page.module.css          |  4 -
 7 files changed, 137 insertions(+), 58 deletions(-)

diff --git a/frontend/src/Components/Finance_Team_Page/SetHourlyRate.js b/frontend/src/Components/Finance_Team_Page/SetHourlyRate.js
index 5e8ddc1d..eca79ab5 100644
--- a/frontend/src/Components/Finance_Team_Page/SetHourlyRate.js
+++ b/frontend/src/Components/Finance_Team_Page/SetHourlyRate.js
@@ -3,8 +3,8 @@ import styles from "./SetHourlyRate.module.css"; // Import the CSS file
 import Navbar from "../../Components/Global/Navbar";
 
 function SetHourlyRate() {
-  let links = [{pageName : "Set Hourly Rate Page", pageLink : "/set_hourly_rate", iconPath : "./Home_Page_Icons/Consultant/record_timesheet.svg"},
-  {pageName : "View Timesheet Page", pageLink : "/view_timesheet", iconPath : "./Home_Page_Icons/Consultant/view_timesheet.svg"}]
+  let links = [{ pageName: "Set Hourly Rate Page", pageLink: "/set_hourly_rate", iconPath: "./Home_Page_Icons/Consultant/record_timesheet.svg" },
+  { pageName: "View Timesheet Page", pageLink: "/view_timesheet", iconPath: "./Home_Page_Icons/Consultant/view_timesheet.svg" }]
 
   const [consultantName, setConsultantName] = useState("");
   const [hourlyRate, setHourlyRate] = useState("");
@@ -27,13 +27,12 @@ function SetHourlyRate() {
 
   return (
     <>
-      <Navbar homePageTitle="Finance Team Home Page" homePageLink="/finance_team_member_home_page" links={links}/>
+      <Navbar homePageTitle="Finance Team Home Page" homePageLink="/finance_team_member_home_page" links={links} />
       <div className={styles.setHourlyRateContainer}>
         <h2 className={styles.setHourlyRateTitle}>Set Hourly Rate</h2>
-        <form onSubmit={handleSubmit}>
+        <form className={styles.formContainer} onSubmit={handleSubmit}>
           <div className={styles.inputGroup}>
-            <label className={styles.setHourlyRateLabel}>
-              Consultant Name:
+            <p className={styles.setHourlyRateLabel}>Consultant Name:</p>
               <input
                 type="text"
                 value={consultantName}
@@ -41,11 +40,9 @@ function SetHourlyRate() {
                 className={styles.setHourlyRateInput}
                 placeholder="Enter consultant's name"
               />
-            </label>
           </div>
           <div className={styles.inputGroup}>
-            <label className={styles.setHourlyRateLabel}>
-              Hourly Rate:
+            <p className={styles.setHourlyRateLabel}>Hourly Rate:</p>
               <input
                 type="number"
                 value={hourlyRate}
@@ -53,7 +50,6 @@ function SetHourlyRate() {
                 className={styles.setHourlyRateInput}
                 placeholder="Enter hourly rate"
               />
-            </label>
           </div>
           <button type="submit" className={styles.setHourlyRateButton}>
             Set Hourly Rate
diff --git a/frontend/src/Components/Finance_Team_Page/SetHourlyRate.module.css b/frontend/src/Components/Finance_Team_Page/SetHourlyRate.module.css
index 342de2d9..06fa379b 100644
--- a/frontend/src/Components/Finance_Team_Page/SetHourlyRate.module.css
+++ b/frontend/src/Components/Finance_Team_Page/SetHourlyRate.module.css
@@ -6,47 +6,99 @@
   flex-direction: column;
   align-items: center;
   justify-content: flex-start;
-  height: 100vh; /* Set the container height to viewport height */
+  height: 100%; /* Set the container height to viewport height */
   padding: 20px; /* Add padding */
   margin-left: 5rem;
+  font-family: "Roboto", sans-serif;
 }
 
 /* Title styles */
 .setHourlyRateTitle {
+  letter-spacing: 3px;
   text-align: center;
-  font-family: Cambria, Cochin, Georgia, Times, "Times New Roman", serif;
   font-size: 30pt;
   margin-bottom: 50px; /* Add margin at the bottom */
+  font-weight: bolder;
 }
 
 /* Label styles */
 .setHourlyRateLabel {
   font-size: 18px; /* Increase font size */
-  margin-bottom: 10px;
-  color: #060000; /* Change text color */
+  color: white; /* Change text color */
 }
 
-/* Input styles */
-.setHourlyRateInput {
-  padding: 10px;
-  width: 300px;
-  border: 1px solid #ccc;
-  border-radius: 4px;
-  font-size: 16px;
-  margin-bottom: 20px;
+.inputGroup {
+  width: 100%;
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
+  align-items: center;
 }
 
-/* Button styles */
-.setHourlyRateButton {
-  padding: 10px 20px;
-  background-color: #007bff;
+.setHourlyRateInput {
+  font-weight: 500;
+  font-size: 11pt;
   color: #fff;
+  background-color: rgb(28,28,30);
+  box-shadow: 0 0 .4vw rgba(0,0,0,0.5), 0 0 0 .15vw transparent;
+  border-radius: 15px;
   border: none;
-  border-radius: 4px;
-  font-size: 16px;
+  outline: none;
+  padding: 0.4vw;
+  max-width: 100%;
+  height: 25px;
+  transition: .4s;
+  text-align: center;
+}
+
+.setHourlyRateInput::placeholder {
+  color: rgba(255, 255, 255, 0.382);
+}
+
+.setHourlyRateInput:hover {
+  box-shadow: 0 0 0 .15vw #c5ff00;
+}
+
+.setHourlyRateInput:focus {
+  box-shadow: 0 0 0 .15vw #c5ff00;
+}
+
+.formContainer {
+  width: 100%;
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
+  align-items: center;
+}
+
+.setHourlyRateButton {
+  font-family: "Poppins", sans-serif;
+  width: 15%;
+  padding: 1%;
+  margin: 3%;
+  border-radius: 50px;
   cursor: pointer;
+  border: 0;
+  background-color: white;
+  box-shadow: rgb(0 0 0 / 5%) 0 0 8px;
+  letter-spacing: 1.5px;
+  text-transform: uppercase;
+  font-size: 15px;
+  transition: all 0.5s ease;
 }
 
 .setHourlyRateButton:hover {
-  background-color: #0056b3;
+  letter-spacing: 2px;
+  background-color: #1e1e1e;
+  color: hsl(0, 0%, 100%);
+  box-shadow: #c5ff00 0px 3px 29px 0px;
 }
+
+.setHourlyRateButton:active {
+  letter-spacing: 2px;
+  background-color: #1e1e1e;
+  color: white;
+  box-shadow: #c5ff00 0px 0px 0px 0px;
+  transform: translateY(10px);
+  transition: 100ms;
+}
\ No newline at end of file
diff --git a/frontend/src/Components/Global/Navbar.module.css b/frontend/src/Components/Global/Navbar.module.css
index c4b66112..c296b513 100644
--- a/frontend/src/Components/Global/Navbar.module.css
+++ b/frontend/src/Components/Global/Navbar.module.css
@@ -1,6 +1,7 @@
 .navbar{
-    background-color: #D9D9D9;
-    width: 5rem;
+    background: linear-gradient(360deg, rgb(52, 68, 0) 0%, rgb(130, 170, 0) 100%);
+    border-right: solid 5pt #1e1e1e;
+    width: 4rem;
     height: 100vh;
     display: flex;
     flex-direction: column;
@@ -8,6 +9,7 @@
     transition: width 200ms ease;
     overflow: hidden;
     position: fixed;
+    font-family: "Roboto", sans-serif;
 }
 
 .navbar:hover{
@@ -28,6 +30,7 @@
 }
 
 .navContainer{
+    margin-top: 0;
     padding: 0;
     list-style-type: none;
 }
@@ -35,7 +38,7 @@
 .navLink{
     display: flex;
     align-items: center;
-    height: 5rem;
+    height: 4rem;
 }
 
 .navText{
@@ -48,7 +51,7 @@
 }
 
 .icon{
-    min-width: 3rem;
+    min-width: 1rem;
     margin: 0 1rem;
     width: 2rem;
 }
\ No newline at end of file
diff --git a/frontend/src/Components/IT_Technician_Page/UserAccountCreation.js b/frontend/src/Components/IT_Technician_Page/UserAccountCreation.js
index a75d5fa6..0b1cf9fd 100644
--- a/frontend/src/Components/IT_Technician_Page/UserAccountCreation.js
+++ b/frontend/src/Components/IT_Technician_Page/UserAccountCreation.js
@@ -5,7 +5,7 @@ import { useNavigate } from 'react-router-dom';
 function UserAccountCreation() {
     const [showPassword, setShowPassword] = useState(false);
     const [showConfirmPassword, setShowConfirmPassword] = useState(false);
-    const [userType, setUserType] = useState("Consultant");
+    const [userType, setUserType] = useState("consultant");
     const [firstname, setFirstName] = useState("");
     const [lastname, setLastName] = useState("");
     const [username, setUsername] = useState("");
@@ -114,7 +114,7 @@ function UserAccountCreation() {
 
                         <input onChange={handleLastNameChange} type="text" id="lastname" name="lastname" placeholder="Last Name" required className={styles.input} />
 
-                        {userType == "Consultant" &&
+                        {userType == "consultant" &&
                             <input onChange={handleLineManagerUserNameChange} type="text" id="managername" name="line_manager_username" placeholder="Manager Username" required className={styles.input} />
                         }
                         <input onChange={handleUserNameChange} type="text" id="uname" name="username" placeholder="Username" required className={styles.input} />
diff --git a/frontend/src/Components/IT_Technician_Page/UserAccountCreation.module.css b/frontend/src/Components/IT_Technician_Page/UserAccountCreation.module.css
index 92001d39..def5cc38 100644
--- a/frontend/src/Components/IT_Technician_Page/UserAccountCreation.module.css
+++ b/frontend/src/Components/IT_Technician_Page/UserAccountCreation.module.css
@@ -13,10 +13,10 @@
     justify-content: center;
     align-items: center;
     text-align: center;
-    background-color: white;
+    background-color: #1e1e1e;
     border-top-right-radius: 15px;
     border-bottom-right-radius: 15px;
-    box-shadow: 0 0 15px white;
+    box-shadow: 0 0 15px #c5ff00;
     width: 30%;
     height: 85%;
     padding-left: 2%;
@@ -25,7 +25,7 @@
 
 .userAccountForm label, .userAccountForm h2 {
     font-family: "Poppins", serif;
-    color: #012E6E;
+    color: white;
 }
 
 .userAccountForm p {
@@ -37,7 +37,7 @@
 
 .userAccountForm h2 {
     margin: 0;
-    color: #012E6E;
+    color: #8ab400;
 }
 
 .main_img {
@@ -45,8 +45,8 @@
     height: 85%;
     border-top-left-radius: 15px;
     border-bottom-left-radius: 15px;
-    background-color: #002252;
-    box-shadow: 0 0 15px white;
+    background-color: #111111;
+    box-shadow: 0 0 15px #c5ff00;
 }
 
 .input, .selectInput{
@@ -97,7 +97,7 @@
     cursor: pointer;
 }
 
-.userAccountForm input[type=submit]{
+/* .userAccountForm input[type=submit]{
     width: 70%;
     margin-top: 5%;
     cursor: pointer;
@@ -110,9 +110,40 @@
     border-radius: 10px;
     margin-top: 5%;
     margin-bottom: 5%;
-}
+} */
 
 ::placeholder {
     color: rgba(255, 255, 255, 0.704);
   }
 
+  .userAccountForm input[type=submit] {
+    font-family: "Poppins", sans-serif;
+    width: 50%;
+    padding: 1%;
+    margin: 3%;
+    border-radius: 50px;
+    cursor: pointer;
+    border: 0;
+    background-color: white;
+    box-shadow: rgb(0 0 0 / 5%) 0 0 8px;
+    letter-spacing: 1.5px;
+    text-transform: uppercase;
+    font-size: 15px;
+    transition: all 0.5s ease;
+  }
+  
+  .userAccountForm input[type=submit]:hover {
+    letter-spacing: 2px;
+    background-color: #1e1e1e;
+    color: hsl(0, 0%, 100%);
+    box-shadow: #c5ff00 0px 3px 29px 0px;
+  }
+  
+  .userAccountForm input[type=submit]:active {
+    letter-spacing: 2px;
+    background-color: #1e1e1e;
+    color: white;
+    box-shadow: #c5ff00 0px 0px 0px 0px;
+    transform: translateY(10px);
+    transition: 100ms;
+  }
diff --git a/frontend/src/Components/LoginForm/LoginForm.module.css b/frontend/src/Components/LoginForm/LoginForm.module.css
index d63a0087..c0a7b433 100644
--- a/frontend/src/Components/LoginForm/LoginForm.module.css
+++ b/frontend/src/Components/LoginForm/LoginForm.module.css
@@ -1,12 +1,13 @@
-html{
-    background-image: none ;
-    background-color: #012E6E;
+html {
+    background-image: none;
+    background: rgb(2, 0, 36);
+    background: radial-gradient(circle, #000000 0%, rgba(24, 31, 0, 1) 100%);
 }
 
 
 
 
-.LoginForm{
+.LoginForm {
     width: 20%;
     text-align: center;
     border-radius: 0.4pc;
@@ -16,32 +17,32 @@ html{
     background-color: white;
 }
 
-.LoginFormList{
+.LoginFormList {
     display: inline;
     list-style-type: none;
     background-color: white;
 }
 
-.LoginFormListElement{
+.LoginFormListElement {
     padding: 0.4pc;
     font-family: "Roboto", sans-serif;
 }
 
-.UserIcon{
+.UserIcon {
     display: inline;
     width: 25%;
     position: relative;
     margin-left: 85px;
 }
 
-.input{
+.input {
     width: 10pc;
     padding: 0.5em;
     background-color: #012E6E;
     color: white;
 }
 
-.SelectInput{
+.SelectInput {
     background-color: #012E6E;
     padding: 0.6em;
     width: 42%;
@@ -52,12 +53,12 @@ html{
     appearance: none;
 }
 
-#ForgotPass{
+#ForgotPass {
     text-decoration: none;
     color: #012E6E;
 }
 
-.Submit{
+.Submit {
     padding: 0.7pc 0.1pc;
     width: 100px;
     cursor: pointer;
diff --git a/frontend/src/Pages/IT_Technician/it_user_creation_page.module.css b/frontend/src/Pages/IT_Technician/it_user_creation_page.module.css
index f12ed881..a56bbaae 100644
--- a/frontend/src/Pages/IT_Technician/it_user_creation_page.module.css
+++ b/frontend/src/Pages/IT_Technician/it_user_creation_page.module.css
@@ -1,8 +1,4 @@
 
-.container {
-    background: #012E6E;
-}
-
 body{
     margin: 0;
     padding: 0;

From 90cdfbd856ad8963b340c6a6a831ca9cb150db95 Mon Sep 17 00:00:00 2001
From: Luke Liew Mouawad <ec22711@qmul.ac.uk>
Date: Wed, 3 Apr 2024 19:43:22 +0100
Subject: [PATCH 20/22] fixed bug with consultant not being able to be created

---
 .../src/Components/IT_Technician_Page/UserAccountCreation.js  | 4 +++-
 1 file changed, 3 insertions(+), 1 deletion(-)

diff --git a/frontend/src/Components/IT_Technician_Page/UserAccountCreation.js b/frontend/src/Components/IT_Technician_Page/UserAccountCreation.js
index 931fd1c8..43b0cff8 100644
--- a/frontend/src/Components/IT_Technician_Page/UserAccountCreation.js
+++ b/frontend/src/Components/IT_Technician_Page/UserAccountCreation.js
@@ -65,8 +65,10 @@ function UserAccountCreation() {
         e.preventDefault();
 
         var accountDetails;
-        if (userType=="Consultant") {
+        console.log(userType)
+        if (userType=="consultant") {
             accountDetails = { userType, firstname, lastname, username, line_manager_username, email, password };
+            console.log(accountDetails)
         } else {
             accountDetails = { userType, firstname, lastname, username, email, password };
         }

From 446768face6ea235e8e2fc9fc6a56cb9156dab1e Mon Sep 17 00:00:00 2001
From: Luke Liew Mouawad <ec22711@qmul.ac.uk>
Date: Wed, 3 Apr 2024 19:48:42 +0100
Subject: [PATCH 21/22] logout button positioning fixes

---
 frontend/src/Components/Global/LogoutButton.module.css | 9 ++++-----
 1 file changed, 4 insertions(+), 5 deletions(-)

diff --git a/frontend/src/Components/Global/LogoutButton.module.css b/frontend/src/Components/Global/LogoutButton.module.css
index 15dd1e84..8e199e70 100644
--- a/frontend/src/Components/Global/LogoutButton.module.css
+++ b/frontend/src/Components/Global/LogoutButton.module.css
@@ -1,11 +1,10 @@
 .Logout{
     padding: 0.7pc 0.1pc;
-    width: 55px;
-    max-height: 40px;
+    width: 50px;
+    max-height: 35px;
     cursor: pointer;
     border: none;
     background-image: linear-gradient(to right, blue, purple);
-    left: 20%;
     border-radius: 10px;
     color: white;
     height: 3rem;
@@ -14,9 +13,9 @@
     padding-top: 0.5rem;
     font-family: Arial, Helvetica, sans-serif;
     font-size: 1rem;
-    margin-left: 0.65rem;
+    margin-left: 0.35rem;
 }
 
 .logoutText{
-    margin-left: 0.95rem;
+    margin-left: 0.5rem;
 }
\ No newline at end of file

From 3b0484eed0d10600867021000e762ab91ef24e07 Mon Sep 17 00:00:00 2001
From: Luke Liew Mouawad <ec22711@qmul.ac.uk>
Date: Wed, 3 Apr 2024 20:33:06 +0100
Subject: [PATCH 22/22] some design fixes

---
 frontend/src/Components/Global/LogoutButton.module.css      | 1 -
 frontend/src/Components/Global/Navbar.module.css            | 2 +-
 frontend/src/Pages/IT_Technician/it_technician_home_page.js | 3 ---
 3 files changed, 1 insertion(+), 5 deletions(-)

diff --git a/frontend/src/Components/Global/LogoutButton.module.css b/frontend/src/Components/Global/LogoutButton.module.css
index 8e199e70..31795514 100644
--- a/frontend/src/Components/Global/LogoutButton.module.css
+++ b/frontend/src/Components/Global/LogoutButton.module.css
@@ -4,7 +4,6 @@
     max-height: 35px;
     cursor: pointer;
     border: none;
-    background-image: linear-gradient(to right, blue, purple);
     border-radius: 10px;
     color: white;
     height: 3rem;
diff --git a/frontend/src/Components/Global/Navbar.module.css b/frontend/src/Components/Global/Navbar.module.css
index 3839f285..7a1641f3 100644
--- a/frontend/src/Components/Global/Navbar.module.css
+++ b/frontend/src/Components/Global/Navbar.module.css
@@ -13,7 +13,7 @@
 }
 
 .navbar:hover{
-    width: 16rem;
+    width: 20rem;
 }
 
 .navbar:hover body{
diff --git a/frontend/src/Pages/IT_Technician/it_technician_home_page.js b/frontend/src/Pages/IT_Technician/it_technician_home_page.js
index e1657ce7..d5f8673b 100644
--- a/frontend/src/Pages/IT_Technician/it_technician_home_page.js
+++ b/frontend/src/Pages/IT_Technician/it_technician_home_page.js
@@ -1,7 +1,5 @@
 import styles from "./it_technician_home_page.module.css";
 import Navbar from "../../Components/Global/Navbar";
-import LogoutButton from "../../Components/Global/LogoutButton";
-
 
 function IT_Technician_HomePage() {
     document.title = "IT Technician Home Page";
@@ -15,7 +13,6 @@ function IT_Technician_HomePage() {
             <Navbar homePageTitle="IT Technician Home Page" homePageLink="/it_technician_home_page" links={links}/>
             <div className={styles.mainContainer}>
                 <h1>Home</h1>
-                <LogoutButton/>
             </div>
         </>
     )