Thank you Mat, that's very neat!
Shortly before you've posted I've completed my own solution:
input[type=radio] {
display: none;
}
.tc-radio {
margin-left: 35px;
position: relative;
}
input[type=radio] + span {
margin-left: -10px;
}
input[type=radio]:not(:checked) + span:before {
content: "-";
color: transparent;
position: absolute;
left: -35px;
height: 12px;
width: 12px;
border: 4px solid #ddd;
background: #ddd;
border-radius: 50%;
transition-duration: 0.2s;
}
input[type=radio]:not(:checked):hover + span:before {
background: #ccc;
transition-duration: 0.2s;
}
input[type=radio]:checked + span:before {
content: "-";
color: transparent;
position: absolute;
left: -35px;
height: 12px;
width: 12px;
border: 4px solid #ddd;
background: #333;
border-radius: 50%;
}
I will look into yours more tomorrow and learn something new.
Thanks again!
Regards,
Hubert
On Thursday, 2 April 2020 20:41:52 UTC+1, Mat wrote:
>
> Presenting: http://radiobuttons.tiddlyspot.com/
>
> <:-)
>
--
You received this message because you are subscribed to the Google Groups
"TiddlyWiki" group.
To unsubscribe from this group and stop receiving emails from it, send an email
to [email protected].
To view this discussion on the web visit
https://groups.google.com/d/msgid/tiddlywiki/20f113b4-f5dc-471a-8d43-a591079bdf4a%40googlegroups.com.
