76 lines
1.4 KiB
SCSS
76 lines
1.4 KiB
SCSS
@use 'sass:map';
|
|
|
|
@use '../mixins/mixins.scss' as *;
|
|
@use '../var/size.scss' as *;
|
|
|
|
$rate-sizes: () !default;
|
|
$rate-sizes: map-merge(
|
|
(
|
|
'sm': (
|
|
'font-size': 32rpx,
|
|
'gutter': 8rpx,
|
|
),
|
|
'': (
|
|
'font-size': 38rpx,
|
|
'gutter': 8rpx,
|
|
),
|
|
'lg': (
|
|
'font-size': 46rpx,
|
|
'gutter': 8rpx,
|
|
),
|
|
'xl': (
|
|
'font-size': 52rpx,
|
|
'gutter': 8rpx,
|
|
),
|
|
),
|
|
$rate-sizes
|
|
);
|
|
|
|
@include b(rate) {
|
|
position: relative;
|
|
width: fit-content;
|
|
|
|
/* 内容容器 start */
|
|
@include e(container) {
|
|
display: flex;
|
|
align-items: center;
|
|
font-size: map-get(map-get($rate-sizes, ''), 'font-size');
|
|
line-height: 1;
|
|
}
|
|
@include e(active-container) {
|
|
position: absolute;
|
|
left: 0;
|
|
right: 0;
|
|
top: 0;
|
|
bottom: 0;
|
|
width: 0;
|
|
overflow: hidden;
|
|
}
|
|
/* 内容容器 end */
|
|
|
|
/* item样式 start */
|
|
@include e(item) {
|
|
padding: 0rpx calc(map-get(map-get($rate-sizes, ''), 'gutter') / 2);
|
|
}
|
|
/* item样式 end */
|
|
|
|
/* 尺寸 start */
|
|
@each $size in $tn-inner-sizes {
|
|
@include m($size) {
|
|
@include e(container) {
|
|
font-size: map-get(map-get($rate-sizes, $size), 'font-size');
|
|
}
|
|
@include e(item) {
|
|
padding: 0rpx calc(map-get(map-get($rate-sizes, $size), 'gutter') / 2);
|
|
}
|
|
}
|
|
}
|
|
/* 尺寸 end */
|
|
|
|
/* 禁止点击 start */
|
|
@include when(readonly) {
|
|
// opacity: 0.4;
|
|
}
|
|
/* 禁止点击 end */
|
|
}
|