Embed

Component name: <v-embed>

Create responsive video or slideshow embeds based on the width of the parent by creating an intrinsic ratio that scales on any device.

Examples

Youtube

Lorem ipsum dolor sit amet, consectetur adipiscing elit.
<div class="app">
  <v-embed aspect="16:9">
    <iframe src="https://www.youtube.com/embed/i0rCjM0aYvg" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
  </v-embed>
</div>
1
2
3
4
5

Vimeo

<div class="app">
  <v-embed aspect="16:9">
    <iframe src="https://player.vimeo.com/video/4899787?title=0&byline=0&portrait=0" frameborder="0" allow="autoplay; fullscreen" allowfullscreen></iframe>
  </v-embed>
</div>
1
2
3
4
5

API

Name Type Description Default
aspect String Set aspect ratio

Valid values: 16:9, 4:3, 1:1
16:9
description String Set description -