github/directus
1
0
Fork 0
mirror of https://github.com/directus/directus.git synced 2026-01-27 10:18:06 -05:00
Code Issues Packages Projects Releases Wiki Activity

Center horizontally for small width videos

Browse Source
This commit is contained in:
Azri Kahar
2022-07-22 18:10:11 +08:00
parent bec3d0e16e
commit 9326399ba6
1 changed files with 10 additions and 1 deletions
Download Patch File Download Diff File Expand all files Collapse all files

11
app/src/views/private/components/file-preview/file-preview.vue
View File

@@ -1,5 +1,9 @@
<template>
<div v-if="type && !imgError" class="file-preview" :class="{ modal: inModal, small: isSmall, svg: isSVG }">
<div
v-if="type && !imgError"
class="file-preview"
:class="{ modal: inModal, small: isSmall, svg: isSVG, centered: type === 'video' }"
>
<div v-if="type === 'image'" class="image" @click="$emit('click')">
<v-image :src="src" :width="width" :height="height" :alt="title" @error="imgError = true" />
</div>
@@ -65,6 +69,11 @@ const authenticatedSrc = computed(() => addTokenToURL(props.src));
position: relative;
max-width: calc((var(--form-column-max-width) * 2) + var(--form-horizontal-gap));
&.centered {
display: flex;
justify-content: center;
}
img,
video {
width: auto;