Vuetify: [Bug Report] v-carousel: Image gets cropped

[jkosonen]

Versions and Environment

Vuetify: 1.3.0
Vue: 2.5.17
Browsers: FF 62.0.3
OS: Win 10

Previously worked in:

Vuetify: 1.2.6
Vue: 2.5.17

Steps to reproduce

Add v-carousel and give it percentage height

Expected Behavior

Image stays inside carousel

Actual Behavior

Image is too big and overflows

Reproduction Link

https://codepen.io/anon/pen/dgKNxm

---

Additional Comments:

[KaelWD]

This actually seems to be v-window, there's nothing restricting the height of v-window-item if v-window__container has a set height.

@johnleider Adding height: 100%; to v-window-item fixes this, is it likely to break something else?

@jkosonen Workaround is to add style="height: 100%" to the v-carousel-item

[johnleider]

Maybe during transition, will have to check.

[rcheung9]

Affects v-tabs-items too. I have transition and reverse-transition set on v-tab-item and the rendered output sometimes sets the .v-window__container with a fixed pixel height.

Have to override the css

.v-window__container--is-active {
    height: 100% !important;
}

[johnleider]

Putting 100% on window elements causes some issues:

• The window container no longer transitions its height
• window-y-transition is broken

This _may_ be something we could explicitly do on carousel as it was always intended for it to have a fixed height, but v-tabs would not.

[johnleider]

Adding as a fix specific to v-carousel as any other implementation breaks other functionality. I don't have an issue with locking this in to a single component as its expected that v-carousel maintain the same height.