From f801f4fb11ff8ca08417a9ddf0231fb570fa26e3 Mon Sep 17 00:00:00 2001 From: 疯狂的狮子Li <15040126243@163.com> Date: 星期一, 24 七月 2023 16:47:51 +0800 Subject: [PATCH] fix 修复 固定页面header穿模问题 --- src/assets/styles/variables.module.scss | 90 +++++++++++++++++++++++++++++--------------- 1 files changed, 59 insertions(+), 31 deletions(-) diff --git a/src/assets/styles/variables.module.scss b/src/assets/styles/variables.module.scss index 3dbfaa7..d07d3d4 100644 --- a/src/assets/styles/variables.module.scss +++ b/src/assets/styles/variables.module.scss @@ -1,45 +1,73 @@ +// 鍏ㄥ眬SCSS鍙橀噺 +:root { + --menuBg: #304156; + --menuColor: #bfcbd9; + --menuActiveText: #f4f4f5; + --menuHover: #263445; + + --subMenuBg: #1f2d3d; + --subMenuActiveText: #f4f4f5; + --subMenuHover: #001528; + --subMenuTitleHover: #293444; + + --fixedHeaderBg: #ffffff; + --tableHeaderBg: #f8f8f9; + --tableHeaderTextColor: #515a6e; +} +html.dark { + --menuBg: #1d1e1f; + --menuColor: #bfcbd9; + --menuActiveText: #f4f4f5; + --menuHover: #171819; + + --subMenuBg: #1d1e1f; + --subMenuActiveText: #1d1e1f; + --subMenuHover: #171819; + --subMenuTitleHover: #171819; + + --fixedHeaderBg: #171819; + --tableHeaderBg: var(--el-bg-color); + --tableHeaderTextColor: var(--el-text-color); + + // 瑕嗙洊ele 楂樹寒褰撳墠琛岀殑鏍囧噯鏆楄壊 + .el-tree-node__content { + --el-color-primary-light-9: #262727; + } +} + // base color $blue: #324157; -$light-blue: #3A71A8; -$red: #C03639; -$pink: #E65D6E; -$green: #30B08F; -$tiffany: #4AB7BD; -$yellow: #FEC171; -$panGreen: #30B08F; +$light-blue: #3a71a8; +$red: #c03639; +$pink: #e65d6e; +$green: #30b08f; +$tiffany: #4ab7bd; +$yellow: #fec171; +$panGreen: #30b08f; // 榛樿鑿滃崟涓婚椋庢牸 -$base-menu-color: #bfcbd9; -$base-menu-color-active: #f4f4f5; -$base-menu-background: #304156; +$base-menu-color: var(--menuColor); +$base-menu-hover: var(--menuHover); +$base-menu-color-active: var(--menuActiveText); +$base-menu-background: var(--menuBg); $base-logo-title-color: #ffffff; $base-menu-light-color: rgba(0, 0, 0, 0.7); $base-menu-light-background: #ffffff; $base-logo-light-title-color: #001529; -$base-sub-menu-background: #1f2d3d; -$base-sub-menu-hover: #001528; +$base-sub-menu-background: var(--subMenuBg); +$base-sub-menu-hover: var(--subMenuHover); +$base-sub-menu-title-hover: var(--subMenuTitleHover); +// 琛ㄥ崟澶磋儗鏅壊鍜屾爣棰橀鑹� +$fixed-header-bg: var(--fixedHeaderBg); +$table-header-bg: var(--tableHeaderBg); +$table-header-text-color: var(--tableHeaderTextColor); -// 鑷畾涔夋殫鑹茶彍鍗曢鏍� -/** -$base-menu-color:hsla(0,0%,100%,.65); -$base-menu-color-active:#fff; -$base-menu-background:#001529; -$base-logo-title-color: #ffffff; - -$base-menu-light-color:rgba(0,0,0,.70); -$base-menu-light-background:#ffffff; -$base-logo-light-title-color: #001529; - -$base-sub-menu-background:#000c17; -$base-sub-menu-hover:#001528; -*/ - -$--color-primary: #409EFF; -$--color-success: #67C23A; -$--color-warning: #E6A23C; -$--color-danger: #F56C6C; +$--color-primary: #409eff; +$--color-success: #67c23a; +$--color-warning: #e6a23c; +$--color-danger: #f56c6c; $--color-info: #909399; $base-sidebar-width: 200px; -- Gitblit v1.9.3