Vuetify: [Bug Report] v-skeleton-loader height, min-height and max-height does not work

[angelofan]

Environment

Vuetify Version: 2.3.2
Vue Version: 2.6.11
Browsers: Chrome 83.0.4103.116
OS: Windows 10

Steps to reproduce

<v-skeleton-loader type="image" height="250" style="background:#ff9900"></v-skeleton-loader>

<v-skeleton-loader type="image" min-height="250" style="background:#99ff00"></v-skeleton-loader>

<v-skeleton-loader type="image" height="100vh" max-height="250" style="background:#0099ff"></v-skeleton-loader>

The skeleton animation has always been 200px in height, The height of the outer div is the height I set.

Expected Behavior

The height I set for v-skeleton-loader is the height of the animation.

The same is true for max-height and min-height.

Actual Behavior

The height I set for v-skeleton-loader is the height of the parent div of the animation, and the height of the animation itself is always 200px.

The same is true for max-height and min-height.

Reproduction Link

https://codepen.io/13546777510/pen/mdVqmPo

[cassioscabral]

I had to override the CSS for this element to overcome this issue. Like this:

::v-deep .v-skeleton-loader.v-skeleton-loader--is-loading {
  .v-skeleton-loader__image {
    height: 100%;
  }
}