automated_uniapp/uni_modules/cool-ui/static/css/radio.scss

125 lines
1.9 KiB
SCSS
Raw Normal View History

2025-01-09 16:16:11 +08:00
.cl-radio {
display: inline-flex;
align-items: center;
height: $cl-height;
margin-right: 60rpx;
position: relative;
&__input {
display: inline-flex;
align-items: center;
justify-content: center;
color: #fff;
box-sizing: border-box;
position: relative;
background-color: #fff;
border: $cl-border-width solid $cl-border-color;
height: $cl-radio-size;
width: $cl-radio-size;
border-radius: $cl-radio-size;
text {
display: inline-block;
position: absolute;
border-radius: 20rpx;
height: 14rpx;
width: 14rpx;
}
}
&__label {
line-height: 1;
font-size: 28rpx;
margin-left: 16rpx;
flex: 1;
display: -webkit-box;
overflow: hidden;
text-overflow: ellipsis;
-webkit-box-orient: vertical;
-webkit-line-clamp: 1;
}
&.is-checked {
.cl-radio__input {
background-color: $cl-color-primary;
border: $cl-color-primary;
text {
background-color: #fff;
}
}
&.is-text {
.cl-radio__label {
color: $cl-color-primary;
}
}
}
&.is-disabled {
.cl-radio__input {
background-color: $cl-color-disabled-bg;
color: $cl-color-disabled;
text {
background-color: $cl-color-disabled;
}
}
.cl-radio__label {
color: $cl-color-disabled;
}
}
&.is-text {
.cl-radio__input {
display: none;
}
.cl-radio__label {
margin-left: 0;
}
}
&.is-border {
border-radius: 10rpx;
padding: 0 20rpx;
margin: 0 20rpx 20rpx 0;
border: $cl-border-width solid $cl-border-color;
box-sizing: border-box;
line-height: normal;
&.is-checked {
border-color: $cl-color-primary;
color: $cl-color-primary;
.cl-radio__label {
color: $cl-color-primary;
}
}
}
&.is-round {
border-radius: $cl-radio-size;
}
&.is-fill {
margin-right: 0;
width: 100%;
}
}
/* #ifdef MP */
cl-radio {
display: inline-flex;
}
.cl-radio-group {
&.is-fill {
cl-radio {
display: inline;
}
}
}
/* #endif */