- début refonte graphique

- début MangaDbProvider
This commit is contained in:
Jérémy Guillot
2024-06-05 00:05:28 +02:00
parent 2f9ff7facb
commit 9595831aa3
23 changed files with 607 additions and 515 deletions

View File

@@ -1,10 +1,10 @@
<!-- Menu latéral -->
<header class="fixed top-0 left-0 z-10 w-full bg-blue-600 p-4 md:hidden">
<button id="hamburger-button" class="text-white">
<i class="fas fa-bars"></i>
</button>
</header>
{#<header class="fixed top-0 left-0 z-10 w-full bg-blue-600 p-4 md:hidden">#}
{# <button id="hamburger-button" class="text-white">#}
{# <i class="fas fa-bars"></i>#}
{# </button>#}
{#</header>#}
<aside id="menu" class="fixed top-0 left-0 z-10 h-full w-64 bg-gray-800 text-white p-4 hidden md:block">
<div id="menu" class="fixed left-0 h-full w-60 bg-gray-600 text-white hidden md:block">
{{ render(controller('App\\Controller\\MenuController::menu')) }}
</aside>
</div>

View File

@@ -1,35 +1,32 @@
<div class="fixed top-0 left-0 h-screen w-64 bg-gray-100 p-6">
<h2 class="text-xl font-bold mb-4">Menu</h2>
<form>
<div class="form-group">
<label for="manga-select">Choisissez un manga :</label>
<select id="manga-select" class="form-control w-full">
<option value="" selected disabled>Sélectionnez un manga</option>
{% for manga in availableManga %}
<option value="{{ path('manga_show', { 'mangaSlug': manga.slug }) }}">{{ manga.name }}</option>
{% endfor %}
</select>
</div>
</form>
<div>
<ul>
{% for manga in mangas %}
<li class="my-2">
<a href="{{ path('manga_show', { 'mangaSlug': manga.slug }) }}" class="text-blue-600 hover:text-blue-800">
{{ manga.title }}
</a>
<div id="menu" class="fixed left-0 h-full w-60 bg-gray-600 text-white hidden md:block">
<aside class="h-full">
<nav>
<ul>
<li class="mb-4 border-l-4 border-green-600">
<div class="flex pl-8 p-4 items-center text-green-600 bg-gray-800">
<i class="fas fa-book mr-2"></i>
<span>Mangas</span>
</div>
<ul class="ml-14 mt-2 space-y-4">
<li><a href="{{ path('add_new_manga') }}" class="hover:text-green-600">Ajouter un nouveau</a></li>
<li><a href="#" class="hover:text-green-600">Import bibliothèque</a></li>
<li><a href="#" class="hover:text-green-600">Collections</a></li>
<li><a href="#" class="hover:text-green-600">Découvrir</a></li>
</ul>
</li>
{% endfor %}
</ul>
</div>
<li class="mb-4 pl-8 flex items-center hover:text-green-600">
<i class="fas fa-calendar-alt mr-2"></i>
<span>Calendrier</span>
</li>
<li class="mb-4 pl-8 flex items-center hover:text-green-600">
<i class="fas fa-cog mr-2"></i>
<span>Paramètres</span>
</li>
<li class="mb-4 pl-8 flex items-center hover:text-green-600">
<i class="fas fa-desktop mr-2"></i>
<span>Système</span>
</li>
</ul>
</nav>
</aside>
</div>
{% block javascripts %}
<script>
const mangaSelect = document.getElementById('manga-select');
mangaSelect.addEventListener('change', () => {
const selectedUrl = mangaSelect.options[mangaSelect.selectedIndex].value;
window.open(selectedUrl, '_top');
});
</script>
{% endblock %}

View File

@@ -0,0 +1,35 @@
<div class="fixed left-0 h-screen w-60">
<h2 class="text-xl font-bold mb-4">Menu</h2>
<form>
<div class="form-group">
<label for="manga-select">Choisissez un manga :</label>
<select id="manga-select" class="form-control w-full">
<option value="" selected disabled>Sélectionnez un manga</option>
{% for manga in availableManga %}
<option value="{{ path('manga_show', { 'mangaSlug': manga.slug }) }}">{{ manga.name }}</option>
{% endfor %}
</select>
</div>
</form>
<div>
<ul>
{% for manga in mangas %}
<li class="my-2">
<a href="{{ path('manga_show', { 'mangaSlug': manga.slug }) }}" class="text-blue-600 hover:text-blue-800">
{{ manga.title }}
</a>
</li>
{% endfor %}
</ul>
</div>
</div>
{% block javascripts %}
<script>
const mangaSelect = document.getElementById('manga-select');
mangaSelect.addEventListener('change', () => {
const selectedUrl = mangaSelect.options[mangaSelect.selectedIndex].value;
window.open(selectedUrl, '_top');
});
</script>
{% endblock %}