fix(ui): display images/videos smaller in timeline (#257)

This commit is contained in:
Daniel Roe 2022-11-30 18:22:15 +00:00 committed by GitHub
parent e76127651a
commit 2bfa9dc476
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
3 changed files with 14 additions and 1 deletions

View file

@ -26,6 +26,12 @@ const aspectRatio = computed(() => {
return clamp(rawAspectRatio.value, 0.5, 2)
return undefined
})
const objectPosition = computed(() => {
return [attachment.meta?.focus?.x, attachment.meta?.focus?.y]
.map(v => v ? `${v * 100}%` : '50%')
.join(' ')
})
</script>
<template>
@ -39,6 +45,7 @@ const aspectRatio = computed(() => {
:height="attachment.meta?.original?.height"
:style="{
aspectRatio,
objectPosition,
}"
>
<source :src="attachment.url || attachment.previewUrl" type="video/mp4">
@ -55,6 +62,7 @@ const aspectRatio = computed(() => {
:height="attachment.meta?.original?.height"
:style="{
aspectRatio,
objectPosition,
}"
>
<source :src="attachment.url || attachment.previewUrl" type="video/mp4">
@ -83,6 +91,7 @@ const aspectRatio = computed(() => {
:alt="attachment.description!"
:style="{
aspectRatio,
objectPosition,
}"
border="~ base"
rounded-lg