wobsoriano/svelte-sonner

A way to customize icon size?

Closed this issue · 1 comments

I'm running into problems where my text is a little bit too big compared to the icon next to it and my icon is too small to be legible. Is there a way I can give my icons a custom size?

You can add a class to a toast:

toast.success('Event has been created', { class: 'my-toast' })

or for all success toasts

<Toaster toastOptions={{ classes: { success: 'my-toast' } }} />

or for all toasts

<Toaster toastOptions={{ class: 'my-toast' }} />

then you can style the svg

.my-toast [data-icon] {
	svg {
        /* style here */
	}
}

Refer to the icon docs if you want to use your custom icon as well.