Open nareshbhatia opened 1 month ago
thank u so much
https://www.instagram.com/1900_officelle?igsh=MW5ueDI0b21qbW44Zg==
lucifersosad @.***> schrieb am Mo., 5. Aug. 2024, 08:08:
thank u so much
— Reply to this email directly, view it on GitHub https://github.com/shadcn-ui/ui/issues/4457#issuecomment-2268246941, or unsubscribe https://github.com/notifications/unsubscribe-auth/BIO77CPK37L4KS3AGWKIKEDZP4JGVAVCNFSM6AAAAABLVS2HG2VHI2DSMVQWIX3LMV43OSLTON2WKQ3PNVWWK3TUHMZDENRYGI2DMOJUGE . You are receiving this because you are subscribed to this thread.Message ID: @.***>
Describe the bug
The Toggle button has the following background colors for the hover and on states:
hover:bg-muted
data-[state=on]:bg-accent
Unfortunately both these colors map to the same physical color (e.g.
neutral-100
in light mode andneutral-800
in dark mode). This makes it very difficult to tell if the button is on or off in certain situations. The worst case is the Toggle button on a mobile which is in the off state, but still appears to be on. That's because on the mobile, the button stays in the hover mode even after it is tapped. The issue is less severe on the desktop where the confusion only occurs when you click the button and your cursor is still on it. In this case, even when the button is turned off, it shows the hover color giving the perception that it is on.The screenshot below is for a outline button on mobile which is turned off, but still looks like it is on:
You can try this in the docs at https://ui.shadcn.com/docs/components/toggle#outline
Affected component/components
Toggle, Toggle Group
How to reproduce
The button appears as if it is on.
Codesandbox/StackBlitz link
https://ui.shadcn.com/docs/components/toggle#outline
Logs
No response
System Info
Before submitting