refactor(style): rename variables.scss to variables.module.scss

- Update variable file name to use module convention
- Update import statements in index.scss and Vue components
- Adjust .stylelintignore file to reflect new variable file name
- More details see: vuejs/vue-cli#7458

.stylelintignore

@@ -1 +1 @@
-/src/assets/style/variables.scss
+/src/assets/style/variables.module.scss

src/assets/style/index.scss

@@ -1,4 +1,3 @@
 @import "./common";
-@import "./variables";
-@import "./sidebar";
-
+@import "./variables.module";
+@import "./sidebar";

src/assets/style/variables.scss → src/assets/style/variables.module.scss

@@ -21,6 +21,6 @@ $side-bar-width: 210px;
   subMenuHoverColor: $sub-menu-hover-color;
   subMenuActiveText: $sub-menu-active-text-color;
   subMenuBackgroundColor: $sub-menu-background-color;
-  
+
   sideBarWidth: $side-bar-width;
-}
+}

src/layout/components/Sidebar/index.vue

@@ -28,7 +28,7 @@
 import { mapGetters } from 'vuex'
 import SidebarLogo from './components/SidebarLogo'
 import SidebarItem from './components/SidebarItem'
-import variables from '@/assets/style/variables.scss'
+import variables from '@/assets/style/variables.module.scss'
 
 export default {
   name: 'Sidebar',

src/layout/index.vue

@@ -53,7 +53,7 @@ export default {
 </script>
 
 <style lang="scss" scoped>
-@import "@style/variables";
+@import "@style/variables.module";
 
 .app-wrapper {
   position: relative;