MTP2.0_WEB/src/assets/styles/variables.less

// 公共样式和变量
@import 'mixin';
@import 'theme.less';

@m-grey0: var(--m-grey0);
@m-grey1: var(--m-grey1);
@m-grey2:  var(--m-grey2);
@m-grey3: #ccc;          // 登录界面颜色不变
@m-grey4: #333333;       // 登录界面颜色不变
@m-grey5: var(--m-grey5);
@m-grey6: var(--m-grey6);
@m-grey7: var(--m-grey7);  // 滚动条颜色 -- 底色
@m-grey8: var(--m-grey8);  // 滚动条颜色 -- 滑条颜色
@m-grey9: var(--m-grey9);       
@m-grey10: var(--m-grey10);
@m-grey11: var(--m-grey11);
@m-grey12: var(--m-grey12);
@m-grey12-hover: var(--m-grey12-hover);
@m-grey13: var(--m-grey13);
@m-grey13-hover: var(--m-grey13-hover);
@m-grey14: var(--m-grey14);
@m-grey15: var(--m-grey15);
@m-grey15-hover: var(--m-grey15-hover);
@m-grey16: var(--m-grey16);
@m-grey16-hover: var(--m-grey16-hover);
@m-grey17: var(--m-grey17);
@m-grey18: var(--m-grey18);
@m-grey19: var(--m-grey19);
@m-grey20: var(--m-grey20);
@m-grey21: var(--m-grey21);
@m-grey22: var(--m-grey22);
@m-grey22-hover: var(--m-grey22-hover);
@m-grey23: var(--m-grey23);
@m-grey24: #444444;
@m-grey25: #3b444a;
@m-grey26: var(--m-grey26);
@m-grey27: #34444E;
@m-grey28: #36506B;
@m-grey29: #4D647A;
@m-grey30: #223548;
@m-grey31: var(--m-grey31);
@m-grey32: var(--m-grey32);
@m-grey33: var(--m-grey33);
@m-grey34: var(--m-grey34);

@m-black: #000000;
@m-black0: var(--m-black0);
@m-black1: var(--m-black1);
@m-black2: var(--m-black2);
@m-black3: var(--m-black3);
@m-black4: var(--m-black4);
@m-black5: var(--m-black5);
@m-black6: var(--m-black6);
@m-black7: var(--m-black7);
@m-black7-hover: var(--m-black7-hover);
@m-black8: var(--m-black8);
@m-black9: var(--m-black9);
@m-black10: var(--m-black10);
@m-black11: var(--m-black11);
@m-black12: var(--m-black12);
@m-black13: var(--m-black13);
@m-black14: var(--m-black14);
@m-black15: var(--m-black15);
@m-black16: var(--m-black16);
@m-black17: var(--m-black17);
@m-black18: var(--m-black18);
@m-black19: var(--m-black19);
@m-black20: var(--m-black20);
@m-black21: var(--m-black21);                // 角色详情复选框未选中背景色   白色版本等色值修改
@m-black22: var(--m-black22);                // 交易弹窗背景色
@m-black23: var(--m-black23);
@m-black24: var(--m-black24);
@m-black25: var(--m-black25);
@m-black26: var(--m-black26);
@m-black27: var(--m-black27);
@m-black28: var(--m-black28);
@m-black29: var(--m-black29);                // 角色详情复选框未选中边框色   白色版本等色值修改
@m-black30: var(--m-black30);                // 角色详情复选框选中背景色   白色版本等色值修改


@m-blue0: var(--m-blue0);
@m-blue0-hover: var(--m-blue0-hover);
@m-blue1: #4885eb;               // 登录界面色值
@m-blue2: var(--m-blue2);
@m-blue2-hover: var(--m-blue2-hover);
@m-blue3: var(--m-blue3);
@m-blue4: var(--m-blue4);
@m-blue5: var(--m-blue5);
@m-blue6: var(--m-blue6);
@m-blue6-hover: var(--m-blue6-hover);
@m-blue7: var(--m-blue7);
@m-blue7-hover: var(--m-blue7-hover);
@m-blue8: var(--m-blue8);
@m-blue8-hover: var(--m-blue8-hover);
@m-blue9: var(--m-blue9);
@m-blue9-hover: var(--m-blue9-hover);
@m-blue10: var(--m-blue10);
@m-blue10-hover: var(--m-blue10-hover);
@m-blue11: var(--m-blue11);
@m-blue12: var(--m-blue12);
@m-blue13: var(--m-blue13);                           // 白色版本买卖大厅小行情背景色
@m-blue14: var(--m-blue14);
@m-blue15: var(--m-blue15);
@m-blue16: var(--m-blue16);
@m-blue17: var(--m-blue17);
@m-blue18: var(--m-blue18);
@m-blue19: var(--m-blue19);
@m-blue20: var(--m-blue20);
@m-blue21: var(--m-blue21);
@m-blue22: #0e2f4c;                                 // 交易界面色值
@m-blue23: #223F7E;                                 // 履约明细界面色值
@m-blue24: #2484FC;                                 // 履约明细界面色值

@body-bg: #e9eef3;
@m-white0: var(--m-white0);
@m-white0-hover: var(--m-white0-hover);
@m-white1: var(--m-white1);
@m-white2: rgb(240, 240, 240);
@m-white3: rgb(54 187 207);
@m-white4: #FEFEFE;
@m-white5: var(--m-white5);
@m-white6: var(--m-white6);
@m-white7: var(--m-white7);
@m-white8: var(--m-white8);


@m-green0: var(--m-green0);
@m-green1: var(--m-green1);
@m-green2: rgb(26, 187, 207);
@m-green3: #1abbcf;
@m-green4: #1ee18c;
@m-green5: #42b983;

@m-red0: #ff4d4f;
@m-red0-hover: rgba(@m-red0, .8);
@m-red1: #FF2B2B;
@m-red1-hover: rgba(@m-red1, .8);
@m-red2: var(--m-red2);
@m-red3: #ff2b2f;                // 交易界面色值
@m-red4: #2c1b1b;                // 交易界面色值
@m-red5: #691010;                // 交易界面色值
@m-red6: #422b0d;                // 交易界面色值
@m-red7: #f52b2b;                // 交易界面色值
@m-red8: #f12a2d;                // 交易界面色值
@m-red9: #FF5C6F;
@m-red9-hover: rgba(@m-red9, .8);
@m-red10: #FB7F75;
@m-red10-hover: rgba(@m-red10, .8);

@m-yellow0: #FF9600;
@m-yellow1: #FC9618;
@m-yellow2: #ffae00;
@m-yellow3: #653f0d;

@m-orange0: #F52929;

@font-family: system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;

//高度设置
@bottomHeight: 330px;

/*滚动条样式*/
::-webkit-scrollbar {
    width: 10px;
    height: 10px;
}

::-webkit-scrollbar-thumb {
    border-radius: 10px;
    background-color: @m-grey8;
}

::-webkit-scrollbar-button {
    background-color:  @m-grey7;
}

::-webkit-scrollbar-track-piece {
    background-color:  @m-grey7;
}

::-webkit-scrollbar-corner,
.el-input::-webkit-scrollbar-corner {
    background-color:  @m-grey7;
}