issue KVS 5.5.0 and vertical screenshots issue in old projects

[Tech Support]

We found that there is an issue that may affect sites in the following situation:

• This issue only happens with vertical videos.
• This issue only happens when your theme is limiting access to some videos (e.g. signup to watch a video).

Vertical video screenshot will be distorted in this case:

 

Unfortunately we can't put a fix into update, because the fix affects theme CSS which cannot be updated together with KVS.

Therefore if this issue affects your project, you will need to manually put this fix into your theme CSS file. Common themes where this could be an issue are: KVS Default Theme and Paysite Theme 1.

1) For KVS Default Theme you need to modify one of these file directly on disk (or FTP), change -white if your theme color is light and choose -metal if you theme color is dark:

/static/styles/all-responsive-white.css
/static/styles/all-responsive-metal.css

Find this style:

.block-video .no-player img {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  opacity: 0.2;
}

And add object-fit: contain; into it:

.block-video .no-player img {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  opacity: 0.2;
  object-fit: contain;
}

 

2) For Paysite Theme 1 you need to modify one of these file directly on disk (or FTP), change all.css if your theme color is light and choose all-dark.css if you theme color is dark:

/static/styles/all.css
/static/styles/all-dark.css

Find this style:

.media-container__join__img {
  position: absolute;
  top: 0;
  left: 0;
  width:100%;
  height:100%;
}

And add object-fit: contain; into it:

.media-container__join__img {
  position: absolute;
  top: 0;
  left: 0;
  width:100%;
  height:100%;
  object-fit: contain;
}

 

As a result here is how the fixed version looks like: