How to set custom styles for the button?

[Rahulgans]

.vue-js-switch{

     position: absolute;
     top:40%;
     z-index:1;
}

.vue-js-switch .v-switch-core{
    background-color: #2980b9!important;
}

.vue-js-switch .v-switch-button {
   border-radius: 0px!important;
}

Only the vue-js-switch class worked. Even after using !important, there seems to be no change.

[euvl]

i assume you have tried with child combinator .vue-js-switch > .v-switch-core?

Also the easiest way would be just to open an inspector and copy-paste class directly from the component.

[tb-b]

Same here. v-switch-input works, nested elements cannot be targeted via <style> block (inline works).

[Rahulgans]

@tombalev. If you are using single file component, try writing the custom styles under a separate <style> rather than the component's scoped style. Haven't tried it for this plugin, but worked for me in other Vue components