67 lines
3.5 KiB
Twig
67 lines
3.5 KiB
Twig
{% extends 'base.html.twig' %}
|
|
{% block toolbar %}
|
|
{% if toolbar is defined %}
|
|
<twig:Toolbar toolbar="{{ toolbar }}"/>
|
|
{% endif %}
|
|
{% endblock %}
|
|
{% block body %}
|
|
<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-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>
|
|
<th class="w-2/12 py-3 px-4 text-left">Manga</th>
|
|
<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">
|
|
<td class="py-4 px-4 text-center">
|
|
<input type="checkbox" class="form-checkbox h-5 w-5 text-green-600">
|
|
</td>
|
|
<td class="py-4 px-4 font-medium">{{ manga.manga }}</td>
|
|
<td class="py-4 px-4">{{ manga.volume }}</td>
|
|
<td class="py-4 px-4">
|
|
{{ manga.chapter }}
|
|
|
|
</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">
|
|
<button class="text-red-500 hover:text-red-700 transition duration-150 ease-in-out">
|
|
<i class="fas fa-trash-alt"></i>
|
|
</button>
|
|
</td>
|
|
</tr>
|
|
{% else %}
|
|
<tr>
|
|
<td colspan="6" class="py-4 px-4 text-center text-gray-500">Aucune activité en cours.</td>
|
|
</tr>
|
|
{% endfor %}
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
{% endblock %}
|