frontend/src/Components/Button.tsx

@@ -1,17 +1,14 @@
 function Button({
   text,
   onClick,
-  type,
 }: {
   text: string;
   onClick: () => void;
-  type: "submit" | "button" | "reset";
 }): JSX.Element {
   return (
     <button
       onClick={onClick}
       className="inline-block py-1 px-8 font-bold bg-orange-500 text-white border-2 border-black rounded-full cursor-pointer mt-5 mb-5 transition-colors duration-10 hover:bg-orange-600 hover:text-gray-300 font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif; font-size: 4vh;"
-      type={type}
     >
       {text}
     </button>

frontend/src/Components/Register.tsx

@@ -1,8 +1,6 @@
 import { useState } from "react";
 import { NewUser } from "../Types/Users";
 import { api } from "../API/API";
-import Logo from "../assets/Logo.svg";
-import Button from "./Button";
 
 export default function Register(): JSX.Element {
   const [username, setUsername] = useState("");
@@ -14,32 +12,25 @@ export default function Register(): JSX.Element {
   };
 
   return (
-    <div className="flex flex-col h-screen w-screen items-center justify-center">
+    <div>
-      <div className="border-4 border-black bg-white flex flex-col items-center justify-center h-fit w-fit rounded-3xl content-center pl-20 pr-20">
+      <div className="w-full max-w-xs">
         <form
-          className="bg-white rounded px-8 pt-6 pb-8 mb-4 items-center justify-center flex flex-col w-fit h-fit"
+          className="bg-white shadow-md rounded px-8 pt-6 pb-8 mb-4"
           onSubmit={(e) => {
             e.preventDefault();
             void handleRegister();
           }}
         >
-          <img
+          <h3 className="pb-2">Register new user</h3>
-            src={Logo}
-            className="logo w-[7vw] mb-10 mt-10"
-            alt="TTIME Logo"
-          />
-          <h3 className="pb-4 mb-2 text-center font-bold text-[18px]">
-            Register New User
-          </h3>
           <div className="mb-4">
             <label
-              className="block text-gray-700 text-sm font-sans font-bold mb-2"
+              className="block text-gray-700 text-sm font-bold mb-2"
               htmlFor="username"
             >
               Username
             </label>
             <input
-              className="appearance-none border-2 border-black rounded-2xl w-full py-2 px-3 text-gray-700 leading-tight focus:outline-none focus:shadow-outline"
+              className="shadow appearance-none border rounded w-full py-2 px-3 text-gray-700 leading-tight focus:outline-none focus:shadow-outline"
               id="username"
               type="text"
               placeholder="Username"
@@ -51,13 +42,13 @@ export default function Register(): JSX.Element {
           </div>
           <div className="mb-6">
             <label
-              className="block text-gray-700 text-sm font-sans font-bold mb-2"
+              className="block text-gray-700 text-sm font-bold mb-2"
               htmlFor="password"
             >
               Password
             </label>
             <input
-              className="appearance-none border-2 border-black rounded-2xl w-full py-2 px-3 text-gray-700 leading-tight focus:outline-none focus:shadow-outline"
+              className="shadow appearance-none border rounded w-full py-2 px-3 text-gray-700 mb-3 leading-tight focus:outline-none focus:shadow-outline"
               id="password"
               type="password"
               placeholder="Choose your password"
@@ -68,13 +59,12 @@ export default function Register(): JSX.Element {
             />
           </div>
           <div className="flex items-center justify-between">
-            <Button
+            <button
-              text="Register"
+              className="bg-blue-500 hover:bg-blue-700 text-white font-bold py-2 px-4 rounded focus:outline-none focus:shadow-outline"
-              onClick={(): void => {
-                return;
-              }}
               type="submit"
-            />
+            >
+              Register
+            </button>
           </div>
         </form>
         <p className="text-center text-gray-500 text-xs"></p>

frontend/src/Pages/AdminPages/AdminAddProject.tsx

@@ -11,14 +11,12 @@ function AdminAddProject(): JSX.Element {
         onClick={(): void => {
           return;
         }}
-        type="button"
       />
       <Button
         text="Back"
         onClick={(): void => {
           return;
         }}
-        type="button"
       />
     </>
   );

frontend/src/Pages/AdminPages/AdminAddUser.tsx

@@ -11,14 +11,12 @@ function AdminAddUser(): JSX.Element {
         onClick={(): void => {
           return;
         }}
-        type="button"
       />
       <Button
         text="Back"
         onClick={(): void => {
           return;
         }}
-        type="button"
       />
     </>
   );

frontend/src/Pages/AdminPages/AdminChangeUsername.tsx

@@ -11,14 +11,12 @@ function AdminChangeUsername(): JSX.Element {
         onClick={(): void => {
           return;
         }}
-        type="button"
       />
       <Button
         text="Back"
         onClick={(): void => {
           return;
         }}
-        type="button"
       />
     </>
   );

frontend/src/Pages/AdminPages/AdminManageProjects.tsx

@@ -11,14 +11,12 @@ function AdminManageProjects(): JSX.Element {
         onClick={(): void => {
           return;
         }}
-        type="button"
       />
       <Button
         text="Back"
         onClick={(): void => {
           return;
         }}
-        type="button"
       />
     </>
   );

frontend/src/Pages/AdminPages/AdminManageUsers.tsx

@@ -11,14 +11,12 @@ function AdminManageUsers(): JSX.Element {
         onClick={(): void => {
           return;
         }}
-        type="button"
       />
       <Button
         text="Back"
         onClick={(): void => {
           return;
         }}
-        type="button"
       />
     </>
   );

frontend/src/Pages/AdminPages/AdminProjectAddMember.tsx

@@ -11,14 +11,12 @@ function AdminProjectAddMember(): JSX.Element {
         onClick={(): void => {
           return;
         }}
-        type="button"
       />
       <Button
         text="Back"
         onClick={(): void => {
           return;
         }}
-        type="button"
       />
     </>
   );

frontend/src/Pages/AdminPages/AdminProjectChangeUserRole.tsx

@@ -11,14 +11,12 @@ function AdminProjectChangeUserRole(): JSX.Element {
         onClick={(): void => {
           return;
         }}
-        type="button"
       />
       <Button
         text="Back"
         onClick={(): void => {
           return;
         }}
-        type="button"
       />
     </>
   );

frontend/src/Pages/AdminPages/AdminProjectManageMembers.tsx

@@ -11,14 +11,12 @@ function AdminProjectManageMembers(): JSX.Element {
         onClick={(): void => {
           return;
         }}
-        type="button"
       />
       <Button
         text="Back"
         onClick={(): void => {
           return;
         }}
-        type="button"
       />
     </>
   );

frontend/src/Pages/AdminPages/AdminProjectPage.tsx

@@ -11,14 +11,12 @@ function AdminProjectPage(): JSX.Element {
         onClick={(): void => {
           return;
         }}
-        type="button"
       />
       <Button
         text="Back"
         onClick={(): void => {
           return;
         }}
-        type="button"
       />
     </>
   );

frontend/src/Pages/AdminPages/AdminProjectStatistics.tsx

@@ -11,7 +11,6 @@ function AdminProjectStatistics(): JSX.Element {
         onClick={(): void => {
           return;
         }}
-        type="button"
       />
     </>
   );

frontend/src/Pages/AdminPages/AdminProjectViewMemberInfo.tsx

@@ -11,14 +11,12 @@ function AdminProjectViewMemberInfo(): JSX.Element {
         onClick={(): void => {
           return;
         }}
-        type="button"
       />
       <Button
         text="Back"
         onClick={(): void => {
           return;
         }}
-        type="button"
       />
     </>
   );

frontend/src/Pages/AdminPages/AdminViewUserInfo.tsx

@@ -11,14 +11,12 @@ function AdminViewUserInfo(): JSX.Element {
         onClick={(): void => {
           return;
         }}
-        type="button"
       />
       <Button
         text="Back"
         onClick={(): void => {
           return;
         }}
-        type="button"
       />
     </>
   );

frontend/src/Pages/LoginPage.tsx

@@ -67,7 +67,6 @@ function LoginPage(): JSX.Element {
               onClick={(): void => {
                 return;
               }}
-              type="button"
             />
           </Link>
           <Link to="/register">
@@ -76,7 +75,6 @@ function LoginPage(): JSX.Element {
               onClick={(): void => {
                 return;
               }}
-              type="button"
             />
           </Link>
         </div>

frontend/src/Pages/ProjectManagerPages/PMChangeRole.tsx

@@ -11,14 +11,12 @@ function ChangeRole(): JSX.Element {
         onClick={(): void => {
           return;
         }}
-        type="button"
       />
       <Button
         text="Back"
         onClick={(): void => {
           return;
         }}
-        type="button"
       />
     </>
   );

frontend/src/Pages/ProjectManagerPages/PMOtherUsersTR.tsx

@@ -11,7 +11,6 @@ function PMOtherUsersTR(): JSX.Element {
         onClick={(): void => {
           return;
         }}
-        type="button"
       />
     </>
   );

frontend/src/Pages/ProjectManagerPages/PMProjectMembers.tsx

@@ -11,21 +11,18 @@ function PMProjectMembers(): JSX.Element {
         onClick={(): void => {
           return;
         }}
-        type="button"
       />
       <Button
         text="Time / Role"
         onClick={(): void => {
           return;
         }}
-        type="button"
       />
       <Button
         text="Back"
         onClick={(): void => {
           return;
         }}
-        type="button"
       />
     </>
   );

frontend/src/Pages/ProjectManagerPages/PMProjectPage.tsx

@@ -29,7 +29,6 @@ function PMProjectPage(): JSX.Element {
         onClick={(): void => {
           return;
         }}
-        type="button"
       />
     </>
   );

frontend/src/Pages/ProjectManagerPages/PMTotalTimeActivity.tsx

@@ -19,7 +19,6 @@ function PMTotalTimeActivity(): JSX.Element {
         onClick={(): void => {
           return;
         }}
-        type="button"
       />
     </>
   );

frontend/src/Pages/ProjectManagerPages/PMTotalTimeRole.tsx

@@ -11,7 +11,6 @@ function PMTotalTimeRole(): JSX.Element {
         onClick={(): void => {
           return;
         }}
-        type="button"
       />
     </>
   );

frontend/src/Pages/ProjectManagerPages/PMUnsignedReports.tsx

@@ -11,7 +11,6 @@ function PMUnsignedReports(): JSX.Element {
         onClick={(): void => {
           return;
         }}
-        type="button"
       />
     </>
   );

frontend/src/Pages/ProjectManagerPages/PMViewUnsignedReport.tsx

@@ -19,21 +19,18 @@ function PMViewUnsignedReport(): JSX.Element {
         onClick={(): void => {
           return;
         }}
-        type="button"
       />
       <Button
         text="Save"
         onClick={(): void => {
           return;
         }}
-        type="button"
       />
       <Button
         text="Back"
         onClick={(): void => {
           return;
         }}
-        type="button"
       />
     </>
   );

frontend/src/Pages/UserPages/UserEditTimeReportPage.tsx

@@ -17,14 +17,12 @@ function UserEditTimeReportPage(): JSX.Element {
         onClick={(): void => {
           return;
         }}
-        type="button"
       />
       <Button
         text="Back"
         onClick={(): void => {
           return;
         }}
-        type="button"
       />
     </>
   );

frontend/src/Pages/UserPages/UserNewTimeReportPage.tsx

@@ -18,7 +18,6 @@ function UserNewTimeReportPage(): JSX.Element {
         onClick={(): void => {
           return;
         }}
-        type="button"
       />
       <Link to="/project">
         <Button
@@ -26,7 +25,6 @@ function UserNewTimeReportPage(): JSX.Element {
           onClick={(): void => {
             return;
           }}
-          type="button"
         />
       </Link>
     </>

frontend/src/Pages/UserPages/UserProjectPage.tsx

@@ -27,7 +27,6 @@ function UserProjectPage(): JSX.Element {
           onClick={(): void => {
             return;
           }}
-          type="button"
         />
       </Link>
     </>

frontend/src/Pages/UserPages/UserViewTimeReportsPage.tsx

@@ -11,7 +11,6 @@ function UserViewTimeReportsPage(): JSX.Element {
         onClick={(): void => {
           return;
         }}
-        type="button"
       />
     </>
   );