mirror of
https://github.com/TeamPiped/Piped.git
synced 2024-11-09 17:58:21 +00:00
Fix image lazy loading for Firefox (#3264)
This commit is contained in:
parent
49d4e58f6e
commit
5781599e9b
@ -2,7 +2,7 @@
|
|||||||
<div class="flex flex-col flex-justify-between">
|
<div class="flex flex-col flex-justify-between">
|
||||||
<router-link :to="props.item.url">
|
<router-link :to="props.item.url">
|
||||||
<div class="my-4 flex justify-center">
|
<div class="my-4 flex justify-center">
|
||||||
<img class="aspect-square w-[50%] rounded-full" :src="props.item.thumbnail" loading="lazy" />
|
<img loading="lazy" class="aspect-square w-[50%] rounded-full" :src="props.item.thumbnail" />
|
||||||
</div>
|
</div>
|
||||||
<p>
|
<p>
|
||||||
<span v-text="props.item.name" />
|
<span v-text="props.item.name" />
|
||||||
|
@ -3,10 +3,10 @@
|
|||||||
|
|
||||||
<LoadingIndicatorPage :show-content="channel != null && !channel.error">
|
<LoadingIndicatorPage :show-content="channel != null && !channel.error">
|
||||||
<img
|
<img
|
||||||
|
loading="lazy"
|
||||||
v-if="channel.bannerUrl"
|
v-if="channel.bannerUrl"
|
||||||
:src="channel.bannerUrl"
|
:src="channel.bannerUrl"
|
||||||
class="h-30 w-full object-cover py-1.5 md:h-50"
|
class="h-30 w-full object-cover py-1.5 md:h-50"
|
||||||
loading="lazy"
|
|
||||||
/>
|
/>
|
||||||
<div class="flex flex-col items-center justify-between md:flex-row">
|
<div class="flex flex-col items-center justify-between md:flex-row">
|
||||||
<div class="flex place-items-center">
|
<div class="flex place-items-center">
|
||||||
|
@ -1,11 +1,11 @@
|
|||||||
<template>
|
<template>
|
||||||
<div class="comment mt-1.5 flex">
|
<div class="comment mt-1.5 flex">
|
||||||
<img
|
<img
|
||||||
|
loading="lazy"
|
||||||
:src="comment.thumbnail"
|
:src="comment.thumbnail"
|
||||||
class="comment-avatar h-12 w-12 rounded-full"
|
class="comment-avatar h-12 w-12 rounded-full"
|
||||||
height="48"
|
height="48"
|
||||||
width="48"
|
width="48"
|
||||||
loading="lazy"
|
|
||||||
alt="Avatar"
|
alt="Avatar"
|
||||||
/>
|
/>
|
||||||
|
|
||||||
|
@ -2,7 +2,7 @@
|
|||||||
<div class="flex flex-col flex-justify-between">
|
<div class="flex flex-col flex-justify-between">
|
||||||
<router-link :to="props.item.url">
|
<router-link :to="props.item.url">
|
||||||
<div class="relative">
|
<div class="relative">
|
||||||
<img class="w-full" :src="props.item.thumbnail" loading="lazy" />
|
<img loading="lazy" class="w-full" :src="props.item.thumbnail" />
|
||||||
</div>
|
</div>
|
||||||
<p>
|
<p>
|
||||||
<span v-text="props.item.name" />
|
<span v-text="props.item.name" />
|
||||||
|
@ -9,7 +9,7 @@
|
|||||||
<div class="mt-1 flex items-center justify-between">
|
<div class="mt-1 flex items-center justify-between">
|
||||||
<div>
|
<div>
|
||||||
<router-link class="link flex items-center gap-3" :to="playlist.uploaderUrl || '/'">
|
<router-link class="link flex items-center gap-3" :to="playlist.uploaderUrl || '/'">
|
||||||
<img :src="playlist.uploaderAvatar" loading="lazy" class="rounded-full" />
|
<img loading="lazy" :src="playlist.uploaderAvatar" class="rounded-full" />
|
||||||
<strong v-text="playlist.uploader" />
|
<strong v-text="playlist.uploader" />
|
||||||
</router-link>
|
</router-link>
|
||||||
</div>
|
</div>
|
||||||
|
@ -13,11 +13,11 @@
|
|||||||
>
|
>
|
||||||
<div class="w-full">
|
<div class="w-full">
|
||||||
<img
|
<img
|
||||||
|
loading="lazy"
|
||||||
class="aspect-video w-full object-contain"
|
class="aspect-video w-full object-contain"
|
||||||
:src="thumbnail"
|
:src="thumbnail"
|
||||||
:alt="title"
|
:alt="title"
|
||||||
:class="{ 'shorts-img': item.isShort, 'opacity-75': item.watched }"
|
:class="{ 'shorts-img': item.isShort, 'opacity-75': item.watched }"
|
||||||
loading="lazy"
|
|
||||||
/>
|
/>
|
||||||
<!-- progress bar -->
|
<!-- progress bar -->
|
||||||
<div class="relative h-1 w-full">
|
<div class="relative h-1 w-full">
|
||||||
@ -61,9 +61,9 @@
|
|||||||
<div class="flex">
|
<div class="flex">
|
||||||
<router-link :to="item.uploaderUrl">
|
<router-link :to="item.uploaderUrl">
|
||||||
<img
|
<img
|
||||||
|
loading="lazy"
|
||||||
v-if="item.uploaderAvatar"
|
v-if="item.uploaderAvatar"
|
||||||
:src="item.uploaderAvatar"
|
:src="item.uploaderAvatar"
|
||||||
loading="lazy"
|
|
||||||
class="mr-0.5 mt-0.5 h-32px w-32px rounded-full"
|
class="mr-0.5 mt-0.5 h-32px w-32px rounded-full"
|
||||||
width="68"
|
width="68"
|
||||||
height="68"
|
height="68"
|
||||||
|
@ -73,11 +73,11 @@
|
|||||||
<!-- Channel Image & Info -->
|
<!-- Channel Image & Info -->
|
||||||
<div class="flex items-center">
|
<div class="flex items-center">
|
||||||
<img
|
<img
|
||||||
|
loading="lazy"
|
||||||
height="48"
|
height="48"
|
||||||
width="48"
|
width="48"
|
||||||
:src="video.uploaderAvatar"
|
:src="video.uploaderAvatar"
|
||||||
alt=""
|
alt=""
|
||||||
loading="lazy"
|
|
||||||
class="rounded-full"
|
class="rounded-full"
|
||||||
/>
|
/>
|
||||||
<router-link v-if="video.uploaderUrl" class="link ml-1.5" :to="video.uploaderUrl">{{
|
<router-link v-if="video.uploaderUrl" class="link ml-1.5" :to="video.uploaderUrl">{{
|
||||||
|
Loading…
Reference in New Issue
Block a user