Skip to content

Fix checkbox and radio button contrast for dark mode - #324

Merged
cirdes merged 2 commits into
mainfrom
fix-checkbox-contrast
Nov 20, 2025
Merged

Fix checkbox and radio button contrast for dark mode#324
cirdes merged 2 commits into
mainfrom
fix-checkbox-contrast

Conversation

@djalmaaraujo

@djalmaaraujodjalmaaraujo commented Nov 19, 2025

Copy link
Copy Markdown
Contributor

Fixes#320

This is a continuation of #323 from @ianmurrays.

This Pull request fixes both the checkbox and the radio button styles when in a dark mode.

Nov-19-2025 12-57-56

Important note: Shadcn changes the DOM implementation of the checkbox using a button and another element for the indicator. In our case, we rely on the checkbox with a background-image default from tailwind. This limits us to use background-color and color together like shadcn does.

ianmurraysand others added 2 commits October 30, 2025 09:16
Fixes#320. The contrast for the "check" and the background in dark
mode was not enough, making it seem like the checkbox was uncheckable.
@djalmaaraujodjalmaaraujo self-assigned this Nov 19, 2025
@djalmaaraujodjalmaaraujo added the bug Something isn't working label Nov 19, 2025
@djalmaaraujodjalmaaraujo changed the title Fix checkbox contrastFix checkbox and radio button contrast for dark modeNov 19, 2025
},
class: [
"peer h-4 w-4 shrink-0 rounded-sm border border-primary ring-offset-background accent-primary",
"peer h-4 w-4 shrink-0 rounded-sm border-input ring-offset-background accent-primary",

Copy link
Copy Markdown
ContributorAuthor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This is the default.

@cirdescirdes left a comment

Copy link
Copy Markdown
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

lgtm!

@cirdes
cirdes merged commit e5a1f6b into mainNov 20, 2025
2 checks passed
@cirdes
cirdes deleted the fix-checkbox-contrast branch November 20, 2025 13:55
Sign up for freeto join this conversation on GitHub. Already have an account? Sign in to comment

Labels

bugSomething isn't working

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Checkbox component doesn't show "checked" state

3 participants

@djalmaaraujo@cirdes@ianmurrays