idanoo/autobrr
1
0
Fork 0
mirror of https://github.com/idanoo/autobrr synced 2025-07-25 09:49:13 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

feat: dark mode (#32)

Browse source
This commit is contained in:
Ludvig Lundgren 2021-09-26 16:52:37 +02:00 • committed by GitHub
parent 974ca95d80
commit 66048c5533
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
49 changed files with 1736 additions and 1992 deletions
Download patch file Download diff file Expand all files Collapse all files

13
web/src/components/notifications/Toast.tsx
View file

@ -1,6 +1,7 @@
import { FC } from 'react'
import { XIcon, CheckCircleIcon, ExclamationIcon, ExclamationCircleIcon } from '@heroicons/react/solid'
import { toast } from 'react-hot-toast'
import { classNames } from '../../styles/utils'
type Props = {
type: 'error' | 'success' | 'warning'
@ -14,9 +15,9 @@ const Toast: FC<Props> = ({
t
}) => {
return (
<div className={`${
t.visible ? 'animate-enter' : 'animate-leave'
} max-w-sm w-full bg-white shadow-lg rounded-lg pointer-events-auto ring-1 ring-black ring-opacity-5 overflow-hidden transition-all`}>
<div className={classNames(
t.visible ? 'animate-enter' : 'animate-leave',
"max-w-sm w-full bg-white dark:bg-gray-800 shadow-lg rounded-lg pointer-events-auto ring-1 ring-black ring-opacity-5 overflow-hidden transition-all")}>
<div className="p-4">
<div className="flex items-start">
<div className="flex-shrink-0">
@ -25,16 +26,16 @@ const Toast: FC<Props> = ({
{type === 'warning' && <ExclamationIcon className="h-6 w-6 text-yellow-400" aria-hidden="true" />}
</div>
<div className="ml-3 w-0 flex-1 pt-0.5">
<p className="text-sm font-medium text-gray-900">
<p className="text-sm font-medium text-gray-900 dark:text-gray-200">
{type === 'success' && "Success"}
{type === 'error' && "Error"}
{type === 'warning' && "Warning"}
</p>
<p className="mt-1 text-sm text-gray-500">{body}</p>
<p className="mt-1 text-sm text-gray-500 dark:text-gray-400">{body}</p>
</div>
<div className="ml-4 flex-shrink-0 flex">
<button
className="bg-white rounded-md inline-flex text-gray-400 hover:text-gray-500 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-indigo-500"
className="bg-white dark:bg-gray-700 rounded-md inline-flex text-gray-400 hover:text-gray-500 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-indigo-500 dark:focus:ring-blue-500"
onClick={() => {
toast.dismiss(t.id)
}}