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

refactor(icons): improve code readability and formatting

Browse Source 
- Reorganized the HTML structure for better readability.
- Fixed indentation and spacing inconsistencies.
- Added missing newline after PHP opening tag.
- Updated class names to follow consistent naming conventions.
- Wrapped icon titles in anchor tags for improved accessibility.
This commit is contained in:
Rico van Zelst
2024-02-16 01:57:48 +01:00
parent a48ea6e42f
commit f1ada2fb01
1 changed files with 21 additions and 22 deletions
Download Patch File Download Diff File Expand all files Collapse all files

39
resources/views/components/icons/list_all.blade.php
View File

@@ -1,44 +1,43 @@
<?php
/** @var App\Models\SummonerIcon $icon */ ?>
/** @var App\Models\SummonerIcon $icon */
?>
<section class="max-w-screen-xl mx-auto mt-12">
<h1
class="text-3xl font-bold text-center text-transparent uppercase sm:text-4xl
bg-gradient-to-bl from-orange-300 to-orange-500 bg-clip-text">
class="text-3xl font-bold text-center text-transparent uppercase sm:text-4xl bg-gradient-to-bl from-orange-300 to-orange-500 bg-clip-text">
Summoner Icons</h1>
<x-icons.searchbar/>
<x-icons.searchbar />
<div class="container mx-auto p-4 flex items-center justify-center mt-3">
<div class="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-6 gap-12">
<div class="container flex items-center justify-center p-4 mx-auto mt-3">
<div class="grid grid-cols-2 gap-12 md:grid-cols-3 lg:grid-cols-6">
@foreach($icons as $key => $icon)
@foreach ($icons as $key => $icon)
<div
class="champ-card flex flex-col text-gray-700 bg-stone-800/40 shadow-md rounded-2xl bg-clip-border
border border-stone-800 hover:border-orange-500/10 hover:shadow-orange-500/10 items-center">
class="flex flex-col items-center text-gray-700 border shadow-md champ-card bg-stone-800/40 rounded-2xl bg-clip-border border-stone-800 hover:border-orange-500/10 hover:shadow-orange-500/10">
<div
class="mx-4 overflow-hidden h-24 w-24 rounded-2xl bg-clip-border border-2 border-orange-400/40 mt-3">
<img @if($key < 8) loading="eager" @else loading="lazy" @endif
class="w-24 h-24 mx-4 mt-3 overflow-hidden border-2 rounded-2xl bg-clip-border border-orange-400/40">
<a href="/icon/{{ $icon->slug }}">
<img @if ($key < 8) loading="eager" @else loading="lazy" @endif
src="//wsrv.nl/?url={{ $icon->image }}&w=200&output=webp&q=50&il&default=ssl:wsrv.nl%2F%3Furl%3Dhttps://i.ibb.co/5s6YyvN/aaaa.png"
class="object-cover w-full h-full "
alt="{{ $icon->title }} Icon"
/>
class="object-cover w-full h-full " alt="{{ $icon->title }} Icon" /></a>
</div>
<div class="px-4 py-2">
<div class="flex items-center justify-between">
<p class="block text-sm antialiased font-medium text-gray-100 text-center">
<p class="block text-sm antialiased font-medium text-center text-gray-100">
<a href="/icon/{{ $icon->slug }}">
{{ $icon->title }}
</a>
</p>
</div>
</div>
<div
class="mb-2 px-4 flex justify-center items-end text-white text-2xl md:text-lg mt-auto">
<p class="font-medium text-sm hover:text-orange-400 "><a
href="/icon/{{$icon->slug}}">More details
<x-iconsax-bul-arrow-circle-right class="inline-block w-6"/>
<div class="flex items-end justify-center px-4 mt-auto mb-2 text-2xl text-white md:text-lg">
<p class="text-sm font-medium hover:text-orange-400 "><a href="/icon/{{ $icon->slug }}">More
details
<x-iconsax-bul-arrow-circle-right class="inline-block w-6" />
</a>
</p>
</div>