Added lazy loading to tag photos. Changed tag thumb location.
This commit is contained in:
@@ -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%;
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user