summaryrefslogtreecommitdiff
path: root/src/web/app/common/views/components/images.vue
diff options
context:
space:
mode:
Diffstat (limited to 'src/web/app/common/views/components/images.vue')
-rw-r--r--src/web/app/common/views/components/images.vue63
1 files changed, 0 insertions, 63 deletions
diff --git a/src/web/app/common/views/components/images.vue b/src/web/app/common/views/components/images.vue
deleted file mode 100644
index dc802a0180..0000000000
--- a/src/web/app/common/views/components/images.vue
+++ /dev/null
@@ -1,63 +0,0 @@
-<template>
-<div class="mk-images">
- <mk-images-image v-for="image in images" ref="image" :image="image" :key="image.id"/>
-</div>
-</template>
-
-<script lang="ts">
-import Vue from 'vue';
-
-export default Vue.extend({
- props: ['images'],
- mounted() {
- const tags = this.$refs.image as Vue[];
-
- if (this.images.length == 1) {
- (this.$el.style as any).gridTemplateRows = '1fr';
-
- (tags[0].$el.style as any).gridColumn = '1 / 2';
- (tags[0].$el.style as any).gridRow = '1 / 2';
- } else if (this.images.length == 2) {
- (this.$el.style as any).gridTemplateColumns = '1fr 1fr';
- (this.$el.style as any).gridTemplateRows = '1fr';
-
- (tags[0].$el.style as any).gridColumn = '1 / 2';
- (tags[0].$el.style as any).gridRow = '1 / 2';
- (tags[1].$el.style as any).gridColumn = '2 / 3';
- (tags[1].$el.style as any).gridRow = '1 / 2';
- } else if (this.images.length == 3) {
- (this.$el.style as any).gridTemplateColumns = '1fr 0.5fr';
- (this.$el.style as any).gridTemplateRows = '1fr 1fr';
-
- (tags[0].$el.style as any).gridColumn = '1 / 2';
- (tags[0].$el.style as any).gridRow = '1 / 3';
- (tags[1].$el.style as any).gridColumn = '2 / 3';
- (tags[1].$el.style as any).gridRow = '1 / 2';
- (tags[2].$el.style as any).gridColumn = '2 / 3';
- (tags[2].$el.style as any).gridRow = '2 / 3';
- } else if (this.images.length == 4) {
- (this.$el.style as any).gridTemplateColumns = '1fr 1fr';
- (this.$el.style as any).gridTemplateRows = '1fr 1fr';
-
- (tags[0].$el.style as any).gridColumn = '1 / 2';
- (tags[0].$el.style as any).gridRow = '1 / 2';
- (tags[1].$el.style as any).gridColumn = '2 / 3';
- (tags[1].$el.style as any).gridRow = '1 / 2';
- (tags[2].$el.style as any).gridColumn = '1 / 2';
- (tags[2].$el.style as any).gridRow = '2 / 3';
- (tags[3].$el.style as any).gridColumn = '2 / 3';
- (tags[3].$el.style as any).gridRow = '2 / 3';
- }
- }
-});
-</script>
-
-<style lang="stylus" scoped>
-.mk-images
- display grid
- grid-gap 4px
- height 256px
-
- @media (max-width 500px)
- height 192px
-</style>