refactor: rename some component-specific text-related custom properties #10307
Conversation
|
| vaadin-checkbox:is([checked], [indeterminate]):not([readonly], [disabled])::part(checkbox) { | ||
| --vaadin-checkbox-background: var(--aura-accent-color); | ||
| --vaadin-checkbox-color: var(--aura-accent-contrast); | ||
| --vaadin-checkbox-marker-color: var(--aura-accent-contrast); |
There was a problem hiding this comment.
Lumo has --vaadin-checkbox-checkmark-color and --vaadin-checkbox-checkmark-size. Radio button also has --vaadin props with a different naming convention. Just checking that we are aware of the inconsistency. I guess those will be deprecated / removed in favor of the new ones at some point?
There was a problem hiding this comment.
Ah, good point, thanks. I forgot to check that.
A bit unfortunate, as I’d like to add the "marker" to clarify the intent, but I don't like the breaking change. @rolfsmeds, shall we just keep the old name?
There was a problem hiding this comment.
For reference, radio group has:
--vaadin-radio-button-dot-color--vaadin-radio-button-marker-size
There was a problem hiding this comment.
Right, that one too. Maybe we should just revert those then, keep the old names.
There was a problem hiding this comment.
There seem to be more inconsistencies. Lumo uses a --vaadin-checkbox-label-color, but there is no such thing in base styles or Aura.
There was a problem hiding this comment.
There is, it’s just abstracted together with radio-button as color: var(--vaadin-${unsafeCSS(propName)}-label-color, ...).
2 participants
Try to make it clear that these properties affect the text color, not the overall color (i.e., background) of a component or a part.
I also renamed the
--vaadin-radio-button-dot-sizeto--vaadin-radio-button-marker-sizeto align with themarker-colorproperty.I discovered one left over
--vaadin-subtleproperty reference as well, which seems like a batch-rename mistake from an earlier rename-refactoring.