I’m not sure if you are having the same problems as me – but is it the unchecked check box background are black coloured rather than white? I’ve been searching all over trying to fix this 🙂
Thread Starter
Anonymous User 20948376
(@anonymized-20948376)
@kelsangchodor
Yes, black checkboxes for me as well. But I believe this wasn’t in some previous version if I remember correctly.
Hi @abhishek0088 @kelsangchodor
Yes, we can style for the checkbox, please add below CSS code to WP-Admin → Appearance → Customize → Additional CSS
.woosg-choose {
position: relative;
cursor: pointer;
font-size: 22px;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
z-index: 9;
}
.woosg-choose input {
opacity: 0;
width: 20px;
height: 20px;
z-index: 1;
cursor: pointer;
vertical-align: middle;
margin: 0;
}
.woosg-choose .checkmark {
position: absolute;
top: 50%;
left: 50%;
height: 20px;
width: 20px;
margin-top: -10px;
margin-left: -10px;
z-index: -1;
background-color: white;
border: 1px solid rgba(0, 0, 0, .3);
display: block;
cursor: pointer;
border-radius: 2px;
}
.woosg-choose:hover input ~ .checkmark {
background-color: #ccc;
}
.woosg-choose input:checked ~ .checkmark {
background-color: #2dc4a4;
}
.woosg-choose .checkmark:after {
content: "";
position: absolute;
display: none;
}
.woosg-choose input:checked ~ .checkmark:after {
display: block;
}
.woosg-choose .checkmark:after {
left: 6px;
top: 2px;
width: 4px;
height: 8px;
border: solid white;
border-width: 0 2px 2px 0;
-webkit-transform: rotate(45deg);
-ms-transform: rotate(45deg);
transform: rotate(45deg);
}
And the result https://www.screencast.com/t/RTjmCQNq
Amazing. Thanks so much! 😀👍🫶🙏
Thread Starter
Anonymous User 20948376
(@anonymized-20948376)
.
