<template>
  <Block :title="$_tr('title')" :link-title="$_tr('link')" title-tag="h4">
    <div class="video-spaces-container" v-html="video" />
  </Block>
</template>

<script>
import Block from '@inside-commons/components/lib/Block'

export default {
  name: 'SpaceVideo',
  $_i18nRootPath: 'customs.SPACES.video',
  components: {
    Block
  },
  props: {
    video: {
      type: String,
      required: true
    }
  }
}
</script>

<style lang="scss">
.video-spaces-container {
  position: relative;
  padding-bottom: 56.25%;
  padding-top: 30px;
  height: 0;
  overflow: hidden;

  iframe,
  object,
  embed {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
  }
}
</style>
