52 lines
2.2 KiB
Text
52 lines
2.2 KiB
Text
<section class="new">
|
|
<form method="post" action="/ui/todos">
|
|
<input type="text" name="title" placeholder="Nouvelle tâche..." required />
|
|
<button type="submit">Ajouter</button>
|
|
</form>
|
|
</section>
|
|
|
|
<section class="list">
|
|
<% if (todos.length === 0) { %>
|
|
<p>Aucune tâche pour le moment.</p>
|
|
<% } else { %>
|
|
<ul>
|
|
<% todos.forEach(function(t) { %>
|
|
<li>
|
|
<form method="post" action="/ui/todos/<%= t.id %>/toggle" style="display:inline;">
|
|
<button title="Basculer" class="toggle-btn">
|
|
<% if (t.completed) { %>
|
|
<!-- Icône coche remplie -->
|
|
<svg width="20" height="20" viewBox="0 0 20 20" fill="#4CAF50" xmlns="http://www.w3.org/2000/svg">
|
|
<circle cx="10" cy="10" r="10" fill="#4CAF50"/>
|
|
<polyline points="6,11 9,14 14,7" fill="none" stroke="#fff" stroke-width="2"/>
|
|
</svg>
|
|
<% } else { %>
|
|
<!-- Icône cercle vide -->
|
|
<svg width="20" height="20" viewBox="0 0 20 20" fill="none" stroke="#bbb" stroke-width="2" xmlns="http://www.w3.org/2000/svg">
|
|
<circle cx="10" cy="10" r="9"/>
|
|
</svg>
|
|
<% } %>
|
|
</button>
|
|
</form>
|
|
<div class="<%= t.completed ? 'done' : '' %>">
|
|
<span><%= t.title %></span>
|
|
<div class="todo-meta">
|
|
<small>#<%= t.id %> — <%= t.created_at %></small>
|
|
</div>
|
|
</div>
|
|
<form method="post" action="/ui/todos/<%= t.id %>/delete" style="display:inline;">
|
|
<button class="delete-btn" title="Supprimer">
|
|
<!-- Icône poubelle moderne -->
|
|
<svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="#e74c3c" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
|
|
<polyline points="3 6 5 6 21 6"/>
|
|
<path d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6m3 0V4a2 2 0 0 1 2-2h2a2 2 0 0 1 2 2v2"/>
|
|
<line x1="10" y1="11" x2="10" y2="17"/>
|
|
<line x1="14" y1="11" x2="14" y2="17"/>
|
|
</svg>
|
|
</button>
|
|
</form>
|
|
</li>
|
|
<% }); %>
|
|
</ul>
|
|
<% } %>
|
|
</section>
|