src/style/radio.less
.@{prefix-cls}-radio-con{
margin-right: 10px;
&:hover{
cursor:pointer;
}
.@{prefix-cls}-radio-span{
white-space: nowrap;
outline: none;
display: inline-block;
position: relative;
line-height: 1;
vertical-align: middle;
}
.@{prefix-cls}-radio-inner {
position: relative;
top: 0;
left: 0;
display: inline-block;
width: @radioSize;
height: @radioSize;
border-width: 1px;
border-style: solid;
border-radius: @radioSize;
border-color: @lightGrayColor;
background-color: @whiteColor;
transition: all 0.3s ease;
}
.@{prefix-cls}-radio-input {
position: absolute!important;
left: 0;
z-index: 1;
cursor: pointer;
opacity: 0;
opacity: 0;
top: 0;
bottom: 0;
right: 0;
width: 100%;
height: 100%;
}
.@{prefix-cls}-radio-checked .@{prefix-cls}-radio-inner:after {
transform: scale(1);
opacity: 1;
}
.@{prefix-cls}-radio-inner:after {
position: absolute;
width: @radioPointerSize;
height: @radioPointerSize;
left: (@radioSize - @radioPointerSize)/2-1;
top: (@radioSize - @radioPointerSize)/2-1;
border-radius: @radioPointerSize;
display: table;
border-top: 0;
border-left: 0;
content: ' ';
background-color: @primaryColor;
transform: scale(0);
opacity: 0;
transition: all 0.3s ease;
}
.@{prefix-cls}-radio-disabled .@{prefix-cls}-radio-inner {
border-color: @lightGrayColor;
background-color: @lightColor;
}
}
.@{prefix-cls}-radio-btn input[type=radio] {
position: absolute;
clip: rect(0,0,0,0);
pointer-events: none;
}