Merge pull request #63 from SELab-2/fix-settings

fix: layout settings overriden bulma position

frontend/src/assets/styles/small_components.css

@@ -1,6 +1,7 @@
 .popup {
-    position: absolute;
+    position: absolute !important;
     top: 50%;
     left: 50%;
     transform: translate(-50%, -50%);
+    z-index: 9999; /* to get over bulma's cards index */
 }

frontend/src/components/Settings.tsx

@@ -1,12 +1,13 @@
-import { BiLogOut } from "react-icons/bi";
+import {BiLogOut} from "react-icons/bi";
 import '../assets/styles/small_components.css'
 import {JSX} from "react";
+import {Link} from "react-router-dom";
 
 
-export default function Settings(): JSX.Element  {
+export default function Settings(): JSX.Element {
     return (
         <>
-            <div className={"popup px-5 py-5 card"}>
+            <div className={"card popup px-5 py-5"}>
                 <p className={"title is-flex is-justify-content-center"}>Settings</p>
                 <img src={"/delphi_full.png"} alt={"image"}/>
                 <div className={"is-flex px-5 py-1 is-align-items-center"}>
@@ -16,8 +17,12 @@ export default function Settings(): JSX.Element  {
                 <div>
                     <p className={"py-2"}>Select workstation: </p>
                     <div className={"is-flex is-justify-content-space-evenly"}>
-                        <button className={"button is-success"}>teacher</button>
-                        <button className={"button is-danger"}>admin</button>
+                        <Link to={"/teacher"}>
+                            <button className={"button is-success"}>teacher</button>
+                        </Link>
+                        <Link to={"/admin"}>
+                            <button className={"button is-danger"}>admin</button>
+                        </Link>
                     </div>
                 </div>
             </div>