style: AnalogInputsChartModal dark mode

components/main/analogInputs/AnalogInputsChartModal.tsx

@@ -35,82 +35,50 @@ export default function AnalogInputsChartModal({
       <div className="fixed inset-0 bg-black/50" aria-hidden="true" />
       {/* Centered panel */}
       <div className="fixed inset-0 flex items-center justify-center p-4">
-        <Dialog.Panel className="relative">
+        <Dialog.Panel className="relative outline-none">
           <div
-            className="bg-white rounded-xl shadow-xl border border-gray-200"
+            className={`rounded-xl shadow-xl border border-base bg-[var(--color-surface)] text-fg flex flex-col transition-all duration-300 overflow-hidden`}
             style={{
               width: isFullscreen ? "90vw" : "70rem",
-              height: isFullscreen ? "90vh" : "35rem",
-              padding: "1rem",
-              transition: "all 0.3s ease-in-out",
-              display: "flex",
-              flexDirection: "column",
+              height: isFullscreen ? "90vh" : "38rem",
             }}
           >
-            {/* Controls top-right (fullscreen + close) */}
-            <div
-              style={{
-                position: "absolute",
-                top: "0.625rem",
-                right: "0.625rem",
-                display: "flex",
-                gap: "0.75rem",
-              }}
-            >
-              <button
-                onClick={() => setIsFullscreen((v) => !v)}
-                style={{
-                  background: "transparent",
-                  border: "none",
-                  fontSize: "1.5rem",
-                  cursor: "pointer",
-                }}
-                title={isFullscreen ? "Exit fullscreen" : "Fullscreen"}
-                aria-label={isFullscreen ? "Exit fullscreen" : "Fullscreen"}
-              >
-                <i
-                  className={
-                    isFullscreen
-                      ? "bi bi-fullscreen-exit"
-                      : "bi bi-arrows-fullscreen"
-                  }
-                ></i>
-              </button>
-              <button
-                onClick={() => dispatch(setIsChartModalOpen(false))}
-                style={{
-                  background: "transparent",
-                  border: "none",
-                  fontSize: "1.5rem",
-                  cursor: "pointer",
-                }}
-                title="Schließen"
-                aria-label="Modal schließen"
-              >
-                <i className="bi bi-x-circle-fill"></i>
-              </button>
-            </div>
-
-            {/* Title row (align like IsoChartView) */}
-            <div className="flex justify-between items-center mb-2 pr-24">
-              <Dialog.Title className="text-lg font-semibold text-gray-700">
+            {/* Header */}
+            <header className="flex items-center justify-between px-6 py-4 border-b border-base select-none">
+              <h2 className="text-base font-bold">
                 Messkurve Messwerteingang {selectedId ?? "–"}
-              </Dialog.Title>
-            </div>
-
-            {/* Chart container (structure similar to IsoChartView) */}
-            <div
-              style={{
-                flex: 1,
-                display: "flex",
-                flexDirection: "column",
-                height: "90%",
-              }}
-            >
-              {/* Optional: place an action bar here if needed */}
-              <div style={{ flex: 1, height: "90%" }}>
-                <AnalogInputsChart loading={loading} setLoading={setLoading} />
+              </h2>
+              <div className="flex items-center gap-3">
+                <button
+                  onClick={() => setIsFullscreen((v) => !v)}
+                  className="icon-btn text-xl"
+                  aria-label={isFullscreen ? "Vollbild verlassen" : "Vollbild"}
+                  type="button"
+                  title={isFullscreen ? "Vollbild verlassen" : "Vollbild"}
+                >
+                  <i
+                    className={
+                      isFullscreen
+                        ? "bi bi-fullscreen-exit"
+                        : "bi bi-arrows-fullscreen"
+                    }
+                  />
+                </button>
+                <button
+                  onClick={() => dispatch(setIsChartModalOpen(false))}
+                  className="icon-btn text-2xl"
+                  aria-label="Modal schließen"
+                  type="button"
+                  title="Schließen"
+                >
+                  <i className="bi bi-x-circle-fill" />
+                </button>
               </div>
+            </header>
+
+            {/* Body */}
+            <div className="flex-1 min-h-0 px-4 pt-3 pb-4 bg-[var(--color-surface)]">
+              <AnalogInputsChart loading={loading} setLoading={setLoading} />
             </div>
           </div>
         </Dialog.Panel>