[Vuejs]-Change properties in subclasses

by

0👍

Have you tried the following?

.v-btn--active > .v-btn__overlay, .v-btn[aria-haspopup=menu][aria-expanded=true] > .v-btn__overlay, .v-btn__overlay {
    opacity: 1 !important;
}

This should work, because the .v-btn__overlay is overridden by its declaration on its own.

To address the class within the upper contaning class:

.buttons .v-btn__overlay{
    opacity: 1 !important;
}

The CSS should work. For further investigation, take a look at this question: Scoped CSS not being applied within the component

For some reason, scoped styles don’t get applied during hot reload when they are first added to the component. Full page reload fixes the issue, from there the styles, since they have been detected, get updated with consecutive hot reloads.

Leave a comment