Style vaadin-text-field which is inside vaadin-combo-box

Flow
1

How can I style vaadin-text-field, the “text-field” part of vaadin-combo-box?
I want to style “input-field” part of vaadin-text-field which is inside vaadin-combo-box

2

Anybody?

3

if you look at vaadin-combo-box\src\vaadin-combo-box.html you can find the “part” attribute: [part=“text-field”]
. This is intended for styling inner component from the outside.
So try using (e.g. from your shared-styles.html file):


<dom-module id="test-combo-box" theme-for="vaadin-combo-box">
    <template>
        <style>
            [part="text-field"]
 {
                color: red;
                font-size: var(--lumo-font-size-l);
            }
        </style>
    </template>
</dom-module>
4

… and if you need to set the [part=“label”]
or other part of that text field.
Part of the part ?

5

Andrea Tomassi:
if you look at vaadin-combo-box\src\vaadin-combo-box.html you can find the “part” attribute: [part=“text-field”]
. This is intended for styling inner component from the outside.
So try using (e.g. from your shared-styles.html file):


<dom-module id="test-combo-box" theme-for="vaadin-combo-box">
    <template>
        <style>
            [part="text-field"]

{

            color: red;
            font-size: var(--lumo-font-size-l);
        }
    </style>
</template>
``` Where i include that shared-styles.html?