Skip to content

Added support for the content slot

Compare
Choose a tag to compare
@DCzajkowski DCzajkowski released this 22 Jan 11:37
· 47 commits to master since this release

Usage of the new content slot with example youtube video:

<lightbox
  thumbnail="http://via.placeholder.com/350x150"
  :images="[
    'http://placekitten.com/1080/910',
    'http://placekitten.com/1080/920',
    'https://www.youtube.com/embed/dQw4w9WgXcQ',
  ]"
>
  <lightbox-default-loader slot="loader"></lightbox-default-loader>
  <div slot="content" slot-scope="{ url }">
    <iframe
      v-if="url.includes('youtube') || url.includes('youtu.be')"
      :src="url"
      frameborder="0"
      allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture"
      allowfullscreen
      style="width: 100%; height: 90vh;"
    ></iframe>
    <img v-else :src="url">
  </div>
</lightbox>