Based on black or white, all text colors are calculated using rgba($on-surface, 0.xx). Without overwriting the theme with css I don't see any way to apply our own design-system colors to inputs.
What I would have expected is e.g. using the already provided foreground and background colors
foreground text -> input-text-color
foreground disabled -> disabled-input-text-color
foreground hint-text (though, here I'm not sure) -> input-text-placeholder-color
Use Case
I want to create a 100% custom theme and apply all colors from my own design system. At the same time I want to use the theming API as much as possible without the need to write many custom css workarounds that can break during major releases.
Feature Description
This issue is specifically for filled-text-field, though most likely affects other places in this repo as well.
In https://github.com/angular/components/blob/main/src/material/core/tokens/m2/mdc/_filled-text-field.scss#L97 a scss variable
$on-surface
is set. Depending on light or dark-theme, the outcome is hard-coded: #fff or #000Based on black or white, all text colors are calculated using
rgba($on-surface, 0.xx)
. Without overwriting the theme with css I don't see any way to apply our own design-system colors to inputs.What I would have expected is e.g. using the already provided foreground and background colors
Use Case
I want to create a 100% custom theme and apply all colors from my own design system. At the same time I want to use the theming API as much as possible without the need to write many custom css workarounds that can break during major releases.