fix: 修复管理端运行时主题初始化 (#34)

admin-ui/src/layout/components/Sidebar/Logo.vue

@@ -15,7 +15,7 @@
 
 <script>
 
-import variables from '@/styles/variables.scss'
+import variables from '@/styles/runtime-variables'
 import { mapGetters } from 'vuex'
 
 export default {

admin-ui/src/layout/components/Sidebar/index.vue

@@ -29,7 +29,7 @@
 import { mapGetters } from 'vuex'
 import Logo from './Logo'
 import SidebarItem from './SidebarItem'
-import variables from '@/styles/variables.scss'
+import variables from '@/styles/runtime-variables'
 
 export default {
   components: { SidebarItem, Logo },

admin-ui/src/layout/index.vue

@@ -20,7 +20,7 @@ import RightPanel from '@/components/RightPanel'
 import { AppMain, Navbar, Settings, Sidebar, TagsView } from './components'
 import ResizeMixin from './mixin/ResizeHandler'
 import { mapState } from 'vuex'
-import variables from '@/styles/variables.scss'
+import variables from '@/styles/runtime-variables'
 
 export default {
   name: 'MainLayout',

admin-ui/src/store/modules/settings.js

@@ -1,4 +1,4 @@
-import variables from '@/styles/element-variables.scss'
+import variables from '@/styles/runtime-variables'
 import defaultSettings from '@/settings'
 
 const { showSettings, topNav, tagsView, fixedHeader, sidebarLogo, themeStyle } = defaultSettings

admin-ui/src/styles/runtime-variables.js

@@ -0,0 +1,14 @@
+export default {
+  theme: '#1890ff',
+  menuActiveText: '#1677ff',
+  subMenuActiveText: '#69b1ff',
+  menuBg: '#001529',
+  menuHover: '#000c17',
+  menuLightBg: '#ffffff',
+  menuLightHover: '#e6f4ff',
+  subMenuBg: '#000c17',
+  subMenuHover: '#001528',
+  sideBarWidth: '210px',
+  sidebarTitle: '#ffffff',
+  sidebarLightTitle: '#001d66'
+}

admin-ui/tests/unit/styles/runtime-variables.spec.js

@@ -0,0 +1,12 @@
+import variables from '@/styles/runtime-variables'
+
+describe('runtime style variables', () => {
+  it('keeps the JavaScript theme values aligned with the current SCSS theme', () => {
+    expect(variables).toMatchObject({
+      theme: '#1890ff',
+      menuBg: '#001529',
+      menuLightBg: '#ffffff',
+      sideBarWidth: '210px'
+    })
+  })
+})