32 lines
1.6 KiB
Twig
32 lines
1.6 KiB
Twig
{% extends 'base.html.twig' %}
|
|
|
|
{% block title %}{{ manga.title }} - Chapitre {{ chapter.number }}{% endblock %}
|
|
|
|
{% block body %}
|
|
<div class="w-full mx-auto p-4" {{ stimulus_controller('reader', {
|
|
mangaSlug: manga.slug,
|
|
chapterNumber: chapter.number,
|
|
totalPages: totalPages
|
|
}) }}>
|
|
<h1 class="text-center text-3xl my-4">{{ manga.title }} - Chapitre {{ chapter.number }}</h1>
|
|
|
|
<div class="flex justify-center my-4">
|
|
<button class="bg-blue-500 text-white px-4 py-2 rounded hover:bg-blue-600 mr-4" data-action="reader#previousChapter">« Chapitre précédent</button>
|
|
<select class="px-4 py-2 rounded" data-action="reader#changeChapter" data-reader-target="chapterSelect"></select>
|
|
<button class="bg-blue-500 text-white px-4 py-2 rounded hover:bg-blue-600 ml-4" data-action="reader#nextChapter">Chapitre suivant »</button>
|
|
</div>
|
|
|
|
<div class="flex justify-center my-4">
|
|
<button class="bg-green-500 text-white px-4 py-2 rounded hover:bg-green-600 mr-4" data-action="reader#toggleReadingMode" data-reader-target="readingModeButton">Passer en mode vertical</button>
|
|
</div>
|
|
|
|
<div class="page-container flex flex-col items-center min-h-[80vh]" data-reader-target="pageContainer">
|
|
<!-- Les pages seront injectées ici par le JavaScript -->
|
|
</div>
|
|
|
|
<div class="text-center mt-4" data-reader-target="pageInfo">
|
|
Page <span data-reader-target="currentPage">1</span> sur {{ totalPages }}
|
|
</div>
|
|
</div>
|
|
{% endblock %}
|