[text-field] Label text cut off with Material design when font-size changed

[thigg]

Description

With the material theme, the label of a textfield is cut off at the bottom, when the fontsize is changed

Expected outcome

font-size changes do not affect readability, like with normal font-size:

Actual outcome

font-size change cuts off text. (font-size: 20px)

Amazingly, Edge displays a scrollbar:

Live Demo

Tried here, but couldnt get material theme to work: https://glitch.com/edit/#!/join/4bbcea7f-8ee6-4e42-9b32-d8018b6204e3

Steps to reproduce

Create a textfield in material theme with:
<vaadin-text-field style="font-size: 20px" label="gggggggg" autofocus></vaadin-text-field>

Browsers Affected

• Chrome
• Firefox
• Safari
• Edge
• IE 11
• iOS Safari
• Android Chrome
  (Only FF and Edge tested)

[vursen]

The issue is still there in Vaadin 24.7