I am looking to implement a feature where the style can be changed upon clicking a button.
In my scenario, I am using Sass/SCSS for styling.
For example, I have three different styles: default.scss, dark.scss, and system.scss. The code for dark.scss looks like this:
// Mode
$mode: dark;
// Initialize
@import "init";
// Components
@import "./core/components/components";
@import "components/components";
// Layout
@import "layout/layout";
@import "./core/layout/docs/layout";
And in app.vue:
<style lang="scss">
@import "assets/sass/dark";
</style>
In my test.vue file, I have created buttons to switch between styles:
<v-btn @click="light" />
<v-btn @click="dark" />
Is it possible to change the style with a button click? How can I achieve this, for instance, changing @import "assets/sass/dark"; to @import "assets/sass/light"; from the file app.vue?