summaryrefslogtreecommitdiff
path: root/src/web/app/mobile/views/components/media-video.vue
diff options
context:
space:
mode:
Diffstat (limited to 'src/web/app/mobile/views/components/media-video.vue')
-rw-r--r--src/web/app/mobile/views/components/media-video.vue36
1 files changed, 36 insertions, 0 deletions
diff --git a/src/web/app/mobile/views/components/media-video.vue b/src/web/app/mobile/views/components/media-video.vue
new file mode 100644
index 0000000000..68cd48587a
--- /dev/null
+++ b/src/web/app/mobile/views/components/media-video.vue
@@ -0,0 +1,36 @@
+<template>
+ <a class="mk-media-video"
+ :href="video.url"
+ target="_blank"
+ :style="imageStyle"
+ :title="video.name">
+ %fa:R play-circle%
+ </a>
+</template>
+
+<script lang="ts">
+import Vue from 'vue'
+export default Vue.extend({
+ props: ['video'],
+ computed: {
+ imageStyle(): any {
+ return {
+ 'background-image': `url(${this.video.url}?thumbnail&size=512)`
+ };
+ }
+ },})
+</script>
+
+<style lang="stylus" scoped>
+.mk-media-video
+ display flex
+ justify-content center
+ align-items center
+
+ font-size 3.5em
+ overflow hidden
+ background-position center
+ background-size cover
+ width 100%
+ height 100%
+</style>