Added:
- fix progressbar
- {slug} {chapterNumber} in Url
- activity toolbar
This commit is contained in:
@@ -5,12 +5,12 @@
|
||||
{% endif %}
|
||||
{% endblock %}
|
||||
{% block body %}
|
||||
<div class="container mx-auto">
|
||||
<div class="container mx-auto mt-8 p-2">
|
||||
<div class="bg-white overflow-hidden">
|
||||
<div class="overflow-x-auto">
|
||||
<table class="min-w-full bg-white">
|
||||
<thead>
|
||||
<tr class="bg-gray-800 text-white">
|
||||
<tr class="bg-gray-200 text-gray-800">
|
||||
<th class="w-1/12 py-3 px-4 text-left">
|
||||
<input type="checkbox" class="form-checkbox h-5 w-5 text-green-600">
|
||||
</th>
|
||||
@@ -18,14 +18,13 @@
|
||||
<th class="w-1/12 py-3 px-4 text-left">Volume</th>
|
||||
<th class="w-3/12 py-3 px-4 text-left">Chapitre</th>
|
||||
<th class="w-3/12 py-3 px-4 text-left">Titre</th>
|
||||
<th class="w-3/12 py-3 px-4 text-left">Progress</th>
|
||||
<th class="w-2/12 py-3 px-4 text-left">Actions</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody class="text-gray-700">
|
||||
{% for manga in status %}
|
||||
<tr class="border-b border-gray-200 hover:bg-gray-50 transition duration-150 ease-in-out"
|
||||
data-controller="chapter-progress"
|
||||
data-chapter-progress-chapter-id-value="{{ manga.chapterId }}">
|
||||
<tr class="border-b border-gray-200 hover:bg-gray-50 transition duration-150 ease-in-out">
|
||||
<td class="py-4 px-4 text-center">
|
||||
<input type="checkbox" class="form-checkbox h-5 w-5 text-green-600">
|
||||
</td>
|
||||
@@ -33,15 +32,21 @@
|
||||
<td class="py-4 px-4">{{ manga.volume }}</td>
|
||||
<td class="py-4 px-4">
|
||||
{{ manga.chapter }}
|
||||
<div class="mt-2 hidden" data-chapter-progress-target="progressBar">
|
||||
<div class="bg-gray-200 rounded-full h-2.5 dark:bg-gray-700">
|
||||
<div class="bg-green-600 h-2.5 rounded-full" style="width: 0"></div>
|
||||
</div>
|
||||
<div class="text-xs mt-1 text-center" data-chapter-progress-target="progressText">
|
||||
|
||||
</td>
|
||||
<td class="py-4 px-4">{{ manga.title }}</td>
|
||||
<td class="py-4 px-4">
|
||||
<div class="mt-2"
|
||||
data-controller="chapter-progress"
|
||||
data-chapter-progress-chapter-id-value="{{ manga.chapterId }}">
|
||||
<div class="relative bg-gray-200 rounded-full h-6 overflow-hidden">
|
||||
<div data-chapter-progress-target="progressBar" class="absolute top-0 left-0 h-full bg-green-400 transition-all duration-300 ease-out" style="width: 0%"></div>
|
||||
<div class="absolute inset-0 flex items-center justify-center text-xs font-semibold text-white" data-chapter-progress-target="progressText">
|
||||
0 / 0
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</td>
|
||||
<td class="py-4 px-4">{{ manga.title }}</td>
|
||||
<td class="py-4 px-4">
|
||||
<button class="text-red-500 hover:text-red-700 transition duration-150 ease-in-out">
|
||||
<i class="fas fa-trash-alt"></i>
|
||||
|
||||
@@ -48,7 +48,8 @@
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<turbo-frame id="chapter_list" src="{{ fragment_uri(controller('App\\Controller\\MangaController::_chaptersByManga', {'id': manga.id})) }}"></turbo-frame>
|
||||
<turbo-frame id="chapter_list"
|
||||
src="{{ fragment_uri(controller('App\\Controller\\MangaController::_chaptersByManga', {'id': manga.id})) }}"></turbo-frame>
|
||||
{# Modal d'édition #}
|
||||
<twig:Modal
|
||||
openTrigger="openEditModal"
|
||||
@@ -96,12 +97,13 @@
|
||||
</p>
|
||||
</twig:block>
|
||||
<twig:block name="footer">
|
||||
<form id="deleteForm" method="post" action="">
|
||||
<button type="submit"
|
||||
class="w-full inline-flex justify-center rounded-md border border-transparent shadow-sm px-4 py-2 bg-red-600 text-base font-medium text-white hover:bg-red-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-red-500 sm:ml-3 sm:w-auto sm:text-sm">
|
||||
Delete
|
||||
</button>
|
||||
</form>
|
||||
<button
|
||||
{{ stimulus_controller('toolbar', { mangaId: manga.id }) }}
|
||||
{{ stimulus_action('toolbar', 'confirmDelete') }}
|
||||
type="button"
|
||||
class="w-full inline-flex justify-center rounded-md border border-transparent shadow-sm px-4 py-2 bg-red-600 text-base font-medium text-white hover:bg-red-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-red-500 sm:ml-3 sm:w-auto sm:text-sm">
|
||||
Delete
|
||||
</button>
|
||||
<button type="button" data-action="modal#close"
|
||||
class="mt-3 w-full inline-flex justify-center rounded-md border border-gray-300 shadow-sm px-4 py-2 bg-white text-base font-medium text-gray-700 hover:bg-gray-50 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-indigo-500 sm:mt-0 sm:ml-3 sm:w-auto sm:text-sm">
|
||||
Cancel
|
||||
|
||||
Reference in New Issue
Block a user