search

eolant / vuetify-toast-snackbar

Basic Vue toast service that uses Vuetify Snackbar component.
MIT License
128 stars 36 forks source link

Append the snackbar to the Vuetify application wrapper #15

Closed lorro closed 5 years ago

lorro commented 5 years ago

Vuetify has released version 2.0 and they have changed how the global styled are scoped. All the global colors (warning, success, info, error, ...) are scoped under .v-application and not under the root selector anymore.

Because your plugin appends the snackbar to the body directly and not to the Vuetify application wrapper, all the snackbars will stay black. I changed that one line of code so the snackbar will get appended to the application wrapper.

In Vue1 to .application In Vue2 to .v-application

eolant commented 5 years ago

@lorro thanks for your pull request, I appreciate it, but I disagree that it should be appended to application container plus there is class passed to v-snackbar component application vts__snackbar now updated to v-application vts__snackbar. Please update to v0.4.0

lorro commented 5 years ago

Hi,

Indeed, you can also do it that way. But could you explain a bit why you actually don't agree with appending it to the Vuetify v-application class? As it's a part of the application I would think it makes sense it's part of the main v-application class Vuetify provides for the app.

What you're actually doing right now is creating a second v-application element in the DOM. Isn't it more logical and meant by Vuetify to have just one v-application node in the DOM for the application?

eolant commented 5 years ago

@lorro I don't see anything wrong with multiple v-application as well as you can mount multiple vue applications on a single page as widgets, it's not always single page application. For the same reason it's not always v-application will take over the whole screen and it will look funky if you try to attach the component to it.