Skip to content

refactor: use shared field-required mixin in Lumo checkbox#11749

Merged
web-padawan merged 2 commits into
mainfrom
refactor/lumo-required-indicator-cleanup
May 14, 2026
Merged

refactor: use shared field-required mixin in Lumo checkbox#11749
web-padawan merged 2 commits into
mainfrom
refactor/lumo-required-indicator-cleanup

Conversation

@web-padawan
Copy link
Copy Markdown
Member

@web-padawan web-padawan commented May 13, 2026

The Lumo checkbox duplicated the required indicator content, color, and invalid-state color rules already provided by the shared lumo_mixins_field-required mixin. Added the mixin to the checkbox and drop the duplicated declarations, keeping only the checkbox-specific position overrides.

This is a finding from the vaadin-toggle-switch prototype (which duplicated corresponding CSS from checkbox).


🤖 Generated with Claude Code

web-padawan and others added 2 commits May 13, 2026 20:09
@sonarqubecloud
Copy link
Copy Markdown


:host([required]) [part='required-indicator']::after {
content: var(--vaadin-input-field-required-indicator, var(--lumo-required-field-indicator, '\2022'));
transition: opacity 0.2s;
Copy link
Copy Markdown
Member Author

Choose a reason for hiding this comment

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

This was copied from form-item.css but not working as in checkbox, indicator is hidden using display: none and not opacity.

);
width: 1em;
text-align: center;
position: static;
Copy link
Copy Markdown
Member Author

@web-padawan web-padawan May 13, 2026

Choose a reason for hiding this comment

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

This is needed because in case of checkbox, the indicator itself is positioned and not ::after.
We could probably change that in the future when modifying Lumo to use base styles.

@web-padawan web-padawan requested a review from vursen May 13, 2026 17:22
@web-padawan web-padawan merged commit c6da3e3 into main May 14, 2026
10 checks passed
@web-padawan web-padawan deleted the refactor/lumo-required-indicator-cleanup branch May 14, 2026 06:58
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants