Iconify/react icons in dashboard/page.jsx
This commit is contained in:
@@ -8,6 +8,7 @@ import CPLStatus from "../../components/modulesStatus/CPLStatus";
|
||||
import Access1Status from "../../components/modulesStatus/Access1Status";
|
||||
import Access2Status from "../../components/modulesStatus/Access2Status";
|
||||
import Kue705_FO from "../../components/modulesStatus/Kue705_FO";
|
||||
import { Icon } from "@iconify/react";
|
||||
|
||||
function Dashboard() {
|
||||
const apiUrl = process.env.NEXT_PUBLIC_API_BASE_URL;
|
||||
@@ -62,14 +63,23 @@ function Dashboard() {
|
||||
|
||||
return (
|
||||
<div className="bg-gray-100 flex flex-col min-h-screen ">
|
||||
{/* Letzte Meldungen */}
|
||||
<div className="flex justify-between items-center mb-4">
|
||||
<h1 className="text-xl font-bold text-gray-700">
|
||||
Letzten 20 Meldungen
|
||||
</h1>
|
||||
<button className="text-red-500 hover:text-red-600">
|
||||
<i className="bi bi-trash"></i>
|
||||
</button>
|
||||
{/* Letzte Meldungen - Titel und Icon Bereich */}
|
||||
<div className="flex justify-between items-center pb-2 w-full lg:w-2/3 mt-8">
|
||||
<div className="flex justify-between gap-1 ">
|
||||
<Icon
|
||||
icon="ri:calendar-schedule-line"
|
||||
className="text-blue-500 text-4xl"
|
||||
/>
|
||||
|
||||
<h1 className="text-xl font-bold text-gray-700">
|
||||
Letzten 20 Meldungen
|
||||
</h1>
|
||||
</div>
|
||||
|
||||
<Icon
|
||||
icon="ph:trash"
|
||||
className="text-red-500 hover:text-red-600 mr-8 text-3xl cursor-pointer"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div className="flex flex-col lg:flex-row gap-8">
|
||||
@@ -143,8 +153,47 @@ function Dashboard() {
|
||||
<Access1Status />
|
||||
<Access2Status />
|
||||
</div>
|
||||
<div className="flex flex-row item-center justify-between">
|
||||
<Kue705_FO />
|
||||
<div className="flex flex-col item-center justify-between gap-1">
|
||||
<div className="flex flex-row item-center justify-between space-y-0">
|
||||
<Kue705_FO slot="1" />
|
||||
<Kue705_FO slot="2" />
|
||||
<Kue705_FO slot="3" />
|
||||
<Kue705_FO slot="4" />
|
||||
<Kue705_FO slot="5" />
|
||||
<Kue705_FO slot="6" />
|
||||
<Kue705_FO slot="7" />
|
||||
<Kue705_FO slot="8" />
|
||||
</div>
|
||||
<div className="flex flex-row item-center justify-between space-y-0">
|
||||
<Kue705_FO slot="9" />
|
||||
<Kue705_FO slot="10" />
|
||||
<Kue705_FO slot="11" />
|
||||
<Kue705_FO slot="12" />
|
||||
<Kue705_FO slot="13" />
|
||||
<Kue705_FO slot="14" />
|
||||
<Kue705_FO slot="15" />
|
||||
<Kue705_FO slot="16" />
|
||||
</div>
|
||||
<div className="flex flex-row item-center justify-between space-y-0">
|
||||
<Kue705_FO slot="17" />
|
||||
<Kue705_FO slot="18" />
|
||||
<Kue705_FO slot="19" />
|
||||
<Kue705_FO slot="20" />
|
||||
<Kue705_FO slot="21" />
|
||||
<Kue705_FO slot="22" />
|
||||
<Kue705_FO slot="23" />
|
||||
<Kue705_FO slot="24" />
|
||||
</div>
|
||||
<div className="flex flex-row item-center justify-between space-y-0">
|
||||
<Kue705_FO slot="25" />
|
||||
<Kue705_FO slot="26" />
|
||||
<Kue705_FO slot="27" />
|
||||
<Kue705_FO slot="28" />
|
||||
<Kue705_FO slot="29" />
|
||||
<Kue705_FO slot="30" />
|
||||
<Kue705_FO slot="31" />
|
||||
<Kue705_FO slot="32" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
Reference in New Issue
Block a user