Archive/HeimerdingerLoL
1
0
Fork 0
mirror of https://github.com/rico-vz/HeimerdingerLoL.git synced 2025-12-06 18:20:48 +01:00
Code Issues Actions Packages Projects Releases Wiki Activity

feat(skin-info): optimize splash loading

Browse Source
This commit is contained in:
Rico van Zelst
2025-05-15 11:44:35 +02:00
parent 09b212b9a0
commit f72121861b
1 changed files with 9 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files

12
resources/views/components/skins/grid_info.blade.php
View File

@@ -29,9 +29,15 @@
<!-- Splash Art -->
<div class="relative w-full h-full">
<img src="//wsrv.nl/?url={{ $skin->getSkinImageAttribute(true) }}&w=1200&output=webp&q=90&h=350&fit=cover"
alt="{{ $skin->skin_name }} Splash Art"
class="z-10 object-cover w-full h-full transition-transform duration-700 transform scale-100">
<img src="//wsrv.nl/?url={{ $skin->getSkinImageAttribute(true) }}&w=30&h=20&fit=cover&blur=5&output=webp"
class="absolute inset-0 object-cover w-full h-full blur-sm" alt="{{ $skin->skin_name }} Loading" />
<img src="//wsrv.nl/?url={{ $skin->getSkinImageAttribute(true) }}&w=800&h=350&fit=cover&output=webp&q=85"
srcset="//wsrv.nl/?url={{ $skin->getSkinImageAttribute(true) }}&w=480&h=350&fit=cover&output=webp&q=85 480w,
//wsrv.nl/?url={{ $skin->getSkinImageAttribute(true) }}&w=800&h=350&fit=cover&output=webp&q=85 800w,
//wsrv.nl/?url={{ $skin->getSkinImageAttribute(true) }}&w=1200&h=350&fit=cover&output=webp&q=90 1200w"
sizes="(max-width: 600px) 480px, (max-width: 1024px) 800px, 1200px"
class="z-10 object-cover w-full h-full transition-transform duration-700 transform scale-100"
alt="{{ $skin->skin_name }} Splash Art" loading="eager" />
<!-- Gradient Overlay for Text Readability -->
<div class="absolute inset-0 bg-gradient-to-t from-stone-900/90 via-stone-900/40 to-transparent"></div>