CyberNika / v-contextmenu

🖱 ContextMenu based on Vue 3 & Vue 2
https://cybernika.github.io/v-contextmenu/
MIT License
918 stars 112 forks source link

Cannot override the v-contextmenu class style #112

Closed crystalfp closed 7 months ago

crystalfp commented 2 years ago

I want to change the context menu background to black. But if I define in my application

.v-contextmenu {
  background-color: black;
}

The color does not change, even adding !important. Instead, changing .v-contextmenu-item has no problem. The only solution I have found is to make a copy of node_modules/v-contextmenu/dist/themes/dark.css, modify .v-contextmenu and load it instead of one of the official styles from main.ts. One problem with this solution is, besides having to align with new versions of the plugin, that my application colors are defined as SCSS variables and here I have to hardcode them. Thanks for considering! mario

crystalfp commented 2 years ago

Don't understand. Sometimes works if I define the styles globally, sometimes not. Could depend of the Vue compilation order, maybe. Till now, the only solution that works is to load a modified theme file before the Vue.use(contextmenu) call.