|
|
@ -1,6 +1,7 @@ |
|
|
"use client"; |
|
|
"use client"; |
|
|
|
|
|
|
|
|
import { useEffect, useState } from "react"; |
|
|
import { useEffect, useState } from "react"; |
|
|
|
|
|
import { createPortal } from "react-dom"; |
|
|
import { Ic } from "@/icons"; |
|
|
import { Ic } from "@/icons"; |
|
|
|
|
|
|
|
|
type ErrorToastProps = { |
|
|
type ErrorToastProps = { |
|
|
@ -48,7 +49,9 @@ export default function ErrorToast({ |
|
|
} |
|
|
} |
|
|
}; |
|
|
}; |
|
|
|
|
|
|
|
|
return ( |
|
|
|
|
|
|
|
|
if (typeof document === "undefined") return null; |
|
|
|
|
|
|
|
|
|
|
|
return createPortal( |
|
|
<div |
|
|
<div |
|
|
className={[ |
|
|
className={[ |
|
|
"fixed top-3.5 left-1/2 z-[70] flex w-[calc(100%-32px)] max-w-[360px] -translate-x-1/2 items-start justify-between gap-3 rounded-[16px] bg-[#141414]/95 p-3.5 px-4 text-white shadow-[0_10px_30px_rgba(0,0,0,0.35)] backdrop-blur-md border border-white/5 border-t-[2.5px] transition-all duration-300 ease-out", |
|
|
"fixed top-3.5 left-1/2 z-[70] flex w-[calc(100%-32px)] max-w-[360px] -translate-x-1/2 items-start justify-between gap-3 rounded-[16px] bg-[#141414]/95 p-3.5 px-4 text-white shadow-[0_10px_30px_rgba(0,0,0,0.35)] backdrop-blur-md border border-white/5 border-t-[2.5px] transition-all duration-300 ease-out", |
|
|
@ -83,7 +86,8 @@ export default function ErrorToast({ |
|
|
> |
|
|
> |
|
|
<Ic name="close" className="size-5" /> |
|
|
<Ic name="close" className="size-5" /> |
|
|
</button> |
|
|
</button> |
|
|
</div> |
|
|
|
|
|
|
|
|
</div>, |
|
|
|
|
|
document.body, |
|
|
); |
|
|
); |
|
|
} |
|
|
} |
|
|
|
|
|
|