Merge pull request 'CSS and Refactoring' (#124) from frontend/cssRefactoring into main

Reviewed-on: #124

frontend/src/App.css

@@ -40,10 +40,16 @@
   color: var(--primary);
 }
 
-a:hover:not(.navbar-logo){
+a:hover:not(.navbar-logo) {
   border-bottom: 4px dotted var(--secondary);
 }
 
+/*  */
+.btn-mobil a:hover,
+.hero-btns a:hover {
+  border-bottom: none;
+}
+
 h1 {
   font-size: 5em;
   margin: 0.7em auto;

frontend/src/App.js

@@ -13,8 +13,6 @@ import Secret from "./components/pages/Secret";
 import Umfrage from "./components/pages/Umfrage";
 import PrivateRoute from "./auth/PrivateRoute";
 import Behavior from "./components/pages/Behavior";
-import { Logger } from "@behametrics/logger-web";
-import { useAuth } from "./auth/AuthProvider";
 
 function App() {
   return (

frontend/src/components/Navbar.css

@@ -54,8 +54,8 @@
 }
 
 .nav-links:hover {
-  border-bottom: 4px dotted var(--secondary);
-  transition: all 0.2s ease-out;
+  border-bottom: 5px dotted var(--secondary);
+  transition: all 1.2s ease-out;
 }
 
 .nav-links-mobile {

frontend/src/components/pages/Behavior.js

@@ -1,8 +1,30 @@
-import React from "react";
+import React, { useEffect } from "react";
 import "../../App.css";
 import Footer from "../../Footer";
+import { Logger } from "@behametrics/logger-web";
+import { useAuth } from "../../auth/AuthProvider";
 
 export default function Behavior() {
+  let logger = new Logger({
+    //inputs: ["cursor", "wheel", "keyboard", "touch"],
+    inputs: ["keyboard"],
+    logToConsole: true,
+  });
+  logger.init();
+
+  let [isLoggedIn] = useAuth();
+
+  useEffect(() => {
+    document.title = `${isLoggedIn}`;
+    console.log(isLoggedIn);
+    if (isLoggedIn === false) {
+      logger.stop();
+      console.log("stopped logger");
+    } else {
+      logger.start();
+      console.log("start logger");
+    }
+  });
   return (
     <>
       <div className="sitePage">

frontend/src/components/pages/Umfrage.js

@@ -119,7 +119,10 @@ export default function Umfrage() {
       <div className="sitePage">
         <h1> Umfrage</h1>
         <p>
-          Super, die Registrierung hat funktioniert! Du bist nun eingeloggt und ich erfasse deine Tastaturanschläge und die Mausbewegungen. Wenn du dich wieder abmelden möchtest, kannst du das <Link to="/logout">hier</Link> machen.
+          Super, die Registrierung hat funktioniert! Du bist nun eingeloggt und
+          ich erfasse deine Tastaturanschläge und die Mausbewegungen. Wenn du
+          dich wieder abmelden möchtest, kannst du das{" "}
+          <Link to="/logout">hier</Link> machen.
         </p>
         <p>
           Damit ich etwas über die Studienteilnehmenden erfahre, möchte ich hier