<vaadin-input-container>: vaadin-input-field-value-font-weight is kaput

[anezthes]

Description

vaadin-input-field-value-font-weight doesn't work; changing its value has no effect on the input element's font weight.

Expected outcome

Changing the value of vaadin-input-field-value-font-weight should alter the font weight of the input element. However, no visible change occurs, and the font weight remains unaffected.

Minimal reproducible example

html {
  vaadin-input-field-value-font-weight: 700;
}

Steps to reproduce

1. Go to https://vaadin.com/docs/latest/components/text-field
2. Open up the inspection tools
3. Paste vaadin-input-field-value-font-weight: 700; into the element style of vaadin-text-field

Environment

Vaadin version(s): 24.5
OS: macOS Sequoia

Browsers

All of them

[web-padawan]

The style is overridden here and this style on vaadin-input-container takes precedence over the one defined on the host element (in this case vaadin-text-field). IMO we should move the custom property to be used here instead:

web-components/packages/input-container/theme/lumo/vaadin-input-container-styles.js

Line 13 in 5c8f872

font-weight: 500;

[TatuLund]

I noticed the same today.

One can add styles like this in project to patch it

vaadin-text-area > textarea {
   font-weight: var(--vaadin-input-field-value-font-weight);
}

vaadin-text-field > input {
   font-weight: --vaadin-input-field-value-font-weight;
}