/** 全局SCSS变量 */ :root { --menu-background: #304156; --menu-text: #bfcbd9; --menu-active-text: var(--el-menu-active-color); --menu-hover: #263445; --sidebar-logo-background: #2d3748; --hj-red-3: #ff4d4d; --hj-orange-3: #fa8c16; --hj-yellow-3: #fadb14; --hj-green-3: #a0d911; --hj-cyan-3: #00b96b; --hj-blue-3: #096dd9; --hj-purple-3: #531dab; --hj-white-3: #d9d9d9; --hj-red-2: #ff7a7a; --hj-orange-2: #faa31a; --hj-yellow-2: #ffe518; --hj-green-2: #b2e440; --hj-cyan-2: #00d87a; --hj-blue-2: #0a85d8; --hj-purple-2: #622ebc; --hj-red-1: #ffb2b2; --hj-orange-1: #fbad58; --hj-yellow-1: #fff168; --hj-green-1: #c8e677; --hj-cyan-1: #00ec9a; --hj-blue-1: #1098d8; --hj-purple-1: #7339b8; --hj-white-1: #ffffff; --hj-white-2: #f0f0f0; --hj-white-4: #696969; --hj-black-1: #1a1a1a; --hj-black-2: #303030; --hj-black-3: #404040; --hj-black-4::#505050 --hj-bg: #fff; //字体颜色 --fc-color-default: #000000; --fc-color-1: #00000090; --fc-color-2: #00000060; --fc-color-3: #AFB9D0; --fc-color-4: #A6ABB1; --fc-color-5: #333333; --fc-color-6: #666666; --fc-color-7: #3b7cff; --gray-bg-1: #F1F3F5; --hj-fs-12: 12px; --hj-fs-14: 14px; --hj-fs-16: 16px; --hj-fs-18: 18px; --hj-fs-20: 20px; --hj-fs-22: 22px; --hj-fs-24: 24px; --hj-fs-26: 26px; --hj-fs-28: 28px; --hj-fs-30: 30px; --hj-fs-32: 32px; --hj-fs-34: 34px; --hj-fs-36: 36px; --hj-fs-38: 38px; } $menu-background: var(--menu-background); // 菜单背景色 $menu-text: var(--menu-text); // 菜单文字颜色 $menu-active-text: var(--menu-active-text); // 菜单激活文字颜色 $menu-hover: var(--menu-hover); // 菜单悬停背景色 $sidebar-logo-background: var(--sidebar-logo-background); // 侧边栏 Logo 背景色 $sidebar-width: 210px; // 侧边栏宽度 $sidebar-width-collapsed: 54px; // 侧边栏收缩宽度 $navbar-height: 50px; // 导航栏高度 $tags-view-height: 34px; // TagsView 高度 $main-header-height: 48px; // 主页面上面的header的高度 //二级页面上面的header的高度 $child-header-height: 116px; $hj-bg: var(--hj-bg); $hj-red-1: var(--hj-red-1); $hj-orange-1: var(--hj-orange-1); $hj-yellow-1: var(--hj-yellow-1); $hj-green-1: var(--hj-green-1); $hj-cyan-1: var(--hj-cyan-1); $hj-blue-1: var(--hj-blue-1); $hj-purple-1: var(--hj-purple-1); $hj-white-1: var(--hj-white-1); $hj-black-1: var(--hj-black-1); $hj-red-2: var(--hj-red-2); $hj-orange-2: var(--hj-orange-2); $hj-yellow-2: var(--hj-yellow-2); $hj-green-2: var(--hj-green-2); $hj-cyan-2: var(--hj-cyan-2); $hj-blue-2: var(--hj-blue-2); $hj-purple-2: var(--hj-purple-2); $hj-white-2: var(--hj-white-2); $hj-black-2: var(--hj-black-2); $hj-red-3: var(--hj-red-3); $hj-orange-3: var(--hj-orange-3); $hj-yellow-3: var(--hj-yellow-3); $hj-green-3: var(--hj-green-3); $hj-cyan-3: var(--hj-cyan-3); $hj-blue-3: var(--hj-blue-3); $hj-purple-3: var(--hj-purple-3); $hj-white-3: var(--hj-white-3); $hj-black-3: var(--hj-black-3); $hj-black-4: var(--hj-black-4); $hj-white-4: var(--hj-white-4); //T:标题 FT:副标题 A:注解 B:正文 S:缩略显示 N:数字 尾号:大号到小号 1=>1++ $font-T1: ( "size": 30px, "weight": 900, "line-height": 36px, "color": var(--fc-color-1), ); $font-T2: ( "size": 24px, "weight": 900, "line-height": 29px, "color": var(--fc-color-1), ); $font-FT: ( "size": 16px, "line-height": 19px, "color": var(--fc-color-2), ); $font-A: ( "size": 16px, "line-height": 19px, "color": var(--fc-color-default), ); $font-B1: ( "size": 16px, "weight": 500, "line-height": 19px, "color": var(--fc-color-default), ); $font-B2: ( "size": 16px, "weight": "bolder", "line-height": 19px, "color": var(--fc-color-default), ); $font-S: ( "size": 12px, "line-height": 15px, "color": var(--fc-color-default), ); $font-N1: ( "size": 70px, "line-height": 85px, "color": var(--fc-color-default), ); $font-N2: ( "size": 48px, "line-height": 58px, "color": var(--fc-color-default), ); $font-N3: ( "size": 38px, "line-height": 46px, "color": var(--fc-color-default), );