mirror of
https://github.com/rico-vz/HeimerdingerLoL.git
synced 2025-12-06 10:10:48 +01:00
fix: image loading & syze
This commit is contained in:
@@ -3,14 +3,3 @@ import "flowbite";
|
|||||||
import "./icons";
|
import "./icons";
|
||||||
import "./icons-brands";
|
import "./icons-brands";
|
||||||
import "./icons-duotone";
|
import "./icons-duotone";
|
||||||
|
|
||||||
document.addEventListener("DOMContentLoaded", function () {
|
|
||||||
const images = document.querySelectorAll(".transition-opacity");
|
|
||||||
|
|
||||||
images.forEach((image) => {
|
|
||||||
image.onload = function () {
|
|
||||||
image.style.filter = "blur(0)";
|
|
||||||
image.style.opacity = "1";
|
|
||||||
};
|
|
||||||
});
|
|
||||||
});
|
|
||||||
|
|||||||
@@ -20,8 +20,8 @@
|
|||||||
<div
|
<div
|
||||||
class="mx-4 mt-4 overflow-hidden h-52 rounded-2xl bg-clip-border border-2 border-orange-400/40">
|
class="mx-4 mt-4 overflow-hidden h-52 rounded-2xl bg-clip-border border-2 border-orange-400/40">
|
||||||
<img @if($key < 8) loading="eager" @else loading="lazy" @endif
|
<img @if($key < 8) loading="eager" @else loading="lazy" @endif
|
||||||
src="//wsrv.nl/?url={{ $champion->getChampionImageAttribute() }}&w=400&output=webp&q=70"
|
src="//wsrv.nl/?url={{ $champion->getChampionImageAttribute() }}&w=380&output=webp&q=65"
|
||||||
class="object-cover w-full h-full transition-opacity filter blur-3 opacity-0"
|
class="object-cover w-full h-full"
|
||||||
alt="{{ $champion->name }} Splash Art"
|
alt="{{ $champion->name }} Splash Art"
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
Reference in New Issue
Block a user