Merge branch 'minor_fixes' into 'master'

Minor fixes

See merge request !34

web-app/frontend/src/components/activities/ActivityContainer.css

@@ -49,6 +49,20 @@
   padding-bottom: 5px;
 }
 
+.activity-container-navigator-itemx {
+  font-family: var(--font-family);
+  font-weight: 400;
+  font-size: 1em;
+  color: white;
+
+  background-color: rgb(237, 188, 8);
+  border-radius: 5px;
+  margin: 5px 0px 5px 0px;
+  text-align: center;
+  padding-top: 5px;
+  padding-bottom: 5px;
+}
+
 .activity-container-navigator-item:hover {
   opacity: 0.8;
 }

web-app/frontend/src/components/activities/ActivityContainer.jsx

@@ -11,8 +11,10 @@ import {
 import LetterPattern from "./mentalChronometryEval/letterPattern/LetterPattern";
 import Coding from "./mentalChronometryEval/coding/Coding";
 import PairCancerlation from "./mentalChronometryEval/pairCancerlation/PairCancerlation";
+import { useNavigate } from "react-router-dom";
 
 const ActivityContainer = () => {
+  const navigate = useNavigate();
   const [currentActivityNo, setCurrentActivityNo] = useState(1);
   const [isGuideVideoClicked, setIsGuideVideoClicked] = useState(true);
 
@@ -113,6 +115,15 @@ const ActivityContainer = () => {
           >
             7
           </div>
+          <div
+            id="8"
+            className="activity-container-navigator-itemx"
+            onClick={() => {
+              navigate("/attentionDemo")
+            }}
+          >
+            8
+          </div>
         </div>
         <div id="activity-container-item-1">
           {isGuideVideoClicked ? (

web-app/frontend/src/pages/attention_demo/attentionspan.css

@@ -47,4 +47,9 @@ video {
   height: 40%;
 }
 
+.bt1{
+    position: absolute;
+    right: 28px;
+}
+