From 79df00a17e57a7e5d8bf433b3c3ef8cb80936162 Mon Sep 17 00:00:00 2001
From: "theis.gaedigk" <theis.gaedigk@icloud.com>
Date: Thu, 21 Aug 2025 18:53:18 +0200
Subject: [PATCH] added footer component

---
 frontend/src/components/Footer.tsx    | 12 ++++++++++++
 frontend/src/components/LoginForm.tsx |  2 ++
 frontend/src/layout/Layout.tsx        |  8 ++++----
 3 files changed, 18 insertions(+), 4 deletions(-)
 create mode 100644 frontend/src/components/Footer.tsx

diff --git a/frontend/src/components/Footer.tsx b/frontend/src/components/Footer.tsx
new file mode 100644
index 0000000..55d4654
--- /dev/null
+++ b/frontend/src/components/Footer.tsx
@@ -0,0 +1,12 @@
+import React from "react";
+
+const Footer: React.FC = () => {
+  return (
+    <footer className="fixed bottom-0 left-0 text-sm w-full bg-slate-100 text-center py-2 border-t border-slate-200 z-50">
+      <p>Made with ❤️ by Theis Gaedigk - Jahrgang 2019</p>
+      <p>v1.1</p>
+    </footer>
+  );
+};
+
+export default Footer;
diff --git a/frontend/src/components/LoginForm.tsx b/frontend/src/components/LoginForm.tsx
index ea74839..2769b06 100644
--- a/frontend/src/components/LoginForm.tsx
+++ b/frontend/src/components/LoginForm.tsx
@@ -1,4 +1,5 @@
 import React from "react";
+import Footer from "./Footer";
 import { useState } from "react";
 import { loginUser } from "../utils/fetchData";
 import { myToast } from "../utils/toastify";
@@ -66,6 +67,7 @@ const LoginForm: React.FC<LoginFormProps> = ({ onLogin }) => {
           </button>
         </form>
       </div>
+      <Footer />
     </div>
   );
 };
diff --git a/frontend/src/layout/Layout.tsx b/frontend/src/layout/Layout.tsx
index ec0e586..37a36ff 100644
--- a/frontend/src/layout/Layout.tsx
+++ b/frontend/src/layout/Layout.tsx
@@ -2,6 +2,7 @@ import React from "react";
 import "../App.css";
 import Header from "../components/Header";
 import Sidebar from "../components/Sidebar";
+import Footer from "../components/Footer";
 
 type LayoutProps = {
   children: React.ReactNode;
@@ -10,15 +11,13 @@ type LayoutProps = {
 
 const Layout: React.FC<LayoutProps> = ({ children, onLogout }) => {
   return (
-    <div className="h-screen overflow-hidden flex bg-slate-50 text-slate-800">
+    <div className="h-screen flex flex-col bg-slate-50 text-slate-800">
       {/* Main */}
-      <main className="flex-1 min-h-0 overflow-hidden flex flex-col items-center px-3 sm:px-5 py-4 sm:py-8">
-        {/* Sidebar on mobile appears inline on top; on desktop it's a sticky column */}
+      <main className="flex-1 min-h-0 overflow-hidden flex flex-col items-center px-3 sm:px-5 py-4 sm:py-8 pb-12">
         <div className="w-full max-w-5xl flex flex-col gap-3 md:flex-row md:gap-6 md:items-stretch min-h-0 h-full">
           <div className="hidden md:flex md:flex-col md:shrink-0 md:w-72 md:min-h-0 md:h-full">
             <Sidebar />
           </div>
-
           <div className="flex-1 min-w-0 min-h-0 h-full flex flex-col overflow-hidden">
             <div className="w-full">
               <Header onLogout={onLogout} />
@@ -29,6 +28,7 @@ const Layout: React.FC<LayoutProps> = ({ children, onLogout }) => {
           </div>
         </div>
       </main>
+      <Footer />
     </div>
   );
 };