feat: Berichte light und dark mode
This commit is contained in:
@@ -15,25 +15,38 @@ export default function MeldungenTabelle({
|
||||
return (
|
||||
<div className="overflow-auto max-h-[80vh]">
|
||||
<table className="min-w-full border">
|
||||
<thead className="bg-gray-100 text-left sticky top-0 z-10">
|
||||
<thead className="bg-white text-gray-900 dark:bg-gray-900 dark:text-gray-100 text-left sticky top-0 z-10">
|
||||
<tr>
|
||||
<th className="p-2 border">Prio</th>
|
||||
<th className="p-2 border">Zeitstempel</th>
|
||||
<th className="p-2 border">Quelle</th>
|
||||
<th className="p-2 border">Meldung</th>
|
||||
<th className="p-2 border">Status</th>
|
||||
<th className="p-2 border bg-white text-gray-900 dark:bg-gray-900 dark:text-gray-100">
|
||||
Prio
|
||||
</th>
|
||||
<th className="p-2 border bg-white text-gray-900 dark:bg-gray-900 dark:text-gray-100">
|
||||
Zeitstempel
|
||||
</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>
|
||||
</thead>
|
||||
<tbody>
|
||||
{messages.map((msg, index) => (
|
||||
<tr key={index} className="hover:bg-gray-200">
|
||||
<td className="border p-2">
|
||||
<tr
|
||||
key={index}
|
||||
className="hover:bg-gray-100 dark:hover:bg-gray-700"
|
||||
>
|
||||
<td className="border p-2 bg-white text-gray-900 dark:bg-gray-900 dark:text-gray-100">
|
||||
<div
|
||||
className="w-4 h-4 rounded"
|
||||
style={{ backgroundColor: msg.c }}
|
||||
></div>
|
||||
</td>
|
||||
<td className="border p-2">
|
||||
<td className="border p-2 bg-white text-gray-900 dark:bg-gray-900 dark:text-gray-100">
|
||||
{new Date(msg.t).toLocaleString("de-DE", {
|
||||
day: "2-digit",
|
||||
month: "2-digit",
|
||||
@@ -43,10 +56,15 @@ export default function MeldungenTabelle({
|
||||
second: "2-digit",
|
||||
})}
|
||||
</td>
|
||||
|
||||
<td className="border p-2">{msg.i}</td>
|
||||
<td className="border p-2">{msg.m}</td>
|
||||
<td className="border p-2">{msg.v}</td>
|
||||
<td className="border p-2 bg-white text-gray-900 dark:bg-gray-900 dark:text-gray-100">
|
||||
{msg.i}
|
||||
</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>
|
||||
))}
|
||||
</tbody>
|
||||
|
||||
Reference in New Issue
Block a user