Added lazy loading to tag photos. Changed tag thumb location.

This commit is contained in:
2020-04-08 14:50:43 +02:00
parent 24b297011e
commit cb68319ac0
1451 changed files with 324 additions and 414 deletions

View File

@@ -6,13 +6,41 @@
>
<span class="title">{{ tag.name }}</span>
<img
v-if="tag.poster"
:src="sfw ? `/img/${tag.poster.sfw.thumbnail}` : `/img/${tag.poster.thumbnail}`"
:title="sfw ? tag.poster.sfw.comment : tag.poster.comment"
:alt="tag.name"
class="poster"
>
<template v-if="tag.poster">
<img
v-if="!lazy && !sfw"
:src="`/img/${tag.poster.thumbnail}`"
:title="tag.poster.comment"
:alt="tag.name"
class="poster"
>
<img
v-if="!lazy && sfw"
:src="`/img/${tag.poster.sfw.thumbnail}`"
:title="tag.poster.sfw.comment"
:alt="tag.name"
class="poster"
>
<img
v-if="lazy && !sfw"
:data-src="`/img/${tag.poster.thumbnail}`"
:data-loading="`/img/${tag.poster.lazy}`"
:title="tag.poster.comment"
:alt="tag.name"
class="poster"
>
<img
v-if="lazy && sfw"
:data-src="`/img/${tag.poster.sfw.thumbnail}`"
:data-loading="`/img/${tag.poster.sfw.lazy}`"
:title="tag.poster.sfw.comment"
:alt="tag.name"
class="poster"
>
</template>
</router-link>
</template>
@@ -27,6 +55,10 @@ export default {
type: Object,
default: null,
},
lazy: {
type: Boolean,
default: false,
},
},
computed: {
sfw,
@@ -52,7 +84,7 @@ export default {
.poster {
width: 100%;
height: 16rem;
height: 17rem;
object-fit: cover;
object-position: 50% 100%;
}