diff options
Diffstat (limited to 'viewer/src/views/GalleryThumbnail.vue')
-rw-r--r-- | viewer/src/views/GalleryThumbnail.vue | 23 |
1 files changed, 23 insertions, 0 deletions
diff --git a/viewer/src/views/GalleryThumbnail.vue b/viewer/src/views/GalleryThumbnail.vue new file mode 100644 index 0000000..8e3e826 --- /dev/null +++ b/viewer/src/views/GalleryThumbnail.vue | |||
@@ -0,0 +1,23 @@ | |||
1 | <template> | ||
2 | <img class="thumbnail" :src="imageSrc" :title="item.path" /> | ||
3 | </template> | ||
4 | |||
5 | <script lang="ts"> | ||
6 | import { Component, Vue, Prop } from "vue-property-decorator"; | ||
7 | |||
8 | @Component | ||
9 | export default class GalleryThumbnail extends Vue { | ||
10 | @Prop({ required: true }) readonly item!: Gallery.Item; | ||
11 | |||
12 | get imageSrc() { | ||
13 | return `/gallery${this.item.thumbnail.path}`; | ||
14 | } | ||
15 | } | ||
16 | </script> | ||
17 | |||
18 | <style lang="scss"> | ||
19 | .thumbnail { | ||
20 | max-width: 250px; | ||
21 | max-height: 250px; | ||
22 | } | ||
23 | </style> | ||