41 lines
1.8 KiB
Twig
41 lines
1.8 KiB
Twig
<div {{ attributes }}>
|
|
{% component BootstrapModal with {id: 'mangaModal' ~ index ~ '-' ~ manga.slug } %}
|
|
{% block modal_header %}
|
|
<div class="flex justify-between">
|
|
<h5 class="modal-title text-lg font-bold">{{ manga.title }} <span
|
|
class="text-md font-normal text-gray-500">({{ manga.publicationYear }})</span></h5>
|
|
<button type="button" class="btn-close text-black hover:text-gray-500"
|
|
data-bs-dismiss="modal" aria-label="Close">
|
|
<i class="fas fa-times"></i>
|
|
</button>
|
|
</div>
|
|
{% endblock %}
|
|
{% block modal_body %}
|
|
<form id="{{ 'form' ~ index }}" data-action="live#action:prevent" data-live-action-param="saveManga">
|
|
<div class="flex justify-between">
|
|
<img src="{{ manga.imageUrl ?? 'https://placehold.co/150x220' }}"
|
|
alt="{{ manga.title }}"
|
|
class="img-fluid mb-2"
|
|
style="width: 150px; height: 220px;"
|
|
>
|
|
<div class="ml-4">
|
|
<p>{{ manga.description }}</p>
|
|
<p><strong>Année de publication:</strong> {{ manga.publicationYear }}</p>
|
|
<p><strong>Genres:</strong> {{ manga.genres|join(', ') }}</p>
|
|
<p><strong>Note:</strong> {{ manga.rating }}</p>
|
|
</div>
|
|
</div>
|
|
</form>
|
|
{% endblock %}
|
|
|
|
{% block modal_footer %}
|
|
<button
|
|
type="submit"
|
|
form="{{ 'form' ~ index }}"
|
|
class="bg-green-500 hover:bg-green-600 text-sm text-white font-bold py-2 px-4 rounded">
|
|
Add {{ manga.title }}
|
|
</button>
|
|
{% endblock %}
|
|
{% endcomponent %}
|
|
</div>
|