feat: system dark and light mode

This commit is contained in:
ISA
2025-08-18 14:44:10 +02:00
parent eae8ea37d0
commit bb06618919
8 changed files with 44 additions and 35 deletions

View File

@@ -476,7 +476,7 @@ export const DetailModal = ({
/>
</svg>
</Listbox.Button>
<Listbox.Options className="absolute z-50 mt-1 w-full border rounded bg-white shadow max-h-60 overflow-auto text-sm">
<Listbox.Options className="absolute z-50 mt-1 w-full border rounded bg-white dark:bg-gray-800 shadow max-h-60 overflow-auto text-sm border-gray-200 dark:border-gray-700 text-gray-900 dark:text-gray-100">
{["DIA0", "DIA1", "DIA2"].map((option) => (
<Listbox.Option
key={option}
@@ -486,7 +486,7 @@ export const DetailModal = ({
selected
? "bg-littwin-blue text-white"
: active
? "bg-gray-200"
? "bg-gray-200 dark:bg-gray-700"
: ""
}`
}
@@ -514,7 +514,7 @@ export const DetailModal = ({
</button>
</div>
<div className="h-[85%]">
<div className="h-[85%] bg-white dark:bg-gray-800 rounded shadow border border-gray-200 dark:border-gray-700 p-2">
<Line ref={chartRef} data={chartData} options={chartOptions} />
</div>
</div>

View File

@@ -12,9 +12,12 @@ export const SystemOverviewGrid = ({ voltages, onOpenDetail }: Props) => {
return (
<div className="grid grid-cols-2 gap-4 mb-8">
{Object.entries(voltages).map(([key, value]) => {
const unit = key.includes("Temp") ? "°C" : "V";
const unit = key.includes("Temp") ? "\u00b0C" : "V";
return (
<div key={key} className="p-4 border rounded shadow">
<div
key={key}
className="p-4 border rounded shadow bg-white dark:bg-gray-800 border-gray-200 dark:border-gray-700 text-gray-900 dark:text-gray-100"
>
<h2 className="font-semibold">{key}</h2>
<p>
{formatValue(value)} {unit}

View File

@@ -42,33 +42,34 @@ const SystemPage = () => {
const handleOpenDetail = (key: string) => {
setSelectedKey(key);
setIsModalOpen(true);
// Nur passenden Thunk aufrufen
switch (key) {
case "+5V":
dispatch(getSystemspannung5VplusThunk(zeitraum));
break;
case "+15V":
dispatch(getSystemspannung15VplusThunk(zeitraum));
break;
case "-15V":
dispatch(getSystemspannung15VminusThunk(zeitraum));
break;
case "-98V":
dispatch(getSystemspannung98VminusThunk(zeitraum));
break;
case "ADC Temp":
dispatch(getTemperaturAdWandlerThunk(zeitraum));
break;
case "CPU Temp":
dispatch(getTemperaturProzessorThunk(zeitraum));
break;
}
const handleOpenDetail = (key: string) => {
setSelectedKey(key);
setIsModalOpen(true);
switch (key) {
case "+5V":
dispatch(getSystemspannung5VplusThunk(zeitraum));
break;
case "+15V":
dispatch(getSystemspannung15VplusThunk(zeitraum));
break;
case "-15V":
dispatch(getSystemspannung15VminusThunk(zeitraum));
break;
case "-98V":
dispatch(getSystemspannung98VminusThunk(zeitraum));
break;
case "ADC Temp":
dispatch(getTemperaturAdWandlerThunk(zeitraum));
break;
case "CPU Temp":
dispatch(getTemperaturProzessorThunk(zeitraum));
break;
default:
break;
}
};
};
const handleCloseDetail = () => {
setSelectedKey(null);
setIsModalOpen(false);
};