[Bug Report][3.0.0-beta.14] caret is not center aligned in textfield with hide-details auto & text field variant plain

[jd-solanki]

Environment

Vuetify Version: 3.0.0-beta.14 Vue Version: 3.2.41 Browsers: Chrome 106.0.0.0 OS: Mac OS 10.15.7

Steps to reproduce

1. Visit the link
2. Check the alignment of the caret

Expected Behavior

caret should be center aligned

Actual Behavior

caret is at the bottom

Reproduction Link

https://play.vuetifyjs.com/#...

[jd-solanki]

This is because of hide-details set to auto. All three densities have this issue

[KaelWD]

The is because you've set the background on the entire v-input element. plain is the same as underlined just without the bottom border.

[jd-solanki]

The is because you've set the background on the entire v-input element. plain is the same as underlined just without the bottom border.

Here's with icon: https://play.vuetifyjs.com/#eNpVUEFOwzAQ/IrlS0DCSQs9oRSJCy9AXDAHE2/pSvHasrcRqOrfWauNlMzJ45ldz/jzrF9TaqcT6GfdlyFjYlWAT+nFEoYUM6uzynBQF3XIMahGrI0lS0OkwiqUH7Wv+l3T3Fvqu+sKGRbCENLoGIQp1U/GpbpVCYQEh3Rjwj/e4ZffEEY/X1WIK3oY91bLO1YvJQ9UkP9EGmJIbuC1PLmMjlhkSYC0Fo/owXhgh2MRhztxXBtmpAwJyBskgmxQKtcoHs0xBliOdHOvblGskmvlvlt8hb486Kf2sd1tdT1s2o35liztdqe//gH103e0

[KaelWD]

Compare with variant="underlined", it's the same and not a bug.

I think single-line is supposed to center-align it though, and does on other variants.

[jd-solanki]

With underline:

With underlined:

Should we consider this as BUG?

Probably you can set the best title for this issue as you know what's going under the hood.

[johnleider]

@yuwu9145 Can you see if this is something we can make better or is it as good as it's going to get?

[yuwu9145]

For plain/underlined variants, it should be ok to centralise input when label is not presented, same as how filled variant behaves.

But it's a small & low priority improvement as issue in this ticket can be simply resolved by using "filled variant": demo