Fix image lazy loading for Firefox (#3264)

This commit is contained in:
anewuser 2023-12-18 13:20:23 -03:00 committed by GitHub
parent 49d4e58f6e
commit 5781599e9b
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
7 changed files with 8 additions and 8 deletions

View file

@ -2,7 +2,7 @@
<div class="flex flex-col flex-justify-between">
<router-link :to="props.item.url">
<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>
<p>
<span v-text="props.item.name" />

View file

@ -3,10 +3,10 @@
<LoadingIndicatorPage :show-content="channel != null && !channel.error">
<img
loading="lazy"
v-if="channel.bannerUrl"
:src="channel.bannerUrl"
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 place-items-center">

View file

@ -1,11 +1,11 @@
<template>
<div class="comment mt-1.5 flex">
<img
loading="lazy"
:src="comment.thumbnail"
class="comment-avatar h-12 w-12 rounded-full"
height="48"
width="48"
loading="lazy"
alt="Avatar"
/>

View file

@ -2,7 +2,7 @@
<div class="flex flex-col flex-justify-between">
<router-link :to="props.item.url">
<div class="relative">
<img class="w-full" :src="props.item.thumbnail" loading="lazy" />
<img loading="lazy" class="w-full" :src="props.item.thumbnail" />
</div>
<p>
<span v-text="props.item.name" />

View file

@ -9,7 +9,7 @@
<div class="mt-1 flex items-center justify-between">
<div>
<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" />
</router-link>
</div>

View file

@ -13,11 +13,11 @@
>
<div class="w-full">
<img
loading="lazy"
class="aspect-video w-full object-contain"
:src="thumbnail"
:alt="title"
:class="{ 'shorts-img': item.isShort, 'opacity-75': item.watched }"
loading="lazy"
/>
<!-- progress bar -->
<div class="relative h-1 w-full">
@ -61,9 +61,9 @@
<div class="flex">
<router-link :to="item.uploaderUrl">
<img
loading="lazy"
v-if="item.uploaderAvatar"
:src="item.uploaderAvatar"
loading="lazy"
class="mr-0.5 mt-0.5 h-32px w-32px rounded-full"
width="68"
height="68"

View file

@ -73,11 +73,11 @@
<!-- Channel Image & Info -->
<div class="flex items-center">
<img
loading="lazy"
height="48"
width="48"
:src="video.uploaderAvatar"
alt=""
loading="lazy"
class="rounded-full"
/>
<router-link v-if="video.uploaderUrl" class="link ml-1.5" :to="video.uploaderUrl">{{