keanu-weblite/src/components/messages/MessageOutgoingVideo.vue
N-Pex b1d47748c8 Use SASS module system
Get rid of all the SASS warnings/errors when building.
2025-05-19 10:25:46 +02:00

40 lines
No EOL
1.3 KiB
Vue

<template>
<message-outgoing v-bind="{ ...$props, ...$attrs }">
<div class="bubble image-bubble">
<v-responsive :aspect-ratio="16 / 9" class="ma-0 pa-0">
<video :src="src" controls class="w-100 h-100">
{{$t('fallbacks.video_file')}}
</video>
<div v-if="downloadProgress" class="download-overlay">
<div class="text-center download-text">
{{ $t('message.download_progress',{percentage: downloadProgress}) }}
</div>
</div>
<div v-else-if="userInitiatedDownloadsOnly && !src" class="download-overlay">
<div class="text-center download-text">
{{ fileName }}
</div>
<div class="text-center download-size">
{{ fileSize }}
</div>
<v-icon size="32" color="white" class="clickable" @click="loadAttachmentSource(event, true)">download</v-icon>
</div>
</v-responsive>
</div>
</message-outgoing>
</template>
<script>
import attachmentMixin from "./attachmentMixin";
import MessageOutgoing from "./MessageOutgoing.vue";
export default {
extends: MessageOutgoing,
components: { MessageOutgoing },
mixins: [attachmentMixin],
};
</script>
<style lang="scss">
@use "@/assets/css/chat.scss" as *;
</style>