BlockVideo.vue

<!--
  This source file is part of the Swift.org open source project

  Copyright (c) 2021-2023 Apple Inc. and the Swift project authors
  Licensed under Apache License v2.0 with Runtime Library Exception

  See https://swift.org/LICENSE.txt for license information
  See https://swift.org/CONTRIBUTORS.txt for Swift project authors
-->

<template>
  <Asset
    :identifier="identifier"
    :deviceFrame="deviceFrame"
  />
</template>

<script>
import Asset from 'docc-render/components/Asset.vue';

export default {
  name: 'BlockVideo',
  components: { Asset },
  props: {
    identifier: {
      type: String,
      required: true,
    },
    deviceFrame: {
      type: String,
      required: false,
    },
  },
};
</script>

<style lang="scss" scoped>
@import 'docc-render/styles/_core.scss';

.asset {
  margin-left: auto;
  margin-right: auto;

  @include space-out-between-siblings(var(--spacing-stacked-margin-xlarge));
}

:deep(video) {
  display: block;
  margin-left: auto;
  margin-right: auto;
  object-fit: contain;
  max-width: 100%;
}
</style>