From 95c884bc079a207607a8c75aeca1210822c39eb2 Mon Sep 17 00:00:00 2001
From: ISA <Ismail.ali@littwin-systemtechnik.de>
Date: Wed, 10 Sep 2025 13:33:23 +0200
Subject: [PATCH] style: header, navigation und _app.tsx

---
 .env.development                     | 2 +-
 .env.production                      | 2 +-
 CHANGELOG.md                         | 5 +++++
 components/header/Header.tsx         | 2 +-
 components/navigation/Navigation.tsx | 4 ++--
 package-lock.json                    | 4 ++--
 package.json                         | 2 +-
 pages/_app.tsx                       | 9 ++++++---
 8 files changed, 19 insertions(+), 11 deletions(-)

diff --git a/.env.development b/.env.development
index a0a12f1..12411da 100644
--- a/.env.development
+++ b/.env.development
@@ -6,6 +6,6 @@ NEXT_PUBLIC_USE_MOCK_BACKEND_LOOP_START=false
 NEXT_PUBLIC_EXPORT_STATIC=false
 NEXT_PUBLIC_USE_CGI=false
 # App-Versionsnummer
-NEXT_PUBLIC_APP_VERSION=1.6.901
+NEXT_PUBLIC_APP_VERSION=1.6.902
 NEXT_PUBLIC_CPL_MODE=json   # json (Entwicklungsumgebung) oder jsSimulatedProd (CPL ->CGI-Interface-Simulator) oder production (CPL-> CGI-Interface Platzhalter)
 
diff --git a/.env.production b/.env.production
index 1a7f100..ac91dbc 100644
--- a/.env.production
+++ b/.env.production
@@ -5,5 +5,5 @@ NEXT_PUBLIC_CPL_API_PATH=/CPL
 NEXT_PUBLIC_EXPORT_STATIC=true
 NEXT_PUBLIC_USE_CGI=true
 # App-Versionsnummer
-NEXT_PUBLIC_APP_VERSION=1.6.901
+NEXT_PUBLIC_APP_VERSION=1.6.902
 NEXT_PUBLIC_CPL_MODE=production
\ No newline at end of file
diff --git a/CHANGELOG.md b/CHANGELOG.md
index 1664ebd..8341891 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -1,3 +1,8 @@
+## [1.6.902] – 2025-09-10
+
+- style: Header wie Footer Hintergrundfarbe
+
+---
 ## [1.6.901] – 2025-09-10
 
 - style: Header wie Footer Hintergrunffarbe
diff --git a/components/header/Header.tsx b/components/header/Header.tsx
index c9e9162..16755f7 100644
--- a/components/header/Header.tsx
+++ b/components/header/Header.tsx
@@ -145,7 +145,7 @@ function Header() {
   }, []);
 
   return (
-    <header className="bg-[var(--color-surface-alt)] dark:bg-[var(--color-surface-alt)] flex justify-between items-center w-full h-[13vh] laptop:h-[10vh] relative text-[var(--color-fg)] shadow-sm border-b border-base theme-transition">
+    <header className="bg-[var(--color-surface-alt)] dark:bg-[var(--color-surface-alt)] flex justify-between items-center w-full h-[13vh] laptop:h-[10vh] relative text-[var(--color-fg)]  border-b border-base theme-transition">
       <div
         className="absolute transform -translate-y-1/2 
                 left-[8%] sm:left-[8%] md:left-[8%] lg:left-[8%] xl:left-[6%] 2xl:left-[2%] laptop:left-[4%] laptop:
diff --git a/components/navigation/Navigation.tsx b/components/navigation/Navigation.tsx
index eb85a2a..526d751 100644
--- a/components/navigation/Navigation.tsx
+++ b/components/navigation/Navigation.tsx
@@ -36,8 +36,8 @@ const Navigation: React.FC<NavigationProps> = ({ className }) => {
   ];
 
   return (
-    <aside className="h-full bg-[var(--color-surface)] dark:bg-[var(--color-surface)] border-r border-[var(--color-border)]">
-      <nav className={`h-full flex-shrink-0 mt-16 ${className || "w-48"}`}>
+    <aside className="h-full bg-[var(--color-surface)] dark:bg-[var(--color-surface)] ">
+      <nav className={`h-full flex-shrink-0 mt-24 ${className || "w-48"}`}>
         {menuItems.map((item) => (
           <div key={item.name}>
             {item.disabled ? (
diff --git a/package-lock.json b/package-lock.json
index c5b7412..9b72cfa 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -1,12 +1,12 @@
 {
   "name": "cpl-v4",
-  "version": "1.6.901",
+  "version": "1.6.902",
   "lockfileVersion": 3,
   "requires": true,
   "packages": {
     "": {
       "name": "cpl-v4",
-      "version": "1.6.901",
+      "version": "1.6.902",
       "dependencies": {
         "@emotion/react": "^11.13.0",
         "@emotion/styled": "^11.13.0",
diff --git a/package.json b/package.json
index a46e27c..05dbcbc 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "cpl-v4",
-  "version": "1.6.901",
+  "version": "1.6.902",
   "private": true,
   "scripts": {
     "dev": "next dev -p 3000",
diff --git a/pages/_app.tsx b/pages/_app.tsx
index 138adcd..fc10941 100644
--- a/pages/_app.tsx
+++ b/pages/_app.tsx
@@ -47,7 +47,10 @@ function MyApp({ Component, pageProps }: AppProps) {
   const [theme, setTheme] = useState(muiTheme);
   useEffect(() => {
     const observer = new MutationObserver(() => setTheme(buildTheme()));
-    observer.observe(document.documentElement, { attributes: true, attributeFilter: ["class"] });
+    observer.observe(document.documentElement, {
+      attributes: true,
+      attributeFilter: ["class"],
+    });
     return () => observer.disconnect();
   }, []);
   return (
@@ -160,8 +163,8 @@ function AppContent({
     <div className="flex flex-col h-screen overflow-hidden bg-[var(--color-background)] text-[var(--color-fg)]">
       <Header />
       <div className="flex flex-grow w-full">
-        <Navigation className="w-56" />
-        <main className="w-full flex-grow bg-[var(--color-surface)] dark:bg-[var(--color-surface)] border-l border-[var(--color-border)]">
+        <Navigation className="w-56 mr-8" />
+        <main className="w-full flex-grow bg-[var(--color-surface)] dark:bg-[var(--color-surface)] border border-base rounded-lg m-1 p-1 overflow-auto relative">
           {sessionExpired && (
             <div className="bg-red-500 text-white p-4 text-center">
               ❌ Ihre Sitzung ist abgelaufen oder die Verbindung ist