1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
|
@import "../default/theme.less";
.plx-radio-container {
font-size: 0;
position: relative;
}
.plx-radio {
position: absolute;
z-index: -1;
opacity: 0;
& + .radio-substitute {
position: relative;
display: inline-block;
cursor: pointer;
height: @checkbox-size;
width: @checkbox-size;
border: 1px solid @border-color-base;
border-radius: @checkbox-size;
vertical-align: middle;
}
&:hover + .radio-substitute,
&:focus + .radio-substitute {
border-color: @primary-color;
outline: none;
background-image: none;
-webkit-box-shadow: none;
-moz-box-shadow: none;
box-shadow: none;
text-shadow: none;
}
&:checked + .radio-substitute {
.radio-boder-checked-width(@font-size);
}
&:disabled + .radio-substitute,
&[disabled] + .radio-substitute {
border-color: @border-color-base;
background-color: @input-bg-color-disabled;
cursor: not-allowed;
}
&:checked [disabled] + .radio-substitute {
border-color: @border-color-split;
background-color: @border-color-split;
cursor: not-allowed;
}
& + .radio-substitute + span {
font-weight: normal;
font-size: @font-size;
cursor: pointer;
vertical-align: middle;
.font-padding(@font-size);
}
&:disabled + .radio-substitute + span,
&[disabled] + .radio-substitute + span {
cursor: not-allowed;
}
}
.radio-boder-checked-width(12px) {
border: 4px solid @primary-color;
}
.radio-boder-checked-width(14px) {
border: 5px solid @primary-color;
}
.font-padding(12px) {
padding-left: 6px;
}
.font-padding(14px) {
padding-left: 10px;
}
/*radio-group*/
@radio-group-border-height: 1px;
@padding-normal: 0px 16px;
@padding-sm: 0px 14px;
@min-width-normal: 80px;
@min-width-sm: 60px;
.border-min-width(@min-width, 14px) {
min-width: @min-width + 8px;
}
.border-min-width(@min-width, 12px) {
min-width: @min-width;
}
.btn.dropdown-toggle,
.btn-group .btn.dropdown-toggle,
.btn:hover,
.btn:disabled,
.btn[disabled],
.btn:focus,
.btn:active,
.btn.active {
outline: none !important;
background-image: none !important;
filter: none;
-webkit-box-shadow: none;
-moz-box-shadow: none;
box-shadow: none;
text-shadow: none;
}
.plx-radio-group {
cursor: pointer;
font-size: @font-size;
height: @btn-height;
background-color: @common-color;
border: @radio-group-border-height solid @border-color-base;
color: @text-color;
border-radius: @radius;
padding: @padding-normal;
.border-min-width(@min-width-normal, @font-size);
transition: none;
&:hover,
&:focus,
&:active {
outline: none;
background-image: none;
filter: none;
-webkit-box-shadow: none;
-moz-box-shadow: none;
box-shadow: none;
text-shadow: none;
}
&:hover,
&:focus {
color: @btn-common-color-text-hover;
border-color: @btn-common-color-border-hover;
background-color: @common-color-hover;
}
&:active {
color: @btn-common-color-text-click;
border-color: @btn-common-color-border-click;
background-color: @common-color-click;
}
&.active {
background-color: @primary-color;
color: @scene-textcolor;
border-color: @primary-color;
}
& > span {
line-height: @btn-height - @radio-group-border-height * 2;
}
}
.plx-radio-group-sm {
height: @btn-height-sm;
padding: @padding-sm;
.border-min-width(@min-width-sm, @font-size);
& > span {
line-height: @btn-height-sm - @radio-group-border-height * 2;
}
}
|
