feat(App): enhance Toaster component with rich colors, close button, and custom toast options
This commit is contained in:
parent
e43ba5dd61
commit
fed75c77df
|
|
@ -234,7 +234,16 @@ function AppPage({ title, onBack }: { title: string; onBack: () => void }) {
|
||||||
return (
|
return (
|
||||||
<WsProvider>
|
<WsProvider>
|
||||||
<div className="size-full flex flex-col bg-neutral-50">
|
<div className="size-full flex flex-col bg-neutral-50">
|
||||||
<Toaster position="bottom-center" offset="calc(4rem + env(safe-area-inset-bottom))" />
|
<Toaster
|
||||||
|
position="bottom-center"
|
||||||
|
offset="calc(4rem + env(safe-area-inset-bottom))"
|
||||||
|
richColors
|
||||||
|
closeButton
|
||||||
|
duration={5000}
|
||||||
|
toastOptions={{
|
||||||
|
style: { fontSize: '0.9rem', fontWeight: 500, padding: '14px 16px' },
|
||||||
|
}}
|
||||||
|
/>
|
||||||
<header className="bg-[#4d4d4d] px-0 py-0 flex-shrink-0" style={{ paddingTop: 'env(safe-area-inset-top)' }}>
|
<header className="bg-[#4d4d4d] px-0 py-0 flex-shrink-0" style={{ paddingTop: 'env(safe-area-inset-top)' }}>
|
||||||
<div className="flex items-stretch justify-between min-h-[56px]">
|
<div className="flex items-stretch justify-between min-h-[56px]">
|
||||||
<button onClick={() => setCurrentPage('status')} className="flex items-center h-full">
|
<button onClick={() => setCurrentPage('status')} className="flex items-center h-full">
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue
Block a user