Commit d4e3c9f9 authored by 张伯涛's avatar 张伯涛

themeD样式修改

parent a69156b9
This diff is collapsed.
......@@ -39,7 +39,8 @@ export default {
themeOptions: [
{ value: '1', label: '风格1' },
{ value: '2', label: '风格2' },
{ value: '3', label: '风格3' }
{ value: '3', label: '风格3' },
{ value: '4', label: '风格4' },
]
}
},
......
......@@ -42,6 +42,8 @@ export default {
return require('@/assets/themeBImage/menuLogo.png')
} else if (localStorage.getItem('theme') === '3') {
return require('@/assets/themeCImage/menuLogo.png')
} else if (localStorage.getItem('theme') === '4') {
return require('@/assets/themeDImage/menuLogo.png')
}
}
},
......
......@@ -25,6 +25,7 @@ import SidebarItem from './SidebarItem'
import variables from '@/styles/variables.scss'
import themeBvariables from '@/styles/themeB/variables.scss'
import themeCvariables from '@/styles/themeC/variables.scss'
import themeDvariables from '@/styles/themeD/variables.scss'
export default {
components: { SidebarItem, Logo },
......@@ -54,6 +55,8 @@ export default {
return themeBvariables
} else if (localStorage.getItem('theme') === '3') {
return themeCvariables
} else if (localStorage.getItem('theme') === '4') {
return themeDvariables
}
},
isCollapse() {
......
......@@ -16,6 +16,8 @@ if (!storageValue || storageValue === '1') {
import('@/styles/themeB/index.scss')
} else if (storageValue === '3') {
import('@/styles/themeC/index.scss')
} else if (storageValue === '4') {
import('@/styles/themeD/index.scss')
}
import halberd from '@/utils/halberd'
import App from './App'
......
......@@ -154,13 +154,11 @@
line-height: 16px;
&:hover {
opacity: 0.85;
background: #03a487;
border: 1px solid #03a487!important;
background: linear-gradient(90deg,#1773ee, #1ad5e9 100%);
}
&:focus {
opacity: 0.85;
background: #03a487;
border: 1px solid #03a487!important;
background: linear-gradient(90deg,#1773ee, #1ad5e9 100%);
}
}
//清空/删除按钮
......@@ -225,7 +223,9 @@
}
// radio选中的文字样式
.el-radio__input.is-checked+.el-radio__label{
color: #03A487;
background: linear-gradient(180deg,#1776ee, #1ad3e9 100%);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
}
// switch关样式
.el-switch__core{
......
......@@ -44,7 +44,7 @@
}
.login-form {
border: 1px solid #1773ee;
//border: 1px solid #1773ee;
width: 479px;
height: 625px;
background: rgba(255,255,255,0.90);
......
// 通用样式,如:按钮,列表,form表单等
// 查询按钮
.queryBtn{
//width: 72px;
//height: 32px;
background: #2e77b7;
border: 0!important;
border-radius: 4px;
font-size: 14px;
font-family: Microsoft YaHei, Microsoft YaHei-400;
font-weight: 400;
text-align: LEFT;
color: #f6f6f6;
line-height: 16px;
&:hover {
border: 0!important;
opacity: 0.85;
background: #2e77b7;
}
&:focus {
border: 0!important;
opacity: 0.85;
background: #2e77b7;
}
}
//重置按钮
.resetBtn{
//width: 72px;
//height: 32px;
background: #f6f6f6;
border: 1px solid #d9d9d9;
border-radius: 4px;
font-size: 14px;
font-family: Microsoft YaHei, Microsoft YaHei-400;
font-weight: 400;
text-align: LEFT;
color: #666666;
line-height: 16px;
&:hover {
opacity: 0.85;
background: #f6f6f6;
border: 1px solid #d9d9d9!important;
}
&:focus {
opacity: 0.85;
background: #f6f6f6;
border: 1px solid #d9d9d9!important;
}
}
//新增按钮
.addBtn{
//width: 72px;
//height: 34px;
border: 0!important;
background: #2e77b7;
border-radius: 6px;
font-size: 14px;
font-family: Microsoft YaHei, Microsoft YaHei-400;
font-weight: 400;
text-align: LEFT;
color: #f6f6f6;
line-height: 16px;
&:hover {
border: 0!important;
opacity: 0.85;
background: #2e77b7;
}
&:focus {
border: 0!important;
opacity: 0.85;
background: #2e77b7;
}
}
//导入按钮
.importBtn{
//width: 72px;
//height: 34px;
border: 0!important;
background: #889ba9;
border-radius: 6px;
font-size: 14px;
font-family: Microsoft YaHei, Microsoft YaHei-400;
font-weight: 400;
text-align: LEFT;
color: #f6f6f6;
line-height: 16px;
&:hover {
color: #f6f6f6;
border: 0!important;
opacity: 0.85;
background: #889ba9;
}
&:focus {
color: #f6f6f6;
border: 0!important;
opacity: 0.85;
background: #889ba9;
}
}
//导出按钮
.exportBtn{
//width: 72px;
//height: 34px;
background: #889ba9!important;
border-radius: 6px;
border: 0!important;
font-size: 14px;
font-family: Microsoft YaHei, Microsoft YaHei-400;
font-weight: 400;
text-align: LEFT;
color: #f6f6f6;
line-height: 16px;
&:hover {
border: 0!important;
opacity: 0.85;
background: #889ba9!important;
}
&:focus {
border: 0!important;
opacity: 0.85;
background: #889ba9!important;
}
}
//取消按钮样式
.cancelBtn{
background: #ffffff;
border: 1px solid #d9d9d9;
border-radius: 4px;
font-size: 14px;
font-family: Microsoft YaHei, Microsoft YaHei-400;
font-weight: 400;
text-align: LEFT;
color: #666666;
line-height: 16px;
&:hover {
opacity: 0.85;
background: #ffffff;
border: 1px solid #d9d9d9!important;
}
&:focus {
opacity: 0.85;
background: #ffffff;
border: 1px solid #d9d9d9!important;
}
}
//确定按钮样式
.submitBtn{
background: #2e77b7;
border-radius: 4px;
font-size: 14px;
font-family: Microsoft YaHei, Microsoft YaHei-400;
font-weight: 400;
text-align: LEFT;
color: #ffffff;
line-height: 16px;
&:hover {
opacity: 0.85;
background: #2e77b7;
border: 1px solid #03a487!important;
}
&:focus {
opacity: 0.85;
background: #2e77b7;
border: 1px solid #03a487!important;
}
}
//清空/删除按钮
.clearBtn{
//width: 72px;
//height: 34px;
background: #889ba9;
border: 0!important;
border-radius: 6px;
font-size: 14px;
font-family: Microsoft YaHei, Microsoft YaHei-400;
font-weight: 400;
text-align: LEFT;
color: #ffffff;
line-height: 16px;
&:hover {
border: 0!important;
opacity: 0.85;
background: #889ba9;
}
&:focus {
border: 0!important;
opacity: 0.85;
background: #889ba9;
}
}
// form的label样式
.el-form-item__label{
color: #333333!important;
font-size: 14px!important;
font-family: Microsoft YaHei, Microsoft YaHei-400;
font-weight: 400;
text-align: LEFT;
}
// 输入框内文字样式
.el-input__inner{
padding-right: 10px!important;
font-size: 14px!important;
}
// placeholder样式
::placeholder{
color: #969696!important;
font-size: 14px!important;
}
// tree组件样式
.el-tree-node{
font-size: 14px!important;
}
//tree的选中的check框样式
//.el-checkbox__input.is-checked .el-checkbox__inner{
// background: linear-gradient(90deg,#1773ee, #1ad5e9 100%);
//}
// switch开样式
.el-switch.is-checked .el-switch__core{
background: #2e77b7;
border-radius: 9px;
}
// radio开样式
.el-radio__input.is-checked .el-radio__inner{
background: #2e77b7;
border-radius: 9px;
}
// radio选中的文字样式
.el-radio__input.is-checked+.el-radio__label{
color: #2e77b7;
}
// switch关样式
.el-switch__core{
border-color: #BBBBBB;
background-color: #BBBBBB;
}
//table列表title样式
.tableTitle{
margin: 20px 0;
color: #333333;
font-size: 14px;
font-family: Microsoft YaHei, Microsoft YaHei-700;
font-weight: 700;
text-align: LEFT;
}
// table列表表头样式
.el-table th .cell{
background: #f2f2f2;
font-size: 14px;
font-family: Microsoft YaHei, Microsoft YaHei-700;
font-weight: 700;
text-align: LEFT;
color: #333333;
line-height: 24px;
}
// table列表内容样式
.el-table td .cell{
font-size: 14px;
font-family: Microsoft YaHei, Microsoft YaHei-400;
font-weight: 400;
text-align: LEFT;
color: #666666;
}
//修改按钮文字类型样式
.updateBtn{
font-size: 14px;
font-family: Microsoft YaHei, Microsoft YaHei-400;
font-weight: 400;
text-align: LEFT;
color: #2E77B7;
}
//新增按钮文字类型样式
.addBtnText{
font-size: 14px;
font-family: Microsoft YaHei, Microsoft YaHei-400;
font-weight: 400;
text-align: LEFT;
color: #2E77B7;
}
//重置按钮文字类型样式
.resetBtnText{
font-size: 14px;
font-family: Microsoft YaHei, Microsoft YaHei-400;
font-weight: 400;
text-align: LEFT;
color: #2E77B7;
}
//删除按钮文字类型样式
.delBtn{
font-size: 14px;
font-family: Microsoft YaHei, Microsoft YaHei-400;
font-weight: 400;
text-align: LEFT;
color: #2E77B7;
}
//分页样式
.el-pagination.is-background .el-pager li:not(.disabled).active{
background: #ffffff;
border: 1px solid #03a487;
border-radius: 2px;
color: #03a487;
font-size: 14px;
}
//分页样式
.el-pagination.is-background .el-pager li {
font-size: 14px;
font-family: Microsoft YaHei, Microsoft YaHei-400;
font-weight: 400;
color: #686A6C;
background: #ffffff;
border: 1px solid #eeeeee;
border-radius: 2px;
}
//分页样式
.el-pagination__total{
font-size: 14px!important;
font-family: Microsoft YaHei, Microsoft YaHei-400;
font-weight: 400;
text-align: LEFT;
color: #686a6c;
}
//------------公共的样式文件---------------------------------------------------
@import "./navigationBar.scss"; // 左侧导航栏css样式文件
@import "./sidebar.scss"; // 自带的左侧导航栏css样式文件
@import "./variables.scss"; // 风格变量css样式文件
@import "./tagsView.scss"; // 顶部面包屑tag签css样式文件
@import "./layout.scss"; // layout的css样式文件
@import "./common.scss"; // // 通用样式,如:按钮,列表,form表单等样式文件
//-----------各个模块的样式文件--------------------------------------------
@import "./login.scss"; // 登录页面css样式文件
@import "./reSetPsw.scss"; // 修改密码模块css样式文件
@import "../../styles/mixin";
@import "./variables";
.app-wrapper {
@include clearfix;
position: relative;
height: 100%;
width: 100%;
&.mobile.openSidebar{
position: fixed;
top: 0;
}
}
.nav-container{
/*height: 70px;*/
//position: absolute;
top: 0;
width: 100%;
z-index: 1001;
}
.nav-container-two{
width: 100%;
z-index: 1001;
.placeholder {
height: 1.2vh;
width: 100%;
background-color: #F4F4F4;
}
}
.drawer-bg {
background: #000;
opacity: 0.3;
width: 100%;
top: 0;
height: 100%;
position: absolute;
z-index: 999;
}
.fixed-header {
position: fixed;
//top: 0;
//right: 0;
//z-index: 9;
width: calc(100% - #{$sideBarWidth});
transition: width 0.28s;
}
.hideSidebar .fixed-header {
width: calc(100% - #{ $sideHideWidth })
}
.mobile .fixed-header {
width: 100%;
}
.login {
display: flex;
justify-content: end;
align-items: center;
padding-right: 120px;
height: 100%;
background-image: url("../../assets/themeDImage/login-background.png");
background-size: cover;
.login_logoRow{
padding-top: 63px;
display: flex;
justify-content: center;
width: 100%;
.login_form_logo{
width: 64px;
height: 64px;
background-image: url("../../assets/themeDImage/login_logo.png");
}
}
.loginTitleRow{
width: 100%;
display: flex;
justify-content: center;
margin-top: 24px;
.title {
font-size: 24px;
font-family: Microsoft YaHei, Microsoft YaHei-700;
font-weight: 700;
text-align: CENTER;
color: #333333;
line-height: 28px;
}
}
.el-input__prefix{
left: 14px;
}
.el-input--prefix .el-input__inner{
padding-left: 44px;
font-size: 16px;
}
.el-form-item {
margin-bottom: 4vh;
}
}
.login-form {
//border: 1px solid #1773ee;
width: 479px;
height: 625px;
background: rgba(255,255,255,0.90);
border-radius: 20px;
display: flex;
flex-direction: column;
align-items: flex-end;
background: #ffffff no-repeat;
background-size: 59%;
background-position-y: 57px;
.login-form-content{
padding-top: 50px;
width: 100%;
display: flex;
flex-direction: column;
align-items: center;
.el-form-item{
width: 343px;
height: 44px;
background: #ffffff;
border: 1px solid #d9d9d9;
border-radius: 4px;
margin-bottom: 30px!important;
.el-input__inner{
background: #ffffff;
border: 1px solid #2e77b7;
border-radius: 6px;
}
}
// input 修改placeholder颜色
::-webkit-input-placeholder { /* WebKit, Blink, Edge */
color: #2E77B7!important;
font-size: 14px;
}
.loginCode_formItem{
width: 343px;
display: flex;
justify-content: space-between;
.el-form-item{
width: 200px;
}
}
.loginBtn_formItem{
margin: 30px 0 20px!important;
}
.blue-btn{
width: 343px;
height: 44px;
background: #2e77b7;
border-radius: 6px;
font-size: 16px;
font-family: Microsoft YaHei, Microsoft YaHei-700;
font-weight: 700;
text-align: CENTER;
color: #ffffff;
line-height: 19px;
}
}
.el-input {
height: 44px;
input {
height: 44px;
}
}
.input-icon {
height: 39px;
width: 14px;
margin-left: 2px;
}
}
.login-tip {
font-size: 13px;
text-align: center;
color: #bfbfbf;
}
.login-code {
height: 44px;
img {
height: 44px;
cursor: pointer;
vertical-align: middle;
}
}
.el-login-footer {
height: 40px;
line-height: 40px;
position: fixed;
bottom: 0;
width: 100%;
text-align: center;
color: #fff;
font-family: Arial;
font-size: 12px;
letter-spacing: 1px;
}
.login_buttons-content{
display: flex;
width: 343px;
justify-content: space-between;
.rem-code span{
color: $font-dark;
}
.el-link span{
color: $color-theme;
}
.rem-code span, .el-link span{
font-size: 16px;
}
}
.sidebarLogoFade-enter-active {
transition: opacity 1.5s;
}
.sidebarLogoFade-enter,
.sidebarLogoFade-leave-to {
opacity: 0;
}
.sidebar-logo-container {
background: #F6F6F6!important;
height: 150px!important;
position: relative;
width: 100%;
line-height: 50px;
padding-top: 10px;
padding-left: 4px;
overflow: hidden;
.sidebar-logoRow{
padding-top: 28px!important;
padding-bottom: 2px!important;
text-align: center!important;
}
& .sidebar-logo-link {
height: 100%;
width: 100%;
& .sidebar-logo {
width: 44px;
height: 44px;
vertical-align: middle;
//margin-right: 12px;
}
& .sidebar-title {
text-align: center!important;
color: #333333!important;
margin: 0;
font-weight: 600;
line-height: 50px;
font-size: 14px;
font-family: Avenir, Helvetica Neue, Arial, Helvetica, sans-serif;
vertical-align: middle;
}
}
&.collapse {
.sidebar-logo {
margin-right: 0px;
}
}
}
.forget-pwd-content{
display: flex;
flex-direction: column;
align-items: center;
min-height: calc(100vh - 110px);
.title{
font-size: 24px;
font-weight: bold;
margin-top: 40px;
}
.el-form{
margin-top: 40px;
width: 40%;
.el-form-item__label{
color: #333333;
font-weight: normal;
}
.el-input__inner{
border-radius: 4px;
}
.blue-btn{
height: 32px;
border-radius: 4px;
}
}
}
@import './variables';
#app {
.main-container {
padding-top: 6.4vh;
min-height: 100%;
transition: margin-left 0.28s;
margin-left: 219px;
position: relative;
}
.sidebar-container {
transition: width 0.28s;
width: 216px !important;
background-color: #F6F6F6;
box-shadow: 3px 0px 3px 0px rgba(0,0,0,0.10)!important;
height: 100%;
position: fixed;
font-size: 0px;
top: 0;
bottom: 0;
left: 0;
z-index: 1001;
overflow: hidden;
// reset element-ui css
.horizontal-collapse-transition {
transition: 0s width ease-in-out, 0s padding-left ease-in-out,
0s padding-right ease-in-out;
}
.scrollbar-wrapper {
overflow-x: hidden !important;
}
.el-scrollbar__bar.is-vertical {
right: 0px;
}
.el-scrollbar {
height: calc(100% - 50px);
}
&.has-logo {
.el-scrollbar {
height: calc(100% - 50px);
}
}
.is-horizontal {
display: none;
}
a {
display: inline-block;
width: 100%;
overflow: hidden;
}
.svg-icon {
margin-right: 17px;
font-size: 20px;
}
.el-menu {
border: none;
height: 100%;
width: 100% !important;
}
// menu hover
.submenu-title-noDropdown,
.el-submenu__title {
&:hover {
background-color: $menuHover !important;
}
}
.is-active > .el-submenu__title {
background: #ebeced!important;
}
& .nest-menu .el-submenu > .el-submenu__title,
& .el-submenu .el-menu-item {
background: #ebeced!important;
font-size: 12px!important;
min-width: 196px !important;
height: 42px!important;
line-height: 42px!important;
border-radius: 0px!important;
}
}
.hideSidebar {
.sidebar-container {
width: $sideHideWidth !important;
}
.main-container {
margin-left: 54px;
}
.submenu-title-noDropdown {
padding: 0 !important;
position: relative;
.el-tooltip {
padding: 0 !important;
.svg-icon {
margin-left: 17px;
}
}
}
.el-submenu {
overflow: hidden;
& > .el-submenu__title {
padding: 0 !important;
.svg-icon {
margin-left: 17px;
}
.el-submenu__icon-arrow {
display: none;
}
}
}
.el-menu--collapse {
.el-submenu {
& > .el-submenu__title {
& > span {
height: 0;
width: 0;
overflow: hidden;
visibility: hidden;
display: inline-block;
}
}
}
}
}
.el-menu--collapse .el-menu .el-submenu {
min-width: 196px !important;
}
// mobile responsive
.mobile {
.main-container {
margin-left: 0px;
}
.sidebar-container {
transition: transform 0.28s;
width: 196px !important;
}
&.hideSidebar {
.sidebar-container {
pointer-events: none;
transition-duration: 0.3s;
transform: translate3d(-196px, 0, 0);
}
}
}
.withoutAnimation {
.main-container,
.sidebar-container {
transition: none;
}
}
}
// when menu collapsed
.el-menu--vertical {
& > .el-menu {
.svg-icon {
margin-right: 16px;
}
}
.nest-menu .el-submenu > .el-submenu__title,
.el-menu-item {
&:hover {
// you can use $subMenuHover
background-color: $menuHover !important;
}
}
// the scroll bar appears when the subMenu is too long
> .el-menu--popup {
max-height: 100vh;
overflow-y: auto;
&::-webkit-scrollbar-track-piece {
background: #d3dce6;
}
&::-webkit-scrollbar {
width: 6px;
}
&::-webkit-scrollbar-thumb {
background: #99a9bf;
border-radius: 20px;
}
}
}
.el-submenu__icon-arrow {
color: #ffffff !important;
}
.is-active.submenu-title-noDropdown {
background-color: #fff !important;
}
#app .sidebar-container .el-submenu .el-menu-item.is-active {
background: #ffffff!important;
color: #2e77b7!important;
font-weight: 700!important;
border-right: 4px solid #2E77B7;
}
.router-link-active .el-menu-item.is-active {
span{
font-weight: 700!important;
color: #2e77b7!important;
}
}
// hover样式
.el-submenu__title:hover {
color: #2e77b7!important;
.el-submenu__icon-arrow {
color: #2e77b7!important;
}
}
.nest-menu .el-submenu > .el-submenu__title:hover {
background-color: #E2EEFD !important;
color: #2e77b7!important;
}
.is-active > .el-submenu__title:hover {
color: #2e77b7!important;
}
.el-submenu .el-menu-item:hover {
color: #2e77b7!important;
}
.el-menu-item.submenu-title-noDropdown:hover {
color: #2e77b7!important;
}
.el-menu--vertical .el-menu-item:hover {
color: #2e77b7!important;
}
#app .hideSidebar .el-submenu>.el-submenu__title{
margin: 0 !important;
}
.el-submenu.is-opened {
background-color: #FFFFFF !important;
> .el-submenu__title {
font-size: 14px!important;
color: #333333 !important;
font-weight: 400!important;
//margin: 0 10px!important;
height: 42px!important;
line-height: 42px!important;
border-radius: 4px!important;
.el-submenu__icon-arrow {
color: #2e77b7!important;
}
}
.el-menu {
.el-menu-item {
background-color: #fff !important;
color: #666666 !important;
&:hover {
color: #2e77b7!important;
}
&.is-active {
}
}
}
.nest-menu {
//padding: 0 10px!important;
.el-submenu__title {
background-color: #fff !important;
color: #000000 !important;
.el-submenu__icon-arrow {
color: #2e77b7!important;
}
}
}
}
.tags-view-container {
height: 31px;
width: 100%;
background: #F4F4F4;
//border-bottom: 1px solid #d8dce5;
//box-shadow: 0 1px 3px 0 rgba(0, 0, 0, .12), 0 0 3px 0 rgba(0, 0, 0, .04);
margin: 0 14px;
.tags-view-wrapper {
.tags-view-item {
display: inline-block;
position: relative;
cursor: pointer;
height: 27px;
line-height: 26px;
//border: 1px solid #d8dce5;
color: #495060;
background: #fff;
padding: 0 10px;
font-size: 14px;
margin-left: 5px;
margin-top: 4px;
&:first-of-type {
margin-left: 0;
}
&:last-of-type {
margin-right: 15px;
}
&.active {
background-color: #fff;
color: #2e77b7;
border-color: transparent;
//&::before {
// content: '';
// background: #fff;
// display: inline-block;
// width: 8px;
// height: 8px;
// border-radius: 50%;
// position: relative;
// margin-right: 2px;
//}
}
}
}
.contextmenu {
margin: 0;
background: #fff;
z-index: 3000;
position: absolute;
list-style-type: none;
padding: 5px 0;
border-radius: 4px;
font-size: 12px;
font-weight: 400;
color: #333;
box-shadow: 2px 2px 3px 0 rgba(0, 0, 0, .3);
li {
margin: 0;
padding: 7px 16px;
cursor: pointer;
&:hover {
background: #eee;
}
}
}
}
.tags-view-wrapper {
.tags-view-item {
.el-icon-close {
width: 16px;
height: 16px;
vertical-align: 2px;
border-radius: 50%;
text-align: center;
transition: all .3s cubic-bezier(.645, .045, .355, 1);
transform-origin: 100% 50%;
&:before {
transform: scale(.6);
display: inline-block;
vertical-align: -3px;
}
&:hover {
background-color: #b4bccc;
color: #fff;
}
}
}
}
// 主题色
$color-theme: #03A487;
$color-red: #F57b7b;
$color-purple: #ff33a9;
$color-orange: #f4ac10;
$color-blue: #409EFF;
// 我的单据背景色 考勤统计
$color-cambridge-blue: #29a2db;
// 我的单据背景色 考勤统计
$color-cambridge-red: #ffbebe;
// 我的单据背景色 考勤统计
$color-cambridge-yellow: #fcd89f;
// 我的单据背景色 考勤统计
$color-cambridge-yellow: #fcd89f;
// 我的单据背景色 考勤统计
$color-indigo: #9fc6fc;
// 考勤统计
$color-indigo-deep: #5cbce5;
// 考勤统计未选中项
$color-grey: #d1d1d1;
// 系统背景色
$color-grey-light: #f4f4f4;
// 列表表头底色
$color-grey-light: #ecf9fe;
// 统计折线图背景色
$color-green: #49cec9;
// 统计折线图折线
$color-green-deep: #1cc2bc;
$color-green-light-btn: #6dd8e4;
// 统计折线图背景色
$color-blue-bg: #1cc2bc;
// 统计折线图折线
$color-blue-line: #0098de;
// 考勤统计
$color-green-light: #80e4e9;
// 线框、线段、列表 虚线分割线、表单不可修改
$color-border: #e5e5e5;
// 查询 新增 申请 tab标签 分页列表中除修改之外的其他按钮
$blue-prime: #46BCF3;
$blue-prime-hover: #6bc9f5;
$blue-prime-active: #0098de;
// 导出 导入 修改
$green-prime: #49cec9;
$green-prime-hover: #6dd8d4;
$green-prime-active: #1cc2bc;
// 文件上传
$yellow-prime: #f6c761;
$yellow-prime-hover: #f8d281;
$yellow-prime-active: #f4ac10;
// 删除
$red-prime: #f68f8f;
$red-prime-hover: #f8a5a5;
$red-prime-active: #ff7b7b;
$blue:#324157;
$light-blue:#3A71A8;
$red:#C03639;
$pink: #E65D6E;
$green: #30B08F;
$tiffany: #4AB7BD;
$yellow:#FEC171;
$panGreen: #30B08F;
// 文字色
$font-black: #000;
// 主文字
$font-dark: #333;
// 次文字 表单内容、面包屑当前
$font-deep: #666666;
// 说明文字
$font-pl: #999999;
// 错误的提示文字 需要注意的提示文字
$font-error: #f52929;
$font-weak: #b3b3b3;
// 反白文字
$font-white: #fff;
// 背景色
$bg-bar: #f9f9f9;
$bg-page: #f3f3f3;
$bg-page-light: #f9f9f9;
$bg-menu-hover: #f2f6fc;
// sidebar
$menuText:#333333;
$menuActiveText:#333333;
$subMenuActiveText:#f4f4f5; //https://github.com/ElemeFE/element/issues/12951
$menuBg:#F6F6F6;
$menuHover:#fff;
$subMenuBg:#46BCF2;
$subMenuHover:#fff;
$sideBarWidth: 219px;
$sideHideWidth: 54px;
// the :export directive is the magic sauce for webpack
// https://www.bluematador.com/blog/how-to-share-variables-between-js-and-sass
:export {
menuText: $menuText;
menuActiveText: $menuActiveText;
subMenuActiveText: $subMenuActiveText;
menuBg: $menuBg;
menuHover: $menuHover;
subMenuBg: $subMenuBg;
subMenuHover: $subMenuHover;
sideBarWidth: $sideBarWidth;
}
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment