CPL, Access 1 und Access 2 Status Komponente erstellt

components/Access1Status.jsx

@@ -0,0 +1,17 @@
+// components/Access1Status.jsx
+import React from "react";
+
+const Access1Status = () => {
+  return (
+    <div className="border border-gray-400 w-32 h-16 flex items-center justify-center relative">
+      {/* Grüner Streifen auf der linken Seite */}
+      <div className="absolute left-0 top-0 h-full w-1/6 bg-green-500"></div>
+      {/* Blauer Hauptbereich */}
+      <div className="bg-blue-500 flex-1 flex items-center justify-center text-white text-xl h-16">
+        Access 1
+      </div>
+    </div>
+  );
+};
+
+export default Access1Status;

components/Access2Status.jsx

@@ -0,0 +1,17 @@
+// components/Access2Status.jsx
+import React from "react";
+
+const Access2Status = () => {
+  return (
+    <div className="border border-gray-400 w-32 h-16 flex items-center justify-center relative">
+      {/* Grüner Streifen auf der linken Seite */}
+      <div className="absolute left-0 top-0 h-full w-1/6 bg-green-500"></div>
+      {/* Blauer Hauptbereich */}
+      <div className="bg-blue-500 flex-1 flex items-center justify-center text-white text-xl h-16">
+        Access 2
+      </div>
+    </div>
+  );
+};
+
+export default Access2Status;

components/CPLStatus.jsx

@@ -0,0 +1,17 @@
+// components/CPLStatus.jsx
+import React from "react";
+
+const CPLStatus = () => {
+  return (
+    <div className="border border-gray-400 w-32 h-16 flex items-center justify-center relative">
+      {/* Grüner Streifen auf der linken Seite */}
+      <div className="absolute left-0 top-0 h-full w-1/6 bg-green-500"></div>
+      {/* Blauer Hauptbereich */}
+      <div className="bg-blue-500 flex-1 flex items-center justify-center text-white text-xl h-16">
+        CPL
+      </div>
+    </div>
+  );
+};
+
+export default CPLStatus;

components/Header.jsx

@@ -45,10 +45,6 @@ function Header() {
           <h2 className="text-sm font-semibold">Stationsname</h2>
           <p className="font-bold text-lg">{stationsname}</p>
         </div>
-        <div className="flex flex-col text-left">
-          <p className="text-sm font-medium">CPL Status</p>
-          <span className="text-green-500 font-bold">{cplStatus}</span>
-        </div>
       </div>
 
       {/* Temperatur und Icons */}