acidjazz / tv-toast

Programmatic toasts for Nuxt.js powered by Tailwind CSS
MIT License
116 stars 11 forks source link

containerClasses: override the defaults? #16

Open dloused opened 3 years ago

dloused commented 3 years ago
{
  modules: [
    [ 'nuxt-tailvue', { all: true, toast: { defaults: { containerClasses: [ 'mt-12' ] } } } ],
  ]
}

As per example, container classes only extend the default class? Is it possible to override the defaults ('z-40', 'fixed', 'inset-0', 'flex', 'flex-col-reverse', 'items-end', 'justify-center', 'px-4', 'py-6', 'pointer-events-none', 'sm:p-6', 'sm:items-end', 'sm:justify-end') in the module params?

acidjazz commented 3 years ago

@dloused have you tried doing this by just adding classes that cancel the default ones out?

dloused commented 3 years ago

Yes i tried that, for eg. i want the toast at the bottom. By adding sm:justify-start, the class output is "sm:justify-end sm:justify-start", with the 1st taking precedence

acidjazz commented 3 years ago

@dloused I thought css classes later in the order took precedence?

dloused commented 3 years ago

https://github.com/tailwindlabs/tailwindcss/issues/1010#issuecomment-508988518

Screenshot 2021-02-24 at 17 49 56

Maybe object positioning should not be hardcoded and passed in the module defaults? A thought...

acidjazz commented 3 years ago

@dloused I see your point, well maybe we can do an override: that you can use instead and start with a clean slate?

dloused commented 3 years ago

That would be a good option.!

acidjazz commented 3 years ago

@dloused i added to my open source TODO, feel free to send a PR if you want it sooner!