WIP: dark mode Berichte

This commit is contained in:
ISA
2025-09-08 15:22:06 +02:00
parent 27c60c6742
commit fefff9419d
7 changed files with 25 additions and 36 deletions

View File

@@ -6,6 +6,6 @@ NEXT_PUBLIC_USE_MOCK_BACKEND_LOOP_START=false
NEXT_PUBLIC_EXPORT_STATIC=false NEXT_PUBLIC_EXPORT_STATIC=false
NEXT_PUBLIC_USE_CGI=false NEXT_PUBLIC_USE_CGI=false
# App-Versionsnummer # App-Versionsnummer
NEXT_PUBLIC_APP_VERSION=1.6.876 NEXT_PUBLIC_APP_VERSION=1.6.877
NEXT_PUBLIC_CPL_MODE=json # json (Entwicklungsumgebung) oder jsSimulatedProd (CPL ->CGI-Interface-Simulator) oder production (CPL-> CGI-Interface Platzhalter) NEXT_PUBLIC_CPL_MODE=json # json (Entwicklungsumgebung) oder jsSimulatedProd (CPL ->CGI-Interface-Simulator) oder production (CPL-> CGI-Interface Platzhalter)

View File

@@ -5,5 +5,5 @@ NEXT_PUBLIC_CPL_API_PATH=/CPL
NEXT_PUBLIC_EXPORT_STATIC=true NEXT_PUBLIC_EXPORT_STATIC=true
NEXT_PUBLIC_USE_CGI=true NEXT_PUBLIC_USE_CGI=true
# App-Versionsnummer # App-Versionsnummer
NEXT_PUBLIC_APP_VERSION=1.6.876 NEXT_PUBLIC_APP_VERSION=1.6.877
NEXT_PUBLIC_CPL_MODE=production NEXT_PUBLIC_CPL_MODE=production

View File

@@ -1,3 +1,8 @@
## [1.6.877] 2025-09-08
- WIP: dark mode Modale
---
## [1.6.876] 2025-09-08 ## [1.6.876] 2025-09-08
- WIP: dark mode Baugrüppenträger sttus - WIP: dark mode Baugrüppenträger sttus

View File

@@ -129,7 +129,7 @@ function KabelueberwachungView() {
className={`mr-2 px-2 py-1 rounded-sm text-sm font-medium transition-colors focus:outline-none focus:ring-2 focus:ring-accent/50 ${ className={`mr-2 px-2 py-1 rounded-sm text-sm font-medium transition-colors focus:outline-none focus:ring-2 focus:ring-accent/50 ${
isActive isActive
? "btn-primary" ? "btn-primary"
: "btn-muted text-fg-muted hover:text-fg" : "btn-muted text-fg opacity-90 hover:opacity-100"
}`} }`}
> >
Rack {rack} Rack {rack}

View File

@@ -14,39 +14,29 @@ export default function MeldungenTabelle({
}) { }) {
return ( return (
<div className="overflow-auto max-h-[80vh]"> <div className="overflow-auto max-h-[80vh]">
<table className="min-w-full border"> <table className="min-w-full border border-base table-surface text-fg">
<thead className="bg-white text-gray-900 dark:bg-gray-900 dark:text-gray-100 text-left sticky top-0 z-10"> <thead className="text-left sticky top-0 z-10 bg-surface-alt/90 backdrop-blur supports-[backdrop-filter]:bg-surface-alt/70">
<tr> <tr>
<th className="p-2 border bg-white text-gray-900 dark:bg-gray-900 dark:text-gray-100"> <th className="p-2 border border-base bg-surface-alt text-fg font-medium">Prio</th>
Prio <th className="p-2 border border-base bg-surface-alt text-fg font-medium">Zeitstempel</th>
</th> <th className="p-2 border border-base bg-surface-alt text-fg font-medium">Quelle</th>
<th className="p-2 border bg-white text-gray-900 dark:bg-gray-900 dark:text-gray-100"> <th className="p-2 border border-base bg-surface-alt text-fg font-medium">Meldung</th>
Zeitstempel <th className="p-2 border border-base bg-surface-alt text-fg font-medium">Status</th>
</th>
<th className="p-2 border bg-white text-gray-900 dark:bg-gray-900 dark:text-gray-100">
Quelle
</th>
<th className="p-2 border bg-white text-gray-900 dark:bg-gray-900 dark:text-gray-100">
Meldung
</th>
<th className="p-2 border bg-white text-gray-900 dark:bg-gray-900 dark:text-gray-100">
Status
</th>
</tr> </tr>
</thead> </thead>
<tbody> <tbody>
{messages.map((msg, index) => ( {messages.map((msg, index) => (
<tr <tr
key={index} key={index}
className="hover:bg-gray-100 dark:hover:bg-gray-700" className="transition-colors hover:bg-surface-alt/60"
> >
<td className="border p-2 bg-white text-gray-900 dark:bg-gray-900 dark:text-gray-100"> <td className="border border-base p-2 bg-surface text-fg">
<div <div
className="w-4 h-4 rounded" className="w-4 h-4 rounded"
style={{ backgroundColor: msg.c }} style={{ backgroundColor: msg.c }}
></div> ></div>
</td> </td>
<td className="border p-2 bg-white text-gray-900 dark:bg-gray-900 dark:text-gray-100"> <td className="border border-base p-2 bg-surface text-fg">
{new Date(msg.t).toLocaleString("de-DE", { {new Date(msg.t).toLocaleString("de-DE", {
day: "2-digit", day: "2-digit",
month: "2-digit", month: "2-digit",
@@ -56,21 +46,15 @@ export default function MeldungenTabelle({
second: "2-digit", second: "2-digit",
})} })}
</td> </td>
<td className="border p-2 bg-white text-gray-900 dark:bg-gray-900 dark:text-gray-100"> <td className="border border-base p-2 bg-surface text-fg">{msg.i}</td>
{msg.i} <td className="border border-base p-2 bg-surface text-fg">{msg.m}</td>
</td> <td className="border border-base p-2 bg-surface text-fg">{msg.v}</td>
<td className="border p-2 bg-white text-gray-900 dark:bg-gray-900 dark:text-gray-100">
{msg.m}
</td>
<td className="border p-2 bg-white text-gray-900 dark:bg-gray-900 dark:text-gray-100">
{msg.v}
</td>
</tr> </tr>
))} ))}
</tbody> </tbody>
</table> </table>
{messages.length === 0 && ( {messages.length === 0 && (
<div className="mt-4 text-center text-gray-500 italic"> <div className="mt-4 text-center text-fg-muted italic">
Keine Meldungen im gewählten Zeitraum vorhanden. Keine Meldungen im gewählten Zeitraum vorhanden.
</div> </div>
)} )}

4
package-lock.json generated
View File

@@ -1,12 +1,12 @@
{ {
"name": "cpl-v4", "name": "cpl-v4",
"version": "1.6.876", "version": "1.6.877",
"lockfileVersion": 3, "lockfileVersion": 3,
"requires": true, "requires": true,
"packages": { "packages": {
"": { "": {
"name": "cpl-v4", "name": "cpl-v4",
"version": "1.6.876", "version": "1.6.877",
"dependencies": { "dependencies": {
"@fontsource/roboto": "^5.1.0", "@fontsource/roboto": "^5.1.0",
"@headlessui/react": "^2.2.4", "@headlessui/react": "^2.2.4",

View File

@@ -1,6 +1,6 @@
{ {
"name": "cpl-v4", "name": "cpl-v4",
"version": "1.6.876", "version": "1.6.877",
"private": true, "private": true,
"scripts": { "scripts": {
"dev": "next dev -p 3000", "dev": "next dev -p 3000",