External/CoreControl
1
0
Fork 0
mirror of https://github.com/crocofied/CoreControl.git synced 2025-12-17 15:36:50 +00:00
Code Issues Packages Projects Releases Wiki Activity

TestNotification Styling Update

Browse Source
This commit is contained in:
headlesdev 2025-05-25 21:13:35 +02:00
parent 3d982bf1ac
commit 78f1d54fc3
1 changed files with 33 additions and 10 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

43
components/dialogues/TestNotification.tsx
View File

@ -1,21 +1,44 @@
import { Bell } from "lucide-react"
import { Bell, CheckCircle2, Clock } from "lucide-react"
export default function TestNotification() {
return (
<div>
<dialog id="test_notification" className="modal">
<div className="modal-box w-11/12 max-w-3xl border-l-4 border-success">
<div className="flex items-center gap-3 mb-3">
<div className="bg-success text-success-content rounded-full p-2 flex items-center justify-center">
<Bell className="h-6 w-6" />
<div className="modal-box w-11/12 max-w-3xl border-l-4 border-success bg-base-100 shadow-xl">
<div className="flex items-center gap-4 mb-6">
<div className="bg-success/10 text-success rounded-full p-3 flex items-center justify-center">
<Bell className="h-7 w-7" />
</div>
<div>
<h3 className="font-bold text-2xl">Test Notification</h3>
<p className="text-sm text-base-content/70">Verify your notification settings</p>
</div>
<h3 className="font-bold text-xl">Test Notification</h3>
</div>
<div className="bg-base-200 p-4 rounded-lg mb-4">
<p>
This will send a test notification to the selected notification provider.
</p>
<div className="bg-base-200/50 p-6 rounded-xl mb-6">
<div className="space-y-4">
<p className="text-base-content/90">
A notification test has been sent to the selected notification provider.
</p>
<p className="text-sm text-base-content/70">
You can click the button below to check the status of the notification test.
</p>
<div className="flex items-center gap-3 mt-6">
<button className="btn btn-success gap-2">
<Clock className="h-4 w-4" />
Check Status
</button>
<div className="flex items-center gap-2 px-4 py-2 bg-base-300 rounded-lg">
<span className="text-sm font-medium">Status:</span>
<div className="flex items-center gap-1.5 text-warning">
<Clock className="h-4 w-4" />
<span className="text-sm">Pending</span>
</div>
</div>
</div>
</div>
</div>
</div>
</dialog>