changed dark mode classes
This commit is contained in:
parent
3b68fef647
commit
3fde0df580
1 changed files with 15 additions and 15 deletions
|
|
@ -30,21 +30,21 @@ export default function SingleAlert({
|
|||
>
|
||||
{type === "error" ? (
|
||||
<div
|
||||
className="flex bg-red-50 rounded-md p-3 mb-2 mx-2"
|
||||
className="flex bg-red-50 dark:bg-red-600/50 rounded-md p-3 mb-2 mx-2"
|
||||
key={dropItem.id}
|
||||
>
|
||||
<div className="flex-shrink-0">
|
||||
<XCircleIcon className="h-5 w-5 text-red-400" aria-hidden="true" />
|
||||
<XCircleIcon className="h-5 w-5 text-red-400 dark:text-red-50" aria-hidden="true" />
|
||||
</div>
|
||||
<div className="ml-3">
|
||||
<h3 className="text-sm font-medium text-red-800">
|
||||
<h3 className="text-sm break-words font-medium text-red-800 dark:text-white/80">
|
||||
{dropItem.title}
|
||||
</h3>
|
||||
{dropItem.list ? (
|
||||
<div className="mt-2 text-sm text-red-700">
|
||||
<div className="mt-2 text-sm text-red-700 dark:text-red-50">
|
||||
<ul className="list-disc space-y-1 pl-5">
|
||||
{dropItem.list.map((item, idx) => (
|
||||
<li key={idx}>{item}</li>
|
||||
<li className="break-words" key={idx}>{item}</li>
|
||||
))}
|
||||
</ul>
|
||||
</div>
|
||||
|
|
@ -62,7 +62,7 @@ export default function SingleAlert({
|
|||
removeAlert(dropItem.id);
|
||||
}, 500);
|
||||
}}
|
||||
className="inline-flex rounded-md bg-red-50 p-1.5 text-red-500"
|
||||
className="inline-flex rounded-md bg-red-50 dark:bg-transparent p-1.5 text-red-500 dark:text-red-50"
|
||||
>
|
||||
<span className="sr-only">Dismiss</span>
|
||||
<XMarkIcon className="h-5 w-5" aria-hidden="true" />
|
||||
|
|
@ -72,22 +72,22 @@ export default function SingleAlert({
|
|||
</div>
|
||||
) : type === "notice" ? (
|
||||
<div
|
||||
className="flex rounded-md bg-blue-50 p-3 mb-2 mx-2"
|
||||
className="flex rounded-md bg-blue-50 dark:bg-blue-600/50 p-3 mb-2 mx-2"
|
||||
key={dropItem.id}
|
||||
>
|
||||
<div className="flex-shrink-0">
|
||||
<InformationCircleIcon
|
||||
className="h-5 w-5 text-blue-400"
|
||||
className="h-5 w-5 text-blue-400 dark:text-blue-50"
|
||||
aria-hidden="true"
|
||||
/>
|
||||
</div>
|
||||
<div className="ml-3 flex-1 md:flex md:justify-between">
|
||||
<p className="text-sm text-blue-700">{dropItem.title}</p>
|
||||
<p className="text-sm text-blue-700 dark:text-white/80">{dropItem.title}</p>
|
||||
<p className="mt-3 text-sm md:mt-0 md:ml-6">
|
||||
{dropItem.link ? (
|
||||
<Link
|
||||
to={dropItem.link}
|
||||
className="whitespace-nowrap font-medium text-blue-700 hover:text-blue-600"
|
||||
className="whitespace-nowrap font-medium text-blue-700 dark:text-blue-50 dark:hover:text-blue-100 hover:text-blue-600"
|
||||
>
|
||||
Details
|
||||
</Link>
|
||||
|
|
@ -106,7 +106,7 @@ export default function SingleAlert({
|
|||
removeAlert(dropItem.id);
|
||||
}, 500);
|
||||
}}
|
||||
className="inline-flex rounded-md bg-blue-50 p-1.5 text-blue-500"
|
||||
className="inline-flex rounded-md bg-blue-50 dark:bg-transparent p-1.5 text-blue-500 dark:text-blue-50"
|
||||
>
|
||||
<span className="sr-only">Dismiss</span>
|
||||
<XMarkIcon className="h-5 w-5" aria-hidden="true" />
|
||||
|
|
@ -116,17 +116,17 @@ export default function SingleAlert({
|
|||
</div>
|
||||
) : (
|
||||
<div
|
||||
className="flex bg-green-50 p-3 mb-2 mx-2 rounded-md"
|
||||
className="flex bg-green-50 dark:bg-green-600/50 p-3 mb-2 mx-2 rounded-md"
|
||||
key={dropItem.id}
|
||||
>
|
||||
<div className="flex-shrink-0">
|
||||
<CheckCircleIcon
|
||||
className="h-5 w-5 text-green-400"
|
||||
className="h-5 w-5 text-green-400 dark:text-green-50"
|
||||
aria-hidden="true"
|
||||
/>
|
||||
</div>
|
||||
<div className="ml-3">
|
||||
<p className="text-sm font-medium text-green-800">
|
||||
<p className="text-sm font-medium text-green-800 dark:bg-white/80">
|
||||
{dropItem.title}
|
||||
</p>
|
||||
</div>
|
||||
|
|
@ -140,7 +140,7 @@ export default function SingleAlert({
|
|||
removeAlert(dropItem.id);
|
||||
}, 500);
|
||||
}}
|
||||
className="inline-flex rounded-md bg-green-50 p-1.5 text-green-500"
|
||||
className="inline-flex rounded-md bg-green-50 dark:bg-transparent p-1.5 text-green-500 dark:text-green-50"
|
||||
>
|
||||
<span className="sr-only">Dismiss</span>
|
||||
<XMarkIcon className="h-5 w-5" aria-hidden="true" />
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue