Customize toast design
This commit is contained in:
parent
b6093426e1
commit
1c2a5cc569
@ -6,6 +6,9 @@ import { Toaster } from 'sonner';
|
|||||||
export default function ToasterClient() {
|
export default function ToasterClient() {
|
||||||
const { theme } = useTheme();
|
const { theme } = useTheme();
|
||||||
return (
|
return (
|
||||||
<Toaster theme={theme as 'system' | 'light' | 'dark'} />
|
<Toaster
|
||||||
|
theme={theme as 'system' | 'light' | 'dark'}
|
||||||
|
className="!font-mono"
|
||||||
|
/>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
@ -8,6 +8,7 @@ import { cc } from '@/utility/css';
|
|||||||
import { BiCopy } from 'react-icons/bi';
|
import { BiCopy } from 'react-icons/bi';
|
||||||
import { Photo } from '.';
|
import { Photo } from '.';
|
||||||
import { toast } from 'sonner';
|
import { toast } from 'sonner';
|
||||||
|
import { FiCheckSquare } from 'react-icons/fi';
|
||||||
|
|
||||||
export default function PhotoModal({ photo }: { photo: Photo }) {
|
export default function PhotoModal({ photo }: { photo: Photo }) {
|
||||||
const shareUrl = absoluteRouteForPhoto(photo);
|
const shareUrl = absoluteRouteForPhoto(photo);
|
||||||
@ -44,7 +45,10 @@ export default function PhotoModal({ photo }: { photo: Photo }) {
|
|||||||
)}
|
)}
|
||||||
onClick={() => {
|
onClick={() => {
|
||||||
navigator.clipboard.writeText(shareUrl);
|
navigator.clipboard.writeText(shareUrl);
|
||||||
toast.success('Link to photo copied');
|
toast(
|
||||||
|
'Link to photo copied',
|
||||||
|
{ icon: <FiCheckSquare size={16} /> },
|
||||||
|
);
|
||||||
}}
|
}}
|
||||||
>
|
>
|
||||||
<BiCopy size={18} />
|
<BiCopy size={18} />
|
||||||
|
|||||||
@ -4,7 +4,7 @@ import { useTransition } from 'react';
|
|||||||
import { useRouter } from 'next/navigation';
|
import { useRouter } from 'next/navigation';
|
||||||
import { cc } from '@/utility/css';
|
import { cc } from '@/utility/css';
|
||||||
import SiteChecklistRow from './SiteChecklistRow';
|
import SiteChecklistRow from './SiteChecklistRow';
|
||||||
import { FiExternalLink } from 'react-icons/fi';
|
import { FiCheckSquare, FiExternalLink } from 'react-icons/fi';
|
||||||
import { BiCopy, BiRefresh } from 'react-icons/bi';
|
import { BiCopy, BiRefresh } from 'react-icons/bi';
|
||||||
import IconButton from '@/components/LoaderIcon';
|
import IconButton from '@/components/LoaderIcon';
|
||||||
import { toast } from 'sonner';
|
import { toast } from 'sonner';
|
||||||
@ -139,9 +139,12 @@ export default function SiteChecklistClient({
|
|||||||
<IconButton
|
<IconButton
|
||||||
onClick={() => {
|
onClick={() => {
|
||||||
navigator.clipboard.writeText(secret);
|
navigator.clipboard.writeText(secret);
|
||||||
toast.success('Secret copied to clipboard', {
|
toast(
|
||||||
duration: 4000,
|
'Secret copied to clipboard', {
|
||||||
});
|
icon: <FiCheckSquare size={16} />,
|
||||||
|
duration: 4000,
|
||||||
|
},
|
||||||
|
);
|
||||||
}}
|
}}
|
||||||
>
|
>
|
||||||
<BiCopy size={16} />
|
<BiCopy size={16} />
|
||||||
|
|||||||
Loading…
Reference in New Issue
Block a user