123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100 |
- @import './menu-theme-mixin.less';
- /**
- @navBg 菜单背景色
- @headerBg 头部背景色
- @footBg 页脚背景色
- @fontColor 头部颜色
- @activeFontColor 菜单激活是文字颜色
- @menuItemActive 菜单激活时背景色
- @subMenuOpened 子菜单打开时背景色
- @menuFontColor 菜单文字颜色
- @mainBackground 主要的背景色
- */
- .main-theme(@navBg,@headerBg, @footBg,@fontColor,@activeFontColor,@menuItemActive,@subMenuOpened,@menuFontColor,@mainBackground){
- @useMenuFontColor: if((iscolor(@menuFontColor)), @menuFontColor, @fontColor);
- // top 使用和header部分的配置
- // 菜单部分
- .main-framework--top__nav{
- .menu-theme--horizontal(@headerBg, @fontColor, @headerBg, @fontColor);
- }
- // left 使用left部分的配置
- // 菜单部分 [注:在main-framework__aside将导致popover时样式服务正确应用,拿到外面将导致对menu-item部分的控制外溢影响--top__nav]
- .menu-theme--popup(@navBg, @useMenuFontColor, @menuItemActive, @activeFontColor, @subMenuOpened);
- .main-framework__aside{
- .menu-theme(@navBg, @useMenuFontColor, @menuItemActive, @activeFontColor, @subMenuOpened);
- position: relative;
- z-index: 200;
- background: @navBg;
- box-shadow: 0 1px 4px rgba(0,21,41,.1);
- }
- .main-framework__name{
- background: @navBg;
- color: @fontColor;
- }
- .main-framework__header{
- .main-framework__name{ // 使用header的默认颜色和背景色
- background: @headerBg;
- color: @fontColor;
- }
- background: @headerBg;
- color: @fontColor;
- box-shadow: 0 1px 4px rgba(0,21,41,.1);
- position: relative;
- z-index: 200;
- .header-bar__logout{
- border-color: @fontColor;
- }
- .@{elNamespace}-dropdown{
- color: inherit;
- }
- .@{elNamespace}-breadcrumb__inner{
- color: inherit;
- }
- }
- .main-framework__main{
- background: @mainBackground;
- }
- .main-framework__footer{
- position: relative;
- z-index: 200;
- background: @footBg;
- color: @fontColor;
- }
- .main-framework__aside__switch{
- color: @useMenuFontColor;
- //box-shadow: 0 1px 4px rgba(0,21,41,.3);
- }
- }
- .main-theme--data-center{
- @themePrimary: #1e3851;
- .main-theme(@themePrimary,@themePrimary,@themePrimary,#fff,#fff,#104682,#253f58,'',@background);
- }
- .main-theme--light{
- @themePrimary: #fff;
- .main-theme(@themePrimary,@themePrimary,@themePrimary,#333,@primary,#e8f4ff, #f7f7f7,'',@background);
- }
- // TODO: 黑暗模式待完善
- .main-theme--dark{
- @themePrimary: #2f3542;
- .main-theme(@themePrimary,@themePrimary,@themePrimary,#fff,#409eff,#444,#001328,'',@background);
- }
- .main-theme--standard{
- @themePrimary: var(~'--@{elNamespace}-color-primary');
- .main-theme(
- #fff,
- @themePrimary,
- #fff,
- #fff,
- @themePrimary,
- var(~'--@{elNamespace}-color-primary-light-9', #ecf5ff),
- #f7f7f7,
- #666,
- @background
- )
- }
|