colgora/Mangarr
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

- trop de trucs d'un coup... je vais faire attention ensuite ^^'

Browse Source
This commit is contained in:
Jérémy Guillot
2024-06-10 13:57:50 +02:00
parent 9595831aa3
commit c46e1a0a5c
69 changed files with 4004 additions and 385 deletions
Download Patch File Download Diff File Expand all files Collapse all files

65
templates/components/MangaSearch.html.twig Normal file
View File

@@ -0,0 +1,65 @@
{# templates/components/MangaSearch.html.twig #}
<div {{ attributes }}>
<div class="w-full mx-auto">
<div data-controller="search">
<div class="flex items-center border border-gray-300 rounded bg-white">
<span class="flex items-center justify-center w-10 h-10 text-gray-500">
<i class="fas fa-search"></i>
</span>
<input data-search-target="input"
data-model="debounce(500)|query" type="text"
placeholder="eg. Naruto, Bleach, One Piece"
class="w-full py-2 px-3 bg-green-50 border-none focus:outline-none focus:bg-white focus:border focus:border-green-200">
<button data-action="click->search#clearSearch"
class="flex items-center justify-center w-10 h-10 text-gray-500 hover:bg-gray-200">
<i class="fas fa-times"></i>
</button>
</div>
</div>
</div>
{% if this.mangas %}
<div data-loading="addClass(opacity-50)" class="mt-3">
{% for manga in this.mangas %}
<div class="flex w-full bg-white shadow-lg mb-8 hover:bg-green-50" data-bs-toggle="modal"
data-bs-target="#mangaModal{{ loop.index }}-{{ manga.slug }}">
<a href="#" class="flex-none w-48 relative">
<img src="{{ manga.imageUrl ?? 'https://placehold.co/150x220' }}" alt="{{ manga.title }}"
class="w-full h-full -z-10 object-cover" style="width: 150px; height: 220px;">
</a>
<div class="w-full p-4 flex flex-col justify-between leading-normal">
<div class="mb-2">
<div class="flex w-full text-xl font-bold text-gray-900 mb-4 items-center justify-between">
<div class="flex items-center">
<span>{{ manga.title }}</span>
<span class="text-2xl text-gray-500 ml-2">({{ manga.publicationYear }})</span>
</div>
<a href="{{ path('manga_show', { 'mangaSlug': manga.slug }) }}"
class="text-gray-400 hover:text-gray-500">
<i class="fas fa-external-link-alt"></i>
</a>
</div>
{% for genre in manga.genres %}
<span
class="bg-gray-200 text-gray-800 text-xs font-semibold mr-2 px-2.5 py-0.5 rounded">
{{ genre }}
</span>
{% endfor %}
</div>
<div class="mb-2">
<p class="text-gray-700 text-sm">{{ manga.description|truncate(250) }}</p>
</div>
<div class="flex items-center">
<span class="text-gray-600 text-sm mr-2">
<i class="fas fa-star text-yellow-500"></i>
{{ manga.rating }}
</span>
</div>
</div>
</div>
{{ component('NewMangaForm', {manga: manga, index: loop.index}) }}
{% endfor %}
</div>
{% endif %}
</div>