@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 ) }