Protip: the space between the UI control and the label should be done using padding (or achieved via label nesting) so that the entire area is clickable.
[ x ] some long label
ꜛꜛꜛ
padding here, not margins or gaps
(clicking between the control and the label does nothing now)
For some reason it's exceptionally slow for me on chromium. I click and I see it register half a second later. It also has no cursor:pointer which makes it look non-clickable. Is it expected or a bug?
> Is it sarcastic or does it appear only on high frame rate devices? To me it simply feels like another radio button.
You're absolutely right!
Today I'm using a friends gaming computer. It's a 244hz monitor powered by a RTX 5070 TI and a screamingly fast AMD Ryzen 7 9800X3D CPU with 128GB of overclocked 6000MT/s RAM.
Not only does the radio look mundane for such overcomplicated component, but it also misses clicks where I would expect it to register. Like slightly above or below it.
For example, clicking where the pointer is in this image does NOT select the first radio button. It's not forgiving with regards to precision.
In a hilarious turn of fate, on iOS safari the first time one of the radio options is clicked after loading, the css focus style is applied, but a click is not always registered so the radio item ends up stuck in an invalid weird-looking state. I highly doubt the issue would occur if the built in radio were being used
Protip: the space between the UI control and the label should be done using padding (or achieved via label nesting) so that the entire area is clickable.
(clicking between the control and the label does nothing now)
Calling this a "Protip" is generous.
That the combined element has any surface area that doesn't toggle the radio setting is a straight-up bug.
It is laughable for a component this heavily refined to have such a basic usability flaw.
Is this developed by these 10x developers I've heard about?
For some reason it's exceptionally slow for me on chromium. I click and I see it register half a second later. It also has no cursor:pointer which makes it look non-clickable. Is it expected or a bug?
This interactivity definitely adds a wow effect.
Is it sarcastic or does it appear only on high frame rate devices? To me it simply feels like another radio button.
> Is it sarcastic or does it appear only on high frame rate devices? To me it simply feels like another radio button.
You're absolutely right!
Today I'm using a friends gaming computer. It's a 244hz monitor powered by a RTX 5070 TI and a screamingly fast AMD Ryzen 7 9800X3D CPU with 128GB of overclocked 6000MT/s RAM.
Not only does the radio look mundane for such overcomplicated component, but it also misses clicks where I would expect it to register. Like slightly above or below it.
For example, clicking where the pointer is in this image does NOT select the first radio button. It's not forgiving with regards to precision.
https://i.imgur.com/PNoCJeL.png
1 reply →
I'm pretty sure it was a sarcastic comment.
On a recent MBP, it's indistinguishable from a vanilla radio button.
In a hilarious turn of fate, on iOS safari the first time one of the radio options is clicked after loading, the css focus style is applied, but a click is not always registered so the radio item ends up stuck in an invalid weird-looking state. I highly doubt the issue would occur if the built in radio were being used