54 lines
1.1 KiB
SCSS
54 lines
1.1 KiB
SCSS
// 边框样式
|
|
|
|
@use 'mixins/function' as *;
|
|
@use 'mixins/mixins' as *;
|
|
|
|
[class*=#{bem('border')}] {
|
|
border-radius: inherit;
|
|
box-sizing: border-box;
|
|
border-width: getCssVar('border-width', '');
|
|
border-style: solid;
|
|
}
|
|
|
|
/* 圆角尺寸 start */
|
|
.#{bem('radius')} {
|
|
border-radius: getCssVar('border-radius', '');
|
|
}
|
|
.#{bem('round')} {
|
|
border-radius: getCssVar('border-radius', 'round');
|
|
}
|
|
/* 圆角尺寸 end */
|
|
|
|
@include b('border') {
|
|
// 加粗边框
|
|
&-bold {
|
|
border-width: getCssVar('border-width', 'bold');
|
|
}
|
|
|
|
// 虚线边框
|
|
&-dashed {
|
|
border-style: dashed;
|
|
}
|
|
|
|
// 设置单边
|
|
@each $direction in ('top', 'right', 'bottom', 'left') {
|
|
&-#{$direction} {
|
|
border-width: 0px;
|
|
border-#{$direction}-width: getCssVar('border-width', '');
|
|
&.tn-border-bold {
|
|
border-#{$direction}-width: getCssVar('border-width', 'bold');
|
|
}
|
|
}
|
|
}
|
|
|
|
// 移除边框
|
|
&-none {
|
|
border-width: 0px;
|
|
@each $direction in ('top', 'right', 'bottom', 'left') {
|
|
&-#{$direction} {
|
|
border-#{$direction}-width: 0px;
|
|
}
|
|
}
|
|
}
|
|
}
|