feat: system dark and light mode
This commit is contained in:
@@ -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>
|
||||
|
||||
@@ -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}
|
||||
|
||||
@@ -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);
|
||||
};
|
||||
|
||||
|
||||
Reference in New Issue
Block a user