Vimeo Full Screen Video Background

cover.scss

.c-cover {
    --height: 100dvh;
    --safe-height: var(--height, var(--vh));
    --container-width: 100vw;
    --container-height: var(--safe-height);

    position: relative;
    height: var(--container-height);
    overflow: hidden;
    width: var(--container-width);

    iframe {
        /* [1] video width and height variables are inherited from inline styles */
        --height-width-ratio: (var(--video-height) / var(--video-width)); // [1]
        --width-height-ratio: (var(--video-width) / var(--video-height)); // [1]

        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        width: var(--container-width);
        height: calc(var(--container-width) * var(--height-width-ratio));
        min-height: var(--container-height);
        min-width: calc(var(--container-height) * var(--width-height-ratio));
    }
}

Alternatively using Vimeo player SDK

 async setAspectRatio() {
    const promises = [
      this.player.getVideoWidth(),
      this.player.getVideoHeight(),
    ]
    const [width, height] = await Promise.all(promises)

    this.iframe.style.setProperty('--video-width', width)
    this.iframe.style.setProperty('--video-height', height)
  }

To do : custom lite-vimeo