color.less 3.8 KB
Newer Older
陈文彬 已提交
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69
@white: #fff;
@info-color: @primary-color;

@basic-mask-color: fade(@white, 30%);
// :export {
//   name: "less";
//   mainColor: @mainColor;
//   fontSize: @fontSize;
// }
@iconify-bg-color: #5551;

// =================================
// ==============边框颜色============
// =================================

// 暗色-深
@border-color-dark: #b6b7b9;

// 暗色-浅
@border-color-shallow-dark: #cececd;

// 亮色-深
@border-color-light: #ebeef5;

// 亮色-浅
@border-color-shallow-light: #f2f6fc;

// =================================
// ==============message==============
// =================================
// 成功背景颜色
@success-background-color: #f1f9ec;
// 一般背景颜色
@info-background-color: #e8eff8;
// 警告背景颜色
@warning-background-color: #fdf6ed;
// 危险背景颜色
@danger-background-color: #fef0f0;
// tag标签:失效
@invalid-color: #909399;

// =================================
// ==============bg color============
// =================================

// dark
@background-color-dark: #f0f2f5;
// light
@background-color-light: #f5f7fa;
// layout content background
@layout-content-bg-color: #f1f1f6;

// =================================
// ==============Header=============
// =================================

@header-dark-bg-color: #394664;
@header-dark-bg-hover-color: #273352;
@header-light-bg-hover-color: #f6f6f6;
@header-light-desc-color: #7c8087;
@header-light-bottom-border-color: #eee;
// =================================
// ==============Menu============
// =================================

// let -menu
@first-menu-item-dark-bg-color: #273352;

// 2级菜单黑暗背景色
V
vben 已提交
70
@sub-menu-item-dark-bg-color: #314268;
陈文彬 已提交
71
// 3级菜单黑暗背景色
V
vben 已提交
72
@children-menu-item-dark-bg-color: #4f6088;
陈文彬 已提交
73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127 128 129 130 131 132 133 134 135 136 137 138 139 140 141

// top-menu
@top-menu-active-bg-color: #273352;

// trigger
@trigger-dark-hover-bg-color: rgba(255, 255, 255, 0.2);
@trigger-dark-bg-color: rgba(255, 255, 255, 0.1);
@trigger-light-bg-color: @white;
@trigger-light-hover-bg-color: rgba(255, 255, 255, 0.7);

// =================================
// ==============tree============
// =================================
// tree item hover background
@tree-hover-background-color: #f5f7fa;
// tree item hover font color
@tree-hover-font-color: #f5f7fa;
// =================================
// ==============link============
// =================================
@link-hover-color: @primary-color;
@link-active-color: darken(@primary-color, 10%);

// =================================
// ==============文本色-=============
// =================================

// 主文本色
@text-color-base: #2c3a61;
// 标注色
@text-color-call-out: #606266;

// 辅助说明信息色-深色
@text-color-help-dark: #909399;

// 辅助说明信息色-浅色
@text-color-help-light: #c0c4cc;

// =================================
// ==============breadcrumb=========
// =================================
@breadcrumb-item-normal-color: #6e90a7;
// =================================
// ==============button=============
// =================================

@button-primary-color: @primary-color;
@button-primary-hover-color: darken(@primary-color, 5%);

@button-ghost-color: @primary-color;
@button-ghost-hover-color: lighten(@primary-color, 10%);
@button-ghost-hover-bg-color: #e1ebf6;

@button-success-color: @success-color;
@button-success-hover-color: darken(@success-color, 10%);

@button-warn-color: @warning-color;
@button-warn-hover-color: darken(@warning-color, 10%);

@button-error-color: @error-color;
@button-error-hover-color: darken(@error-color, 10%);

@button-cancel-color: @text-color-call-out;
@button-cancel-bg-color: @white;
@button-cancel-border-color: @border-color-shallow-dark;
// 鼠标悬停
@button-cancel-hover-color: @primary-color;
@button-cancel-hover-bg-color: @white;
@button-cancel-hover-border-color: @primary-color;