update theme

smallboot-web/src/components/base/BaseCellItem.vue

@@ -62,7 +62,7 @@ export default {
     }
 
     div.val {
-      color: #fff;
+      // color: #fff;
     }
 
     & {

smallboot-web/src/components/base/BaseNoData.vue

@@ -13,7 +13,7 @@
 
   &.no-data-dark {
     background: $dark_main_color;
-    color: #fff;
+    // color: #fff;
   }
 }
 </style>

smallboot-web/src/layout/components/Navbar.vue

@@ -7,8 +7,7 @@
     <div class="right-menu">
       <el-dropdown class="avatar-container right-menu-item hover-effect" trigger="click">
         <div>
-          <el-avatar src="https://wpimg.wallstcn.com/69a1c46c-eb1c-4b46-8bd4-e9e686ef5251.png" />
-          <!-- <el-avatar /> -->
+          <el-avatar :src="avatarUrl" />
           <div class="user-info">
             <span>{{ nickname }}</span>
             <CaretBottom style="width: 0.6em; height: 0.6em; margin-left: 5px" />
@@ -22,13 +21,10 @@
             </router-link>
             <!-- <router-link to="/system/personal-center">
               <el-dropdown-item>个人中心</el-dropdown-item>
-            </router-link>
+            </router-link> -->
             <a target="_blank" href="https://gitee.com/zhengqingya">
               <el-dropdown-item>Gitee</el-dropdown-item>
             </a>
-            <router-link to="/other/anonymity">
-              <el-dropdown-item>提建议</el-dropdown-item>
-            </router-link> -->
             <el-dropdown-item divided @click="logout"> 退出 </el-dropdown-item>
           </el-dropdown-menu>
         </template>

smallboot-web/src/layout/components/Sidebar/Logo.vue

@@ -48,7 +48,7 @@ const logo = ref('https://wpimg.wallstcn.com/69a1c46c-eb1c-4b46-8bd4-e9e686ef525
   width: 100%;
   height: 50px;
   line-height: 50px;
-  background: #00284c;
+  background: $dark_main_color;
   text-align: center;
   overflow: hidden;
 
@@ -65,7 +65,7 @@ const logo = ref('https://wpimg.wallstcn.com/69a1c46c-eb1c-4b46-8bd4-e9e686ef525
     & .sidebar-title {
       display: inline-block;
       margin: 0;
-      color: #fff;
+      // color: #fff;
       font-weight: 600;
       line-height: 50px;
       font-size: 14px;

smallboot-web/src/layout/components/Sidebar/index.vue

@@ -1,5 +1,5 @@
 <template>
-  <div :class="{ 'has-logo': true }">
+  <div>
     <logo :collapse="isCollapse" />
     <el-scrollbar wrap-class="scrollbar-wrapper">
       <el-menu
@@ -42,3 +42,8 @@ const activeMenu = computed(() => {
   return path
 })
 </script>
+<style lang="scss" scoped>
+.container {
+  background-c: #000;
+}
+</style>

smallboot-web/src/main.ts

@@ -11,11 +11,12 @@ app.use(router)
 import ElementPlus from 'element-plus'
 import 'element-plus/dist/index.css'
 import * as ElementPlusIconsVue from '@element-plus/icons-vue'
+import zhCn from 'element-plus/es/locale/lang/zh-cn'
 // 注册所有图标
 for (const [key, component] of Object.entries(ElementPlusIconsVue)) {
   app.component(key, component)
 }
-app.use(ElementPlus)
+app.use(ElementPlus, { locale: zhCn })
 
 // 自定义样式
 import '@/styles/index.scss'

smallboot-web/src/styles/app-theme.scss

@@ -1,4 +1,12 @@
-$dark_main_color: #021b32;
-$dark_table_th_bgcolor: #00284c;
-$dark_table_td_color: #7189c8;
-$dark_table_border_color: #1d2f5e;
+// 暗黑色主题
+// $dark_main_color: #021b32;
+// $dark_table_th_bgcolor: #00284c;
+// $dark_table_td_color: #7189c8;
+// $dark_table_border_color: #1d2f5e;
+
+
+// 默认浅色主题
+$dark_main_color: #fff;
+$dark_table_th_bgcolor: #fcfcfc;
+$dark_table_td_color: #000; // 左标题颜色
+$dark_table_border_color: #eee2ec; // 边框颜色

smallboot-web/src/styles/index.scss

@@ -1,6 +1,6 @@
 @import './variables.module';
 @import './mixin.scss';
-@import './element-plus-theme';
+// @import './element-plus-theme';
 @import './sidebar.scss';
 @import './app-theme';
 
@@ -12,7 +12,7 @@ body {
   -webkit-font-smoothing: antialiased;
   text-rendering: optimizeLegibility;
   font-family: Helvetica Neue, Helvetica, PingFang SC, Hiragino Sans GB, Microsoft YaHei, Arial, sans-serif;
-  background-color: #021b32;
+  background-color: $dark_main_color;
 }
 
 label {

smallboot-web/src/styles/sidebar.scss

@@ -18,6 +18,9 @@
     left: 0;
     z-index: 1001;
     overflow: hidden;
+    // 周边阴影
+    -webkit-box-shadow: 2px 0 6px rgba(0,21,41,.35);
+    box-shadow: 2px 0 6px rgba(0,21,41,.35);
 
     // reset element-ui css
     .horizontal-collapse-transition {

smallboot-web/src/styles/variables.module.scss

@@ -1,16 +1,25 @@
-// sidebar
-$menuText: #bfcbd9;
-$menuActiveText: #409eff;
-$subMenuActiveText: #f4f4f5;
+// // sidebar
+// $menuText: #bfcbd9;
+// $menuActiveText: #409eff;
+// $subMenuActiveText: #f4f4f5;
+// // 菜单栏背景色
+// $menuBg: #021b32;
+// $menuHover: #263445;
+// $subMenuBg: #00284c;
+// $subMenuHover: $subMenuBg;
 
+// sidebar
+$menuText: rgba(0, 0, 0, 0.7);
+$menuActiveText: #409EFF;
+$subMenuActiveText: rgba(0, 0, 0, 0.7); // 父
 // 菜单栏背景色
-$menuBg: #021b32;
-$menuHover: #263445;
+$menuBg: $dark_main_color;
+$menuHover: #e7f9f9;  // 父
+$subMenuBg: $dark_main_color; // 父
+$subMenuHover: #e7f9f9;
 
-$subMenuBg: #00284c;
-$subMenuHover: $subMenuBg;
 
-$sideBarWidth: 210px;
+$sideBarWidth: 200px;
 
 :export {
   menuText: $menuText;

smallboot-web/src/views/login/index.vue

@@ -212,7 +212,7 @@ onMounted(() => {
 </script>
 
 <style lang="scss">
-$bg: $dark_main_color;
+$bg: #021b32;
 $light_gray: #fff;
 $cursor: #fff;
 
@@ -294,7 +294,7 @@ $cursor: #fff;
 </style>
 
 <style lang="scss" scoped>
-$bg: $dark_main_color;
+$bg: #021b32;
 $dark_gray: #889aa4;
 $light_gray: #eee;
 

smallboot-web/src/views/system/personal-center/index.vue

@@ -95,7 +95,7 @@ export default {
         { key: 2, display_name: '女' },
       ],
       tableOauthDataListQuery: { userId: useStore().user.userId },
-      // oauthUrl: process.env.VUE_APP_BASE_API + '/system/web/api/oauth/',
+      oauthUrl: import.meta.env.VITE_APP_SERVICE_API + '/system/web/api/oauth/',
       // oauthType: this.$route.query.oauthType,
       // openId: this.$route.query.openId,
     }