chore: update style

vben
1 parent 1e5fcd2c
Showing 13 changed files with 16 additions and 14 deletions
build/config/lessModifyVars.ts
index.html
src/components/Basic/src/BasicArrow.vue
src/components/Basic/src/BasicHelp.vue
src/components/Basic/src/BasicTitle.vue
src/components/Drawer/src/BasicDrawer.vue
src/components/Modal/src/index.less
src/components/Page/src/PageWrapper.vue
src/design/color.less
src/layouts/default/header/MultipleHeader.vue
src/layouts/default/index.vue
src/settings/colorSetting.ts
src/settings/projectSetting.ts
@@ -17,12 +17,12 @@ const modifyVars = {
   // 'heading-color': '#2C3A61', //  Title color
   // 'text-color': '#2C3A61', //  Main text color
   'text-color-secondary ': '#606266', // Subtext color
-  'background-color-base': '#F0F2F5', // background color
+  'background-color-base': '#f4f7f9', // background color
   'font-size-base': '14px', //  Main font size
   'box-shadow-base': '0 2px 8px rgba(0, 0, 0, 0.15)', //  Floating shadow
   'border-color-base': '#F0F0F0', //  Border color,
   'border-color-split': '#F0F0F0', //  Border color,
-  'border-radius-base': '2px', //  Component/float fillet
+  'border-radius-base': '4px', //  Component/float fillet
 };
 //}
  
@@ -24,7 +24,7 @@
           justify-content: center;
           align-items: center;
           flex-direction: column;
-          background: #f0f2f5;
+          background: #f4f7f9;
         }
  
         .app-loading .app-loading-wrap {
@@ -15,7 +15,6 @@
  
   export default defineComponent({
     name: 'BasicArrow',
-    inheritAttrs: false,
     components: { RightOutlined },
     props: {
       // Expand contract, expand by default
@@ -12,7 +12,6 @@
   import { useDesign } from '/@/hooks/web/useDesign';
   export default defineComponent({
     name: 'BasicHelp',
-    inheritAttrs: false,
     components: { Tooltip },
     props: {
       // max-width
@@ -15,7 +15,6 @@
  
   export default defineComponent({
     name: 'BasicTitle',
-    inheritAttrs: false,
     components: { BasicHelp },
     props: {
       helpMessage: {
@@ -219,7 +219,7 @@
     .ant-drawer-body {
       height: calc(100% - @header-height);
       padding: 0;
-      background-color: @background-color-dark;
+      background-color: #fff;
  
       .scrollbar__wrap {
         padding: 16px !important;
@@ -79,7 +79,7 @@
  
   &-confirm-body {
     .ant-modal-confirm-content {
-      color: @text-color-help-dark;
+      color: #fff;
  
       > * {
         color: @text-color-help-dark;
@@ -132,7 +132,7 @@
     position: relative;
  
     .ant-page-header {
-      padding: 12px 16px;
+      // padding: 12px 16px;
  
       &:empty {
         padding: 0;
@@ -14,7 +14,8 @@
  
 @white: #fff;
  
-@content-bg: #f0f2f5;
+@content-bg: #f4f7f9;
+// @content-bg: #f0f2f5;
  
 @info-color: @primary-color;
  
@@ -60,7 +61,7 @@
 // =================================
  
 // dark
-@background-color-dark: #f0f2f5;
+@background-color-dark: #f4f7f9;
 // light
 @background-color-light: #f5f7fa;
 // layout content background
@@ -113,7 +113,7 @@
   @prefix-cls: ~'@{namespace}-layout-multiple-header';
  
   .@{prefix-cls} {
-    margin-left: 1px;
+    // margin-left: 1px;
     transition: width 0.2s;
     flex: 0 0 auto;
  
@@ -83,5 +83,9 @@
     > .ant-layout {
       min-height: 100%;
     }
+
+    &__main {
+      margin-left: 1px;
+    }
   }
 </style>
@@ -16,11 +16,11 @@ export const HEADER_PRESET_BG_COLOR_LIST: string[] = [
  
 // sider preset color
 export const SIDE_BAR_BG_COLOR_LIST: string[] = [
+  '#001529',
   '#273352',
   '#ffffff',
   '#191b24',
   '#191a23',
-  '#001529',
   '#304156',
   '#001628',
   '#28333E',
@@ -76,7 +76,7 @@ const setting: ProjectConfig = {
   // Menu configuration
   menuSetting: {
     // sidebar menu bg color
-    bgColor: '#273352',
+    bgColor: '#001529',
     //  Whether to fix the left menu
     fixed: true,
     // Menu collapse