naive-ui/styles/Statistic.scss

55 lines
1.5 KiB
SCSS
Raw Normal View History

2019-10-28 18:29:52 +08:00
@import './mixins/mixins.scss';
@include themes-mixin {
@include b(statistic) {
@include b(statistic-value) {
2019-12-12 18:36:30 +08:00
@include once {
margin-top: 4px;
2020-02-27 23:02:58 +08:00
font-weight: $--n-strong-weight;
2019-12-12 18:36:30 +08:00
}
2019-10-28 18:29:52 +08:00
@include e(prefix) {
2019-12-12 18:36:30 +08:00
@include once {
font-size: 18px;
transition: .3s color $--n-ease-in-out-cubic-bezier;
2019-12-12 18:36:30 +08:00
}
2019-10-28 18:29:52 +08:00
color: $--statistic-value-prefix-text-color;
@include b(icon) {
2019-12-12 18:36:30 +08:00
@include once {
vertical-align: -0.125em;
}
2019-10-28 18:29:52 +08:00
fill: $--statistic-value-prefix-text-color;
2020-02-07 20:04:20 +08:00
stroke: $--statistic-value-prefix-text-color;
2019-10-28 18:29:52 +08:00
}
}
@include e(content) {
2019-12-12 18:36:30 +08:00
@include once {
font-size: 24px;
transition: .3s color $--n-ease-in-out-cubic-bezier;
2019-12-12 18:36:30 +08:00
}
2019-10-28 18:29:52 +08:00
color: $--statistic-value-content-text-color;
}
@include e(suffix) {
2019-12-12 18:36:30 +08:00
@include once {
font-size: 18px;
transition: .3s color $--n-ease-in-out-cubic-bezier;
2019-12-12 18:36:30 +08:00
}
2019-10-28 18:29:52 +08:00
color: $--statistic-value-suffix-text-color;
@include b(icon) {
2019-12-12 18:36:30 +08:00
@include once {
vertical-align: -0.125em;
}
2019-10-28 18:29:52 +08:00
fill: $--statistic-value-prefix-text-color;
2020-02-07 20:04:20 +08:00
stroke: $--statistic-value-prefix-text-color;
2019-10-28 18:29:52 +08:00
}
}
}
@include e(label) {
2019-12-12 18:36:30 +08:00
@include once {
2020-02-27 23:02:58 +08:00
font-weight: $--n-strong-weight;
transition: .3s color $--n-ease-in-out-cubic-bezier;
2019-12-12 18:36:30 +08:00
font-size: 14px;
}
2019-10-28 18:29:52 +08:00
color: $--statistic-value-label-text-color;
}
}
}