Setting a default field variant?

[abea]

We're upgrading from Vue 2/Vuetify 2 right now. Our existing design has text fields that look like the variant 'underlined', not the default styling. It seems like we can either set the variant prop on every field in our code base or override styles with our own (maybe needing !important?).

It's possible that we could override SCSS variables to get as close as possible, but is there a way to simply tell Vuetify (v3) that we want the underlined variant to be the default?

[KaelWD]

https://vuetifyjs.com/en/features/global-configuration/

[abea]

Perfect. Thank you.

[theking2]

But how do I set boht VTextField and VTextarea without repeating?

[abea]

Both are based on VInput. Some props of those two might be inherited directly such that you could set the property on VInput. That said, we do have separate global settings for VTextField, VTextarea, VAutocomplete, and a couple others. I'm not sure if that's because we tried combining them and it didn't work.

[theking2]

Just for my understanding setting globals on VInput will automagically propagete (inherited) derived input elements?

[abea]

That works for many inheritance situations, yes. Some components may have internal overrides that replace the inherited prop, so you might need to apply it directly to the forehead child component.

[theking2]

Thanks that answers my question!