refactor: scss全局变量重命名和样式优化
Former-commit-id: bcfe8165225eec6d4982726ee26720ee57ec38e2
This commit is contained in:
@@ -8,7 +8,7 @@ import { useSettingsStore } from '@/store/modules/settings';
|
||||
import { usePermissionStore } from '@/store/modules/permission';
|
||||
import { useAppStore } from '@/store/modules/app';
|
||||
import { storeToRefs } from 'pinia';
|
||||
import variables from '@/styles/ts-variables.module.scss';
|
||||
import variables from '@/styles/variables.module.scss';
|
||||
|
||||
const settingsStore = useSettingsStore();
|
||||
const permissionStore = usePermissionStore();
|
||||
|
||||
@@ -2,20 +2,18 @@ html,
|
||||
body,
|
||||
#app {
|
||||
height: 100%;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
a{
|
||||
text-decoration:none
|
||||
}
|
||||
|
||||
// 隐藏元素光标
|
||||
label,span, p,li,img,a{
|
||||
caret-color: transparent;
|
||||
}
|
||||
|
||||
svg {
|
||||
vertical-align: -0.15em; //因icon大小被设置为和字体大小一致,而span等标签的下边缘会和字体的基线对齐,故需设置一个往下的偏移比例,来纠正视觉上的未对齐效果
|
||||
}
|
||||
|
||||
img,svg{
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
// main-container global css
|
||||
.app-container {
|
||||
|
||||
@@ -1,5 +1,4 @@
|
||||
@import './sidebar.scss';
|
||||
@import './tailwind.scss';
|
||||
@import './global.scss';
|
||||
@import './dark.scss';
|
||||
|
||||
@@ -18,7 +17,7 @@
|
||||
|
||||
html.dark{
|
||||
--menuBg:var(--el-bg-color-overlay);
|
||||
--menuText:var(----el-menu-text-color);
|
||||
--menuText:#fff;
|
||||
--menuActiveText:var(--el-menu-active-color);
|
||||
--menuHover:rgba(0,0,0,.2);
|
||||
|
||||
|
||||
@@ -1,4 +0,0 @@
|
||||
|
||||
@tailwind base;
|
||||
@tailwind components;
|
||||
@tailwind utilities;
|
||||
@@ -1,6 +0,0 @@
|
||||
// 导出 variables.module.scss 变量提供给TypeScript使用
|
||||
:export {
|
||||
menuBg: $menuBg;
|
||||
menuText: $menuText;
|
||||
menuActiveText: $menuActiveText
|
||||
}
|
||||
@@ -1,11 +1,6 @@
|
||||
// 全局SCSS变量
|
||||
$menuBg: var(--menuBg);
|
||||
$menuText: var(--menuText);
|
||||
$menuActiveText: var(--menuActiveText);
|
||||
$menuHover: var(--menuHover);
|
||||
|
||||
$subMenuBg:var(--subMenuBg);
|
||||
$subMenuActiveText:var(--subMenuActiveText);
|
||||
$subMenuHover:var(--subMenuHover);
|
||||
|
||||
$sideBarWidth: 210px;
|
||||
// 导出 variables.module.scss 变量提供给TypeScript使用
|
||||
:export {
|
||||
menuBg: $menuBg;
|
||||
menuText: $menuText;
|
||||
menuActiveText: $menuActiveText
|
||||
}
|
||||
11
src/styles/variables.scss
Normal file
11
src/styles/variables.scss
Normal file
@@ -0,0 +1,11 @@
|
||||
// 全局SCSS变量
|
||||
$menuBg: var(--menuBg);
|
||||
$menuText: var(--menuText);
|
||||
$menuActiveText: var(--menuActiveText);
|
||||
$menuHover: var(--menuHover);
|
||||
|
||||
$subMenuBg:var(--subMenuBg);
|
||||
$subMenuActiveText:var(--subMenuActiveText);
|
||||
$subMenuHover:var(--subMenuHover);
|
||||
|
||||
$sideBarWidth: 210px;
|
||||
Reference in New Issue
Block a user