From 85860ae9f0270fecdaf3db524b0acd7f21861032 Mon Sep 17 00:00:00 2001
From: ISA <Ismail.ali@littwin-systemtechnik.de>
Date: Thu, 31 Jul 2025 13:54:56 +0200
Subject: [PATCH] style: LEDs style

---
 .env.development                              |  2 +-
 .env.production                               |  2 +-
 CHANGELOG.md                                  |  5 ++
 .../fall-detection-sensors/FallSensors.tsx    | 51 +++++++++++--------
 package-lock.json                             |  4 +-
 package.json                                  |  2 +-
 6 files changed, 41 insertions(+), 25 deletions(-)

diff --git a/.env.development b/.env.development
index 72f4c0f..4b27ae1 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.662
+NEXT_PUBLIC_APP_VERSION=1.6.663
 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 530cd9e..056b46e 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.662
+NEXT_PUBLIC_APP_VERSION=1.6.663
 NEXT_PUBLIC_CPL_MODE=production
\ No newline at end of file
diff --git a/CHANGELOG.md b/CHANGELOG.md
index 0803a8b..b8ca29c 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -1,3 +1,8 @@
+## [1.6.663] – 2025-07-31
+
+- feat: KVZ API JSON Data
+
+---
 ## [1.6.662] – 2025-07-31
 
 - Feat: KVz Bereich in EinstellungsModal in KÜs Modal
diff --git a/components/main/fall-detection-sensors/FallSensors.tsx b/components/main/fall-detection-sensors/FallSensors.tsx
index 114280e..e42392c 100644
--- a/components/main/fall-detection-sensors/FallSensors.tsx
+++ b/components/main/fall-detection-sensors/FallSensors.tsx
@@ -22,28 +22,39 @@ const FallSensors: React.FC<FallSensorsProps> = ({ slotIndex }) => {
   });
 
   return (
-    <div className="flex justify-center items-center gap-2 p-3 border rounded-lg bg-gray-100 shadow-sm">
-      {leds.map((ledStatus, ledIndex) => {
-        // LED Farben: grün (1), rot (0), grau (2)
-        let bgColor = "bg-gray-400"; // Standard grau
-        let statusText = "Unbekannt";
+    <div className="bg-gray-300 border border-gray-400 rounded p-1">
+      {/* Überschrift mit KVZ-Labels */}
+      <div className="flex justify-between items-center mb-2">
+        <span className="text-[8px] font-medium text-gray-700">KVZ1</span>
+        <span className="text-[8px] font-medium text-gray-700">KVZ2</span>
+        <span className="text-[8px] font-medium text-gray-700">KVZ3</span>
+        <span className="text-[8px] font-medium text-gray-700">KVZ4</span>
+      </div>
 
-        if (ledStatus === "green") {
-          bgColor = "bg-green-500";
-          statusText = "Ein";
-        } else if (ledStatus === "red") {
-          bgColor = "bg-red-500";
-          statusText = "Aus";
-        }
+      {/* LEDs */}
+      <div className="flex justify-between items-center">
+        {leds.map((ledStatus, ledIndex) => {
+          // LED Farben: grün (1), rot (0), grau (2)
+          let bgColor = "bg-gray-400"; // Standard grau
+          let statusText = "Unbekannt";
 
-        return (
-          <div
-            key={ledIndex}
-            className={`w-3 h-3 rounded-full border-2 border-gray-300 shadow-sm ${bgColor} transition-all duration-200 hover:scale-110 flex-shrink-0`}
-            title={`Slot ${slotIndex} LED${ledIndex + 1}: ${statusText}`}
-          />
-        );
-      })}
+          if (ledStatus === "green") {
+            bgColor = "bg-green-500";
+            statusText = "Ein";
+          } else if (ledStatus === "red") {
+            bgColor = "bg-red-500";
+            statusText = "Aus";
+          }
+
+          return (
+            <div
+              key={ledIndex}
+              className={`w-4 h-4 rounded-full border border-gray-500 ${bgColor} flex-shrink-0`}
+              title={`Slot ${slotIndex} LED${ledIndex + 1}: ${statusText}`}
+            />
+          );
+        })}
+      </div>
     </div>
   );
 };
diff --git a/package-lock.json b/package-lock.json
index ef23d9a..bc659ed 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -1,12 +1,12 @@
 {
   "name": "cpl-v4",
-  "version": "1.6.662",
+  "version": "1.6.663",
   "lockfileVersion": 3,
   "requires": true,
   "packages": {
     "": {
       "name": "cpl-v4",
-      "version": "1.6.662",
+      "version": "1.6.663",
       "dependencies": {
         "@fontsource/roboto": "^5.1.0",
         "@headlessui/react": "^2.2.4",
diff --git a/package.json b/package.json
index 90e07cb..c15324d 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "cpl-v4",
-  "version": "1.6.662",
+  "version": "1.6.663",
   "private": true,
   "scripts": {
     "dev": "next dev",