From 6d571094ff41036d86b0d0901b576ac5f8646513 Mon Sep 17 00:00:00 2001
From: FlorianSpeicher <flo200538@gmail.com>
Date: Thu, 22 May 2025 17:45:10 +0200
Subject: [PATCH] Fixed Filter container position

---
 01-frontend/src/helper/NavBar.css |  2 +-
 01-frontend/src/helper/NavBar.tsx |  5 +++--
 01-frontend/src/pages/pages.css   | 11 ++++++++---
 3 files changed, 12 insertions(+), 6 deletions(-)

diff --git a/01-frontend/src/helper/NavBar.css b/01-frontend/src/helper/NavBar.css
index 8c29a41..b85e29e 100644
--- a/01-frontend/src/helper/NavBar.css
+++ b/01-frontend/src/helper/NavBar.css
@@ -4,7 +4,7 @@
     box-shadow: 0px 4px 6px rgba(0, 0, 0, 0.1);
     position: absolute;
     top: 0;
-    height: 3rem;
+    width: 100%;
 }
 
 /* Logo styles */
diff --git a/01-frontend/src/helper/NavBar.tsx b/01-frontend/src/helper/NavBar.tsx
index 41c1f87..788e777 100644
--- a/01-frontend/src/helper/NavBar.tsx
+++ b/01-frontend/src/helper/NavBar.tsx
@@ -15,6 +15,7 @@ import AdbIcon from '@mui/icons-material/Adb';
 import { alpha, InputBase, styled } from '@mui/material';
 import SearchIcon from '@mui/icons-material/Search';
 import { useNavigate } from 'react-router-dom';
+import './navbar.css';
 
 const pages = ['Categories', 'Checkout', 'Contact'];
 const settings = ['Account', 'Orders', 'Logout'];
@@ -85,10 +86,10 @@ export default function NavBar() {
 
 
     return (
-        <AppBar sx={{bgcolor: 'green'}}>
+        <AppBar className="navbar">
             <Container maxWidth="xl">
                 <Toolbar disableGutters>
-                    <AdbIcon sx={{ display: { xs: 'none', md: 'flex' }, mr: 1, color: 'white' }} />
+                    <AdbIcon className='navbar-logo' />
                     <Typography
                         variant="h6"
                         noWrap
diff --git a/01-frontend/src/pages/pages.css b/01-frontend/src/pages/pages.css
index 6b926f6..bc9b0ce 100644
--- a/01-frontend/src/pages/pages.css
+++ b/01-frontend/src/pages/pages.css
@@ -32,14 +32,14 @@
 .no-page-button {
   font-size: 1rem;
   padding: 12px 24px;
-  background-color: #1976d2;
+  background-color: primary;
   color: white;
   border-radius: 8px;
   transition: background-color 0.3s ease;
 }
 
 .no-page-button:hover {
-  background-color: #115293;
+  background-color: primary;
 }
 
 .cardgrid {
@@ -131,8 +131,13 @@
 }
 
 .filter-container {
-    width: 10%;
+    width: 17%;
     display: grid;
     margin-left: 20px;
     margin-right: -20px;
+    margin-top: 20px;
+    margin-bottom: 20px;
+    place-self: start;
+
+
 }
\ No newline at end of file