171 lines
2.5 KiB
SCSS
171 lines
2.5 KiB
SCSS
// utils 工具// 颜色
|
|
|
|
@import "./varible";
|
|
.bg-error {
|
|
background-color: $color-error !important;
|
|
}
|
|
.text-error {
|
|
color: $color-error !important;
|
|
}
|
|
.text-success {
|
|
color: $color-success !important;
|
|
}
|
|
.text-warning {
|
|
color: $color-warning !important;
|
|
}
|
|
.text-primary {
|
|
color: $color-primary !important;
|
|
}
|
|
.text-normal {
|
|
color: #404042 !important;
|
|
}
|
|
.text-black {
|
|
color: #000;
|
|
}
|
|
.text-dark {
|
|
color: #333;
|
|
}
|
|
.text-deep {
|
|
color: #555;
|
|
}
|
|
.text-weak {
|
|
color: #b3b3b3;
|
|
}
|
|
.text-white {
|
|
color: #fff;
|
|
}
|
|
|
|
.text-error.disabled {
|
|
color: #aaa !important;
|
|
}
|
|
|
|
// 文字对齐
|
|
.tl {
|
|
text-align: left;
|
|
}
|
|
.tc {
|
|
text-align: center;
|
|
}
|
|
.tr {
|
|
text-align: right;
|
|
}
|
|
// 浮动与清除浮动
|
|
.fl {
|
|
float: left;
|
|
}
|
|
.fr {
|
|
float: right;
|
|
}
|
|
.fix {
|
|
*zoom: 1;
|
|
}
|
|
.fix:after {
|
|
display: table;
|
|
content: "";
|
|
clear: both;
|
|
}
|
|
// 显示
|
|
.dn {
|
|
display: none;
|
|
}
|
|
.di {
|
|
display: inline;
|
|
}
|
|
.db {
|
|
display: block;
|
|
}
|
|
.dib {
|
|
display: inline-block;
|
|
}
|
|
.dt {
|
|
display: table;
|
|
}
|
|
div.dib {
|
|
*display: inline;
|
|
*zoom: 1;
|
|
}
|
|
.vm {
|
|
vertical-align: middle;
|
|
}
|
|
.vib {
|
|
display: inline-block;
|
|
vertical-align: middle;
|
|
}
|
|
.ovh {
|
|
overflow: hidden;
|
|
}
|
|
// 定位
|
|
.pr {
|
|
position: relative;
|
|
}
|
|
.pa {
|
|
position: absolute;
|
|
}
|
|
.pf {
|
|
position: fixed;
|
|
}
|
|
|
|
.align-middle {
|
|
position: relative;
|
|
top: 50%;
|
|
transform: translateY(-50%);
|
|
}
|
|
.align-middle-wrap {
|
|
display: flex;
|
|
align-items: center;
|
|
}
|
|
|
|
.text-ellipsis {
|
|
overflow: hidden;
|
|
text-overflow: ellipsis;
|
|
white-space: nowrap;
|
|
}
|
|
|
|
@for $i from 1 through 100 {
|
|
.width-#{$i} {
|
|
width: $i * 1%;
|
|
}
|
|
.height-#{$i} {
|
|
height: $i * 1px;
|
|
}
|
|
// @if $i<50 and $i%2==0 {
|
|
// @if $i<50 {
|
|
.ml-#{$i} {
|
|
margin-left: $i * 1px !important;
|
|
}
|
|
.mr-#{$i} {
|
|
margin-right: $i * 1px !important;
|
|
}
|
|
.mt-#{$i} {
|
|
margin-top: $i * 1px !important;
|
|
}
|
|
.mb-#{$i} {
|
|
margin-bottom: $i * 1px !important;
|
|
}
|
|
// }
|
|
}
|
|
|
|
// 字体
|
|
@for $i from 10 through 28 {
|
|
.f#{$i} {
|
|
font-size: $i * 1px;
|
|
}
|
|
}
|
|
|
|
// .chart-box {
|
|
// height: 50px;
|
|
// width: 100%;
|
|
// border-bottom: 50px solid;
|
|
// border-image: linear-gradient(90deg, #f55c65 0%, #fcced0 48%, #d4dffc 52%, #7194f5 100%) 50 50 50 50;
|
|
// }
|
|
// @for $i from 0 through 50 {
|
|
// .blue-#{$i} {
|
|
// background-color: rgba(#7194f5, 0.1 * $i * 0.2);
|
|
// }
|
|
// }
|
|
// @for $i from 0 through 50 {
|
|
// .red-#{$i} {
|
|
// background-color: rgba(#f55c65, 0.1 * $i * 0.2);
|
|
// }
|
|
// }
|