Fix in navbar

src/components/de/Navbar.tsx

@@ -5,7 +5,7 @@ import {
   faXmark,
 } from "@fortawesome/pro-regular-svg-icons";
 import { createSignal } from "solid-js";
-import { A, useNavigate } from "solid-start";
+import { A, useLocation, useNavigate } from "solid-start";
 import { FontAwesomeIcon } from "../FontAwesomeIcon";
 
 export const [lightMode, setLightMode] = createSignal(false);
@@ -13,6 +13,7 @@ const [menu, setMenu] = createSignal(false);
 
 function Navbar() {
   const navigate = useNavigate();
+  const location = useLocation();
   return (
     <>
       <div id="navbar" style={{ visibility: menu() ? "visible" : "hidden" }}>
@@ -79,7 +80,12 @@ function Navbar() {
           {lightMode() ? "Dark Mode " : "Light Mode "}
           <FontAwesomeIcon icon={faCircleHalfStroke} />
         </button>
-        <button onClick={() => navigate("/en/overview")}>
+        <button
+          onClick={() => {
+            navigate("/en" + location.pathname.slice(3), { scroll: false });
+            setMenu(false);
+          }}
+        >
           Englisch <FontAwesomeIcon icon={faGlobe} />
         </button>
         <button onClick={() => setMenu(false)}>
@@ -92,7 +98,7 @@ function Navbar() {
         style={{ visibility: menu() ? "hidden" : "visible" }}
       >
         <button onClick={() => navigate(-1)}>Zurück</button>
-        <A href="#start">Start</A>
+        <button onClick={() => navigate("/de/overview")}>Start</button>
         <button onClick={() => setMenu(true)}>Menu</button>
       </div>
     </>

src/components/en/Navbar.tsx

@@ -5,7 +5,7 @@ import {
   faXmark,
 } from "@fortawesome/pro-regular-svg-icons";
 import { createSignal } from "solid-js";
-import { A, useNavigate } from "solid-start";
+import { A, useLocation, useNavigate } from "solid-start";
 import { FontAwesomeIcon } from "../FontAwesomeIcon";
 
 export const [lightMode, setLightMode] = createSignal(false);
@@ -13,6 +13,7 @@ const [menu, setMenu] = createSignal(false);
 
 function Navbar() {
   const navigate = useNavigate();
+  const location = useLocation();
   return (
     <>
       <div id="navbar" style={{ visibility: menu() ? "visible" : "hidden" }}>
@@ -79,7 +80,12 @@ function Navbar() {
           {lightMode() ? "Dark Mode " : "Light Mode "}
           <FontAwesomeIcon icon={faCircleHalfStroke} />
         </button>
-        <button onClick={() => navigate("/de/overview")}>
+        <button
+          onClick={() => {
+            navigate("/de" + location.pathname.slice(3), { scroll: false });
+            setMenu(false);
+          }}
+        >
           Deutsch <FontAwesomeIcon icon={faGlobe} />
         </button>
         <button onClick={() => setMenu(false)}>
@@ -92,7 +98,7 @@ function Navbar() {
         style={{ visibility: menu() ? "hidden" : "visible" }}
       >
         <button onClick={() => navigate(-1)}>Back</button>
-        <A href="#start">Start</A>
+        <button onClick={() => navigate("/en/overview")}>Start</button>
         <button onClick={() => setMenu(true)}>Menu</button>
       </div>
     </>

src/routes/de/overview.tsx

@@ -10,7 +10,7 @@ function overview() {
       <Link rel="stylesheet" href="/styles/overview.css" />
       <Navbar />
 
-      <header id="start">
+      <header>
         <img src="/images/cover.jpg" />
       </header>
 

src/routes/en/overview.tsx

@@ -9,7 +9,7 @@ function Overview() {
       <Title>Introduction EUCs</Title>
       <Link rel="stylesheet" href="/styles/overview.css" />
       <Navbar />
-      <header id="start">
+      <header>
         <img src="/images/cover.jpg" />
       </header>
       {/*