p-sw/pswui
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

refactor: add separated colors before toast

Browse Source
This commit is contained in:
p-sw 2024-05-26 18:22:00 +09:00
parent 76882978ec
commit d45cbbceb8
1 changed files with 17 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

23
packages/react/components/Toast.tsx
View File

@ -12,15 +12,26 @@ const defaultToastOption: ToastOption = {
closeTimeout: 3000, closeTimeout: 3000,
}; };
const toastColors = {
background: "bg-white dark:bg-black",
borders: {
default: "border-black/10 dark:border-white/20",
error: "border-red-500/50",
success: "border-green-500/50",
warning: "border-yellow-500/50",
loading: "border-black/50 dark:border-white/50 animate-pulse",
},
};
const [toastVariant] = vcn({ const [toastVariant] = vcn({
base: "flex flex-col gap-2 border p-4 rounded-lg pr-8 pointer-events-auto bg-white dark:bg-black relative transition-all duration-150", base: `flex flex-col gap-2 border p-4 rounded-lg pr-8 pointer-events-auto ${toastColors.background} relative transition-all duration-150`,
variants: { variants: {
status: { status: {
default: "border-black/10 dark:border-white/20", default: toastColors.borders.default,
error: "border-red-500/50", error: toastColors.borders.error,
success: "border-green-500/50", success: toastColors.borders.success,
warning: "border-yellow-500/50", warning: toastColors.borders.warning,
loading: "border-black/50 dark:border-white/50 animate-pulse", loading: toastColors.borders.loading,
}, },
life: { life: {
born: "translate-y-1/2 scale-90 ease-out", born: "translate-y-1/2 scale-90 ease-out",