From 98fbd5f6d0ceb46486d08068b62c210f3ec98b7c Mon Sep 17 00:00:00 2001
From: idittrich-valueon <idittrich@student.ethz.ch>
Date: Mon, 16 Jun 2025 15:09:24 +0200
Subject: [PATCH] changed layout to remove white border

---
 src/App.tsx                                   |  3 +++
 src/components/Sidebar/Sidebar.module.css     |  7 +++++--
 src/components/Sidebar/SidebarData.tsx        |  2 +-
 src/components/Sidebar/SidebarUser.module.css |  2 +-
 src/index.css                                 | 18 ++++++++++++++++++
 src/pages/Home.module.css                     | 10 +++++-----
 6 files changed, 33 insertions(+), 9 deletions(-)
 create mode 100644 src/index.css

diff --git a/src/App.tsx b/src/App.tsx
index 3dd7453..80f2e51 100644
--- a/src/App.tsx
+++ b/src/App.tsx
@@ -1,5 +1,8 @@
 import { BrowserRouter as Router, Routes, Route } from 'react-router-dom';
 
+// Import global CSS reset first
+import './index.css';
+
 import Login from './pages/Login';
 import Register from './pages/Register';
 
diff --git a/src/components/Sidebar/Sidebar.module.css b/src/components/Sidebar/Sidebar.module.css
index f69c064..b88cd57 100644
--- a/src/components/Sidebar/Sidebar.module.css
+++ b/src/components/Sidebar/Sidebar.module.css
@@ -5,15 +5,18 @@
     background: var(--color-bg);
     box-shadow: 0px 2px 6px 0px rgba(194, 194, 194, 0.10);
     width: 240px;
-    flex-shrink: 0;
     margin-top: 51px;
     margin-left: 49px;
     padding-bottom: 1px;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    flex-direction: column;
 }
 
 .sidebar {
     display: flex;
-    width: 200px;
+    width: 240px;
     flex-direction: column;
     align-items: flex-start;
     flex-shrink: 0;
diff --git a/src/components/Sidebar/SidebarData.tsx b/src/components/Sidebar/SidebarData.tsx
index 53c3f5e..0f279d1 100644
--- a/src/components/Sidebar/SidebarData.tsx
+++ b/src/components/Sidebar/SidebarData.tsx
@@ -50,7 +50,7 @@ const useSidebarData = () => {
     {
       id: '7',
       name: 'Settings',
-      link: 'einstellungen',
+      link: '/einstellungen',
       icon: GoGear,
     },
     {
diff --git a/src/components/Sidebar/SidebarUser.module.css b/src/components/Sidebar/SidebarUser.module.css
index 6e8cc22..e6e9e41 100644
--- a/src/components/Sidebar/SidebarUser.module.css
+++ b/src/components/Sidebar/SidebarUser.module.css
@@ -1,6 +1,6 @@
 .user_section {
     display: flex;
-    width: 200px;
+    width: 240px;
     height: auto;
     min-height: 100px;
     padding: 20px;
diff --git a/src/index.css b/src/index.css
new file mode 100644
index 0000000..34d6aee
--- /dev/null
+++ b/src/index.css
@@ -0,0 +1,18 @@
+/* Global CSS Reset */
+* {
+    box-sizing: border-box;
+}
+
+html, body {
+    margin: 0;
+    padding: 0;
+    height: 100%;
+    overflow: hidden;
+}
+
+#root {
+    height: 100vh;
+    width: 100vw;
+    margin: 0;
+    padding: 0;
+} 
\ No newline at end of file
diff --git a/src/pages/Home.module.css b/src/pages/Home.module.css
index 7fef3c5..10d4319 100644
--- a/src/pages/Home.module.css
+++ b/src/pages/Home.module.css
@@ -1,14 +1,13 @@
 .homeContainer {
     position: relative;
     background-color: var(--color-surface);
-    min-height: calc(100vh - 15px);
-    max-height: calc(100vh - 15px);
-    width: 100%;
+    min-height: 100vh;
+    max-height: 100vh;
+    width: 100vw;
     font-family: var(--font-family);
     z-index: 0;
     overflow: hidden;
-    padding: 0 49px 0 36px;
-    width: calc(100% - 49px - 36px);
+    padding: 0 49px 0 0;
   }
   
   .homeContainer::before {
@@ -34,4 +33,5 @@
 .body {
     display: flex;
     max-width: 100vw;
+    height: 100vh;
 }
\ No newline at end of file