chore: fix design

This commit is contained in:
kawamataryo 2024-12-09 13:16:23 +09:00
parent 6fb898a44c
commit 27d78ba716

View File

@ -15,12 +15,13 @@ const DonationCard = () => {
}, },
false, false,
); );
const handleClose = () => { const handleClose = () => {
setUserClosed(true);
setIsVisible(false); setIsVisible(false);
}; };
const handleDonationLinkClick = () => { const handleDonationLinkClick = () => {
handleClose(); setUserClosed(true);
setIsVisible(false);
window.open("https://ko-fi.com/kawamataryo", "_blank"); window.open("https://ko-fi.com/kawamataryo", "_blank");
}; };
@ -31,7 +32,7 @@ const DonationCard = () => {
if (userClosed) return; if (userClosed) return;
setIsVisible(true); setIsVisible(true);
}; };
const timeoutId = setTimeout(showDonationCard, 2000); const timeoutId = setTimeout(showDonationCard, 4000);
return () => clearTimeout(timeoutId); return () => clearTimeout(timeoutId);
}, [userClosed]); }, [userClosed]);
@ -40,16 +41,17 @@ const DonationCard = () => {
<AnimatePresence> <AnimatePresence>
{isVisible && ( {isVisible && (
<motion.div <motion.div
className="card bg-neutral text-neutral-content shadow-lg w-96 relative" className="card bg-neutral text-neutral-content shadow-lg w-[426px] relative"
initial={{ y: "100%", opacity: 0 }} initial={{ y: "100%", opacity: 0 }}
animate={{ y: 0, opacity: 1 }} animate={{ y: 0, opacity: 1 }}
exit={{ y: "100%", opacity: 0 }} exit={{ y: "100%", opacity: 0 }}
transition={{ type: "spring", stiffness: 50, damping: 10 }} transition={{ type: "spring", stiffness: 50, damping: 10 }}
> >
<div className="card-body p-4"> <div className="card-body p-4">
<div className="flex gap-2 items-center"> {/* biome-ignore lint/a11y/useKeyWithClickEvents: <explanation> */}
<div className="flex gap-2 items-center" onClick={handleClose}>
<p <p
className="text-xs" className="text-sm"
// biome-ignore lint/security/noDangerouslySetInnerHtml: <explanation> // biome-ignore lint/security/noDangerouslySetInnerHtml: <explanation>
dangerouslySetInnerHTML={{ dangerouslySetInnerHTML={{
__html: getMessageWithLink("donate_message"), __html: getMessageWithLink("donate_message"),