diff options
author | pacien | 2023-02-17 22:57:38 +0100 |
---|---|---|
committer | pacien | 2023-02-17 22:57:38 +0100 |
commit | 46cd42de44e402fbf33522d999fa2649729ffaa8 (patch) | |
tree | 1281beefda5d9b6d2411bc47ec1327fbf0b38dde /viewer/src/views/item_handlers/AudioViewer.vue | |
parent | 11bbbae2850b9c45da697a8ed9626495a50a38c0 (diff) | |
parent | e939712a284dff9af6d81cc1fcd4e7f7ec9ad503 (diff) | |
download | ldgallery-46cd42de44e402fbf33522d999fa2649729ffaa8.tar.gz |
Merge branch 'develop': release v2.2v2.2
Diffstat (limited to 'viewer/src/views/item_handlers/AudioViewer.vue')
-rw-r--r-- | viewer/src/views/item_handlers/AudioViewer.vue | 15 |
1 files changed, 12 insertions, 3 deletions
diff --git a/viewer/src/views/item_handlers/AudioViewer.vue b/viewer/src/views/item_handlers/AudioViewer.vue index da9579f..124d132 100644 --- a/viewer/src/views/item_handlers/AudioViewer.vue +++ b/viewer/src/views/item_handlers/AudioViewer.vue | |||
@@ -20,7 +20,10 @@ | |||
20 | 20 | ||
21 | <template> | 21 | <template> |
22 | <div class="flex-column container-vh-centering"> | 22 | <div class="flex-column container-vh-centering"> |
23 | <ItemThumbnail :item="item" /> | 23 | <ItemThumbnail |
24 | :item="item" | ||
25 | :class="$style.audiothumb" | ||
26 | /> | ||
24 | <audio | 27 | <audio |
25 | :class="$style.player" | 28 | :class="$style.player" |
26 | :src="itemResourceUrl" | 29 | :src="itemResourceUrl" |
@@ -40,7 +43,7 @@ | |||
40 | import { AudioItem } from '@/@types/gallery'; | 43 | import { AudioItem } from '@/@types/gallery'; |
41 | import { useNavigation } from '@/services/navigation'; | 44 | import { useNavigation } from '@/services/navigation'; |
42 | import { useItemResource } from '@/services/ui/ldItemResourceUrl'; | 45 | import { useItemResource } from '@/services/ui/ldItemResourceUrl'; |
43 | import { computed, PropType } from 'vue'; | 46 | import { computed, PropType, toRef } from 'vue'; |
44 | import { useI18n } from 'vue-i18n'; | 47 | import { useI18n } from 'vue-i18n'; |
45 | import ItemThumbnail from '../ItemThumbnail.vue'; | 48 | import ItemThumbnail from '../ItemThumbnail.vue'; |
46 | 49 | ||
@@ -51,11 +54,17 @@ const props = defineProps({ | |||
51 | const { t } = useI18n(); | 54 | const { t } = useI18n(); |
52 | const navigation = useNavigation(); | 55 | const navigation = useNavigation(); |
53 | 56 | ||
54 | const { itemResourceUrl } = useItemResource(props.item); | 57 | const { itemResourceUrl } = useItemResource(toRef(props, 'item')); |
55 | const itemFileName = computed(() => navigation.getFileName(props.item)); | 58 | const itemFileName = computed(() => navigation.getFileName(props.item)); |
56 | </script> | 59 | </script> |
57 | 60 | ||
58 | <style lang="scss" module> | 61 | <style lang="scss" module> |
62 | @import "~@/assets/scss/theme"; | ||
63 | |||
64 | .audiothumb { | ||
65 | color: $text-light; | ||
66 | } | ||
67 | |||
59 | .player { | 68 | .player { |
60 | width: 100%; | 69 | width: 100%; |
61 | max-width: 500px; | 70 | max-width: 500px; |