style: change tab style

src/design/color.less

@@ -1,13 +1,25 @@
+//html {
+//  // header
+//  --header-bg-color: #394664;
+//  --header-bg-hover-color: #273352;
+//  --header-active-menu-bg-color: #273352;
+//
+//  // sider
+//  --sider-dark-bg-color: #273352;
+//  --sider-dark-darken-bg-color: #273352;
+//  --sider-dark-lighten-bg-color: #273352;
+//}
+
 html {
   // header
-  --header-bg-color: #394664;
+  --header-bg-color: #f5f5f5; /* 浅灰背景 */
-  --header-bg-hover-color: #273352;
+  --header-bg-hover-color: #e8e8e8; /* 悬停浅灰色 */
-  --header-active-menu-bg-color: #273352;
+  --header-active-menu-bg-color: #e0e0e0; /* 活动菜单浅灰色 */
 
   // sider
-  --sider-dark-bg-color: #273352;
+  --sider-dark-bg-color: #f8f9fa; /* 侧边栏浅灰白 */
-  --sider-dark-darken-bg-color: #273352;
+  --sider-dark-darken-bg-color: #e9ecef; /* 稍深灰白 */
-  --sider-dark-lighten-bg-color: #273352;
+  --sider-dark-lighten-bg-color: #f8f9fa; /* 保持与基础色一致 */
 }
 
 @font-size-base: 14;

src/design/var/index.less

@@ -5,7 +5,7 @@
 @namespace: xingyuv;
 
 // tabs
-@multiple-height: 30px;
+@multiple-height: 40px;
 
 // headers
 @header-height: 48px;

src/layouts/default/tabs/index.less

@@ -50,54 +50,64 @@
         position: relative;
         z-index: 1;
         height: @multiple-height;
-        padding: 0 6px;
+        padding: 8px 0 8px 8px;
         margin: 0 -14px 0 0 !important;
         line-height: @multiple-height;
-        border-radius: 8px 8px 0 0;
+        border-radius: 0;
         /* stylelint-disable-next-line function-url-quotes */
-        mask: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAANoAAAAkBAMAAAAdqzmBAAAAMFBMVEVHcEwAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAlTPQ5AAAAD3RSTlMAr3DvEM8wgCBA379gj5//tJBPAAAAnUlEQVRIx2NgAAM27fj/tAO/xBsYkIHyf9qCT8iWMf6nNQhAsk2f5rYheY7Dnua2/U+A28ZEe8v+F9Ax2v7/F4DbxkUH2wzgtvHTwbYPo7aN2jZq26hto7aN2jZq25Cy7Qvctnw62PYNbls9HWz7S8/G6//PsI6H4396gAUQy1je08W2jxDbpv6nD4gB2uWp+J9eYPsEhv/0BPS1DQBvoBLVZ3BppgAAAABJRU5ErkJggg==);
+        //mask: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAANoAAAAkBAMAAAAdqzmBAAAAMFBMVEVHcEwAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAlTPQ5AAAAD3RSTlMAr3DvEM8wgCBA379gj5//tJBPAAAAnUlEQVRIx2NgAAM27fj/tAO/xBsYkIHyf9qCT8iWMf6nNQhAsk2f5rYheY7Dnua2/U+A28ZEe8v+F9Ax2v7/F4DbxkUH2wzgtvHTwbYPo7aN2jZq26hto7aN2jZq25Cy7Qvctnw62PYNbls9HWz7S8/G6//PsI6H4396gAUQy1je08W2jxDbpv6nD4gB2uWp+J9eYPsEhv/0BPS1DQBvoBLVZ3BppgAAAABJRU5ErkJggg==);
         transition: padding 0.3s;
-        mask-size: 100% 100%;
+        //mask-size: 100% 100%;
 
         &:hover {
           z-index: 2;
-          padding: 0 12px;
+          //padding: 0 12px;
 
           .ant-tabs-tab-remove .anticon-close {
+            box-sizing: border-box;
             opacity: 1;
 
             &:hover {
-              color: #fff;
+              color: @text-color;
               background-color: #c0c4cc;
+              border: 1px solid gray;
             }
           }
         }
 
         .ant-tabs-tab-remove {
-          top: 4px;
+          display: flex;
-          left: 10px;
+          flex-direction: row;
-          margin-right: -10px;
+          align-items: center;
-          margin-left: 0;
+          justify-content: end;
+          height: 150%;
+          padding: 0 6px;
+          //top: 4px;
+          //left: 10px;
+          //margin-right: -10px;
+          //margin-left: 0;
+          margin: 0;
+          //width: 26px;
 
           .anticon-close {
-            position: relative;
+            //position: relative;
-            width: 14px;
+            display: flex;
-            height: 14px;
+            flex-direction: row;
+            align-items: center;
+            justify-content: end;
+            padding: 1px 4px;
+            margin: 0 auto;
+            //width: 16px;
+            //height: 16px;
             overflow: hidden;
             font-size: 18px;
-            line-height: 10px;
+            border: 1px solid transparent;
-            color: inherit;
+            //line-height: 10px;
-            vertical-align: middle;
+            //color: inherit;
+            //vertical-align: middle;
             border-radius: 100%;
-            opacity: 0;
+            //opacity: 0;
             transition: opacity 0.15s;
-            transform-origin: 100% 50%;
-
-            &:hover {
-              svg {
-                fill: #fff;
-              }
-            }
           }
         }
 
@@ -112,18 +122,19 @@
         }
 
         &:first-child {
-          padding: 0 6px !important;
+          //padding: 0 6px !important;
-        }
+          padding-right: 8px;
-
-        &:active {
-          padding: 0 6px !important;
         }
+        //
+        //&:active {
+        //  padding: 0 6px !important;
+        //}
       }
 
       .ant-tabs-tab-active {
         position: relative;
         z-index: 3;
-        padding: 0 6px;
+        //padding: 0 6px;
         font-weight: inherit;
         background: #004b89;
         border: 0;
@@ -148,7 +159,7 @@
     }
 
     .ant-tabs-nav > div:nth-child(1) {
-      padding: 0 6px;
+      //padding: 0 6px;
 
       .ant-tabs-tab {
         margin-right: 2px !important;

src/settings/projectSetting.ts

@@ -1,5 +1,5 @@
 import { primaryColor } from '../../build/config/themeConfig'
-import { HEADER_PRESET_BG_COLOR_LIST, SIDE_BAR_BG_COLOR_LIST } from './designSetting'
+import { HEADER_PRESET_BG_COLOR_LIST } from './designSetting'
 import type { ProjectConfig } from '@/types/config'
 import { MenuModeEnum, MenuTypeEnum, MixSidebarTriggerEnum, TriggerEnum } from '@/enums/menuEnum'
 import { CacheTypeEnum } from '@/enums/cacheEnum'
@@ -75,7 +75,7 @@ const setting: ProjectConfig = {
   // 菜单配置
   menuSetting: {
     // 背景色
-    bgColor: SIDE_BAR_BG_COLOR_LIST[0],
+    bgColor: '#ffffff',
     // 是否固定住菜单
     fixed: true,
     // 菜单折叠
@@ -111,7 +111,7 @@ const setting: ProjectConfig = {
     // 左侧混合菜单模块切换触发方式
     mixSideTrigger: MixSidebarTriggerEnum.CLICK,
     // 是否固定左侧混合菜单
-    mixSideFixed: false,
+    mixSideFixed: true,
   },
   // 多标签
   multiTabsSetting: {