Toast Position

[anthonyfranc]

Description

I know that we can only position the notification from app.config.ts

export default defineAppConfig({ ui: { notifications: { // Show toasts at the top right of the screen position: 'top-0 bottom-auto' } } })

But it would be nice if we can use a prop inside the notification to position it also.

Additional context

No response

[dietler]

You can do this with :ui=. Example: <UNotifications :ui="{ position: 'bottom-14 right-0' }" />

[anthonyfranc]

You can do this with :ui=. Example: <UNotifications :ui="{ position: 'bottom-14 right-0' }" />

Thanks for that. Unfortunately I am triggering the notification inside the script setup and have the notification component inside app.vue according to instructions.

[dietler]

Yeah, I just moved my tag into the layouts I use. That way the layout that has a bottom action bar I'm trying to avoid can have it's own positioning.

[mrBicool]

any progress on this one? i want to display toast position dynamically from script.

[benjamincanac]

This will be partially done in #1289 but on the global component with a position prop. You won't be able to choose a different position per toast.