thibaud-lclr/ltbxd-actorle
1
0
Fork 0
Code Issues 4 Pull Requests Actions Packages Projects Releases Wiki Activity

feat: add navbar with user dropdown and import modal

Browse Source
This commit is contained in:
thibaud-leclere
2026-03-29 10:22:20 +02:00
parent 4f8eb5f3dc
commit a348de01b0
2 changed files with 60 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

59
templates/_navbar.html.twig Normal file
View File

@@ -0,0 +1,59 @@
{% if app.user %}
<nav class="navbar" data-controller="notifications">
<div class="navbar-left">
<a href="{{ path('app_homepage') }}" class="navbar-brand">Actorle</a>
</div>
<div class="navbar-right">
{# Notifications #}
<div class="navbar-item" data-controller="dropdown">
<button class="navbar-icon" data-action="click->dropdown#toggle click->notifications#markRead" data-dropdown-target="trigger">
<svg width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
<path d="M18 8A6 6 0 0 0 6 8c0 7-3 9-3 9h18s-3-2-3-9"/>
<path d="M13.73 21a2 2 0 0 1-3.46 0"/>
</svg>
<span class="badge" data-notifications-target="badge" hidden></span>
</button>
<div class="dropdown-menu" data-dropdown-target="menu" hidden>
<div class="dropdown-header">Notifications</div>
<div data-notifications-target="list" class="notifications-list">
<p class="dropdown-empty">Aucune notification</p>
</div>
</div>
</div>
{# User menu #}
<div class="navbar-item" data-controller="dropdown">
<button class="navbar-icon" data-action="click->dropdown#toggle" data-dropdown-target="trigger">
<svg width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
<path d="M20 21v-2a4 4 0 0 0-4-4H8a4 4 0 0 0-4 4v2"/>
<circle cx="12" cy="7" r="4"/>
</svg>
</button>
<div class="dropdown-menu" data-dropdown-target="menu" hidden>
<button class="dropdown-item" data-action="click->import-modal#open">Importer ses films</button>
<a href="{{ path('app_logout') }}" class="dropdown-item">Se déconnecter</a>
</div>
</div>
</div>
</nav>
{# Import Modal #}
<div class="modal-overlay" data-controller="import-modal" data-import-modal-target="overlay" hidden>
<div class="modal">
<div class="modal-header">
<h2>Importer ses films</h2>
<button class="modal-close" data-action="click->import-modal#close">&times;</button>
</div>
<div class="modal-body">
<p>Importez votre fichier <code>watched.csv</code> exporté depuis Letterboxd.</p>
<input type="file" accept=".csv" data-import-modal-target="fileInput">
<div data-import-modal-target="feedback" class="modal-feedback" hidden></div>
</div>
<div class="modal-footer">
<button class="btn btn-primary" data-action="click->import-modal#submit" data-import-modal-target="submitBtn">
Importer
</button>
</div>
</div>
</div>
{% endif %}

1
templates/base.html.twig
View File

@@ -13,6 +13,7 @@
{% endblock %}
</head>
<body>
{% include '_navbar.html.twig' %}
{% block body %}{% endblock %}
</body>
</html>