feat: style Sonner toasts to match glassmorphic app theme
Drop richColors, apply dark glass background with subtle per-type border tints (primary/success, red/error, amber/warning, blue/info). Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
@@ -25,7 +25,23 @@ export function Providers({ children }: { children: React.ReactNode }) {
|
||||
<SWRegistration />
|
||||
{children}
|
||||
</TooltipProvider>
|
||||
<Toaster position="top-right" richColors />
|
||||
<Toaster
|
||||
theme="dark"
|
||||
position="bottom-right"
|
||||
toastOptions={{
|
||||
classNames: {
|
||||
toast:
|
||||
'!bg-[#13131f] !border !border-white/8 !text-white/85 !rounded-xl !shadow-2xl !font-sans',
|
||||
title: '!text-sm !font-medium !text-white/85',
|
||||
description: '!text-xs !text-white/45',
|
||||
icon: '!mt-px',
|
||||
success: '!border-primary/25',
|
||||
error: '!border-red-500/25',
|
||||
warning: '!border-amber-400/25',
|
||||
info: '!border-blue-400/25',
|
||||
},
|
||||
}}
|
||||
/>
|
||||
</QueryClientProvider>
|
||||
);
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user