// base color $blue: #324157; $light-blue: #3a71a8; $red: #c03639; $pink: #e65d6e; $green: #30b08f; $tiffany: #4ab7bd; $yellow: #fec171; $panGreen: #30b08f; //默认头部loto主题风格 $base-menu-logo-color: #ffffff; $base-menu-logo-color-active: #f4f4f5; $base-menu-logo-background: #0f69ff; $base-logo-logo-title-color: #ffffff; // 默认菜单主题风格 $base-menu-color: #ffffff; $base-menu-color-active: #f4f4f5; $base-menu-background: #4285f4; $base-menu-background-active: #ffffff; $base-logo-title-color: #ffffff; $base-menu-light-color: rgba(0, 0, 0, 0.7); $base-menu-light-background: #ffffff; $base-logo-light-title-color: #001529; $base-sub-menu-background: #4285f4; $base-sub-menu-back-hover: #ffffff; $base-sub-menu-clolor-hover: #4285f4; // 自定义暗色菜单风格 /** $base-menu-color:hsla(0,0%,100%,.65); $base-menu-color-active:#fff; $base-menu-background:#001529; $base-logo-title-color: #ffffff; $base-menu-light-color:rgba(0,0,0,.70); $base-menu-light-background:#ffffff; $base-logo-light-title-color: #001529; $base-sub-menu-background:#000c17; $base-sub-menu-back-hover:#001528; */ $--color-primary: #409eff; $--color-success: #67c23a; $--color-warning: #e6a23c; $--color-danger: #f56c6c; $--color-info: #909399; $base-sidebar-width: 240px; // the :export directive is the magic sauce for webpack // https://www.bluematador.com/blog/how-to-share-variables-between-js-and-sass :export { menuColor: $base-menu-color; menuLightColor: $base-menu-light-color; menuColorActive: $base-menu-color-active; menuBackground: $base-menu-background; menuLightBackground: $base-menu-light-background; subMenuBackground: $base-sub-menu-background; subMenuHover: $base-sub-menu-back-hover; sideBarWidth: $base-sidebar-width; logoTitleColor: $base-logo-title-color; logoLightTitleColor: $base-logo-light-title-color; primaryColor: $--color-primary; successColor: $--color-success; dangerColor: $--color-danger; infoColor: $--color-info; warningColor: $--color-warning; menuLogoBackground: $base-menu-logo-background; }