From e2705f2b0eec16287687159cd10aaaac58d37f07 Mon Sep 17 00:00:00 2001
From: Niklas <198754647+BlankAccountsUsername@users.noreply.github.com>
Date: Thu, 15 May 2025 18:28:22 +0200
Subject: [PATCH] =?UTF-8?q?wip=20add=20men=C3=BC?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 code/frontend/src/components/header.tsx | 35 ++++++++++++++++++++++---
 1 file changed, 32 insertions(+), 3 deletions(-)

diff --git a/code/frontend/src/components/header.tsx b/code/frontend/src/components/header.tsx
index 77468cc..e00d26b 100644
--- a/code/frontend/src/components/header.tsx
+++ b/code/frontend/src/components/header.tsx
@@ -1,6 +1,9 @@
-import "./header.css";
+import "./Header.css";
+import React, { useState } from "react";
 
 
+// TODO: Dinge so umstrukturieren, dass der State für das offene menü in Header ist und das Menü auch in Header, sodass es mit width 100% die volle breite einnehmen kann
+
 function Header() {
 
   return (
@@ -9,9 +12,35 @@ function Header() {
         <p className="header-title small-title">
           Feather Feed
         </p>
-        <div className="base-header-icon"> <img src="/assets/icons/three_menu_stripes_black.svg" alt="menuIcon" /> </div>
+        <div className="base-header-icon"> <MenuButton/> </div>
       </header>
   );
 }
 
-export default Header;
+
+const MenuButton: React.FC = () => {
+  const [isOpen, setIsOpen] = useState(false);
+
+  const toggleMenu = () => {
+    setIsOpen(prev => !prev);
+  };
+
+  return (
+    <div style={{ position: "relative", display: "inline-block" }}>
+      <img src="/assets/icons/three_menu_stripes_black.svg" alt="menuIcon" onClick={toggleMenu} />
+
+      {isOpen && (
+        <div className="menu">
+          <div style={{ padding: "8px", cursor: "pointer" }}>🔧 Einstellung</div>
+          <div style={{ padding: "8px", cursor: "pointer" }}>📁 Öffnen</div>
+          <div style={{ padding: "8px", cursor: "pointer" }}>❌ Schließen</div>
+        </div>
+      )}
+    </div>
+  );
+};
+
+
+
+// EXPORT VARIABLES
+export default Header;
\ No newline at end of file