@primary-color:?#1990ff?!;?//?全局主色
@link-color:?#1890ff;?//?鏈接色
@success-color:?#67c23a;?//?成功色
@warning-color:?#FD6400;?//?警告色
@error-color:?#f56c6c;?//?錯誤色
@font-size-base:?14px;?//?主字號
@heading-color:?rgba(0,?0,?0,?0.85);?//?標(biāo)題色
@text-color:?rgba(0,?0,?0,?0.65);?//?主文本色
@text-color-secondary:?rgba(0,?0,?0,?0.45);?//?次文本色
@disabled-color:?rgba(0,?0,?0,?0.25);?//?失效色
@border-radius-base:?4px;?//?組件/浮層圓角
@border-color-base:?#d9d9d9;?//?邊框色
@box-shadow-base:?0?3px?6px?-4px?rgba(0,?0,?0,?0.12),
??0?6px?16px?0?rgba(0,?0,?0,?0.08),
??0?9px?28px?8px?rgba(0,?0,?0,?0.05);?//?浮層陰影
@fff:?#fff;
@gray:?#f4f4f4;
@mainColor:?#63a9f1;
@highColor:?#255bb4;
//?上下空隙
@container-tb-gap:?20px;
//?左右空隙
@container-lr-gap:?20px;
@container-gap:?@container-tb-gap?@container-lr-gap;
@border-radius:?15px;
@box-shadow:?0?2px?4px?0?@gray;
@chart-height:?400px;
.for-loop-p(@index)?when?(@index?>0)?{
??.fs-@{index}?{
????font-size:?(@index?*?0.01rem)?!important;
??}
??.fw-@{index}?{
????font-weight:?(@index?*?100)?!important;
??}
??.w-@{index}-p?{
????width:~'@{index}%';
??}
??.h-@{index}-p?{
????height:~'@{index}%';
??}
??//?一定需要注意xu格式操作符中間要有空格,否則會失效?@index?-1?=>?@index?-?1
??.for-loop-p(@index?-?1);
}
.for-loop-p(100);
.for-loop-px(@index)?when?(@index?>0)?{
??.w-@{index}px?{
????width:?(@index?*?1px)?!important;
??}
??.h-@{index}px?{
????height:?(@index?*?1px)?!important;
??}
??.mr-@{index}px?{
????margin-right:?(@index?*?1px)?!important;
??}
??.ml-@{index}px?{
????margin-left:?(@index?*?1px)?!important;
??}
??.mt-@{index}px?{
????margin-top:?(@index?*?1px)?!important;
??}
??.mb-@{index}px?{
????margin-bottom:?(@index?*?1px)?!important;
??}
??.pr-@{index}px?{
????padding-right:?(@index?*?1px)?!important;
??}
??.pl-@{index}px?{
????padding-left:?(@index?*?1px)?!important;
??}
??.pt-@{index}px?{
????padding-top:?(@index?*?1px)?!important;
??}
??.pb-@{index}px?{
????padding-bottom:?(@index?*?1px)?!important;
??}
??//?一定需要注意xu格式操作符中間要有空格分歇,否則會失效?@index?-1?=>?@index?-?1
??.for-loop-px(@index?-?1);
}
.for-loop-px(200);
.primary-color?{
??color:?@primary-color;
}
.error-color?{
??color:?@error-color;
}
.success-color?{
??color:?@success-color;
}