Filterbereich entfernt, Suche + Aktionen als Toolbar zusammengefasst
- Monat/Jahr-Filter geloescht (Server-Filter bleibt via URL nutzbar) - Suchfeld und die Buttons 'PDF Export' und 'Bewerbung hinzufuegen' in einer gemeinsamen Toolbar zusammengefasst, als Pill-Buttons - Tote filterForm-CSS und -JS entfernt Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
Claude
+23
-76
@@ -7,9 +7,9 @@
|
||||
<%- include('partials/header') %>
|
||||
|
||||
<main class="flex-1 container mx-auto px-4 py-8">
|
||||
<!-- Search -->
|
||||
<div class="flex justify-center mb-8">
|
||||
<div class="relative w-full max-w-xl">
|
||||
<!-- Toolbar: search + actions -->
|
||||
<div class="flex flex-col gap-3 mb-8 sm:flex-row sm:items-center">
|
||||
<div class="relative flex-1">
|
||||
<svg class="absolute left-4 top-1/2 -translate-y-1/2 w-5 h-5 text-gray-400 dark:text-gray-500 pointer-events-none" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M21 21l-6-6m2-5a7 7 0 11-14 0 7 7 0 0114 0z"></path>
|
||||
</svg>
|
||||
@@ -20,80 +20,27 @@
|
||||
<svg class="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12"></path></svg>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Filter Section -->
|
||||
<div class="bg-white dark:bg-gray-800 rounded-lg shadow-md p-6 mb-8">
|
||||
<h2 class="text-lg font-semibold text-gray-800 dark:text-white mb-4">Filter</h2>
|
||||
<form id="filterForm" class="flex flex-wrap gap-4 items-end">
|
||||
<div class="flex-1 min-w-32">
|
||||
<label for="filterMonth" class="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-2">
|
||||
Monat
|
||||
</label>
|
||||
<select
|
||||
id="filterMonth"
|
||||
name="month"
|
||||
class="w-full px-3 py-2 border border-gray-300 dark:border-gray-600 rounded-md bg-white dark:bg-gray-700 text-gray-800 dark:text-white">
|
||||
<option value="">-- Alle Monate --</option>
|
||||
<% availableMonths.forEach(m => { %>
|
||||
<option value="<%= m.month %>"><%= m.month %> - <%= m.year %></option>
|
||||
<% }); %>
|
||||
</select>
|
||||
</div>
|
||||
|
||||
<div class="flex-1 min-w-32">
|
||||
<label for="filterYear" class="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-2">
|
||||
Jahr
|
||||
</label>
|
||||
<select
|
||||
id="filterYear"
|
||||
name="year"
|
||||
class="w-full px-3 py-2 border border-gray-300 dark:border-gray-600 rounded-md bg-white dark:bg-gray-700 text-gray-800 dark:text-white">
|
||||
<option value="">-- Alle Jahre --</option>
|
||||
<% const years = [...new Set(availableMonths.map(m => m.year))].sort().reverse(); %>
|
||||
<% years.forEach(y => { %>
|
||||
<option value="<%= y %>"><%= y %></option>
|
||||
<% }); %>
|
||||
</select>
|
||||
</div>
|
||||
|
||||
<div class="flex space-x-2">
|
||||
<button
|
||||
type="submit"
|
||||
class="px-4 py-2 bg-blue-600 hover:bg-blue-700 text-white rounded-md transition-colors">
|
||||
Filtern
|
||||
</button>
|
||||
<a
|
||||
href="/"
|
||||
class="px-4 py-2 border border-gray-300 dark:border-gray-600 rounded-md text-gray-700 dark:text-gray-300 hover:bg-gray-50 dark:hover:bg-gray-700 transition-colors">
|
||||
Zurücksetzen
|
||||
</a>
|
||||
</div>
|
||||
|
||||
<div class="ml-auto">
|
||||
<button
|
||||
type="button"
|
||||
id="exportPdfBtn"
|
||||
class="px-4 py-2 bg-green-600 hover:bg-green-700 text-white rounded-md transition-colors flex items-center space-x-2">
|
||||
<svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 12h6m-6 4h6m2 5H7a2 2 0 01-2-2V5a2 2 0 012-2h5.586a1 1 0 01.707.293l5.414 5.414a1 1 0 01.293.707V19a2 2 0 01-2 2z"></path>
|
||||
</svg>
|
||||
<span>PDF Export</span>
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<button
|
||||
type="button"
|
||||
id="addApplicationBtn"
|
||||
class="px-4 py-2 bg-blue-600 hover:bg-blue-700 text-white rounded-md transition-colors flex items-center space-x-2">
|
||||
<svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 6v6m0 0v6m0-6h6m-6 0H6"></path>
|
||||
</svg>
|
||||
<span>Bewerbung hinzufügen</span>
|
||||
</button>
|
||||
</div>
|
||||
</form>
|
||||
<div class="flex gap-2">
|
||||
<button
|
||||
type="button"
|
||||
id="exportPdfBtn"
|
||||
class="inline-flex items-center gap-2 rounded-full px-4 py-3 text-sm font-medium text-white shadow-sm transition-colors bg-emerald-600 hover:bg-emerald-700">
|
||||
<svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M7 16a4 4 0 01-.88-7.9A5 5 0 1115.9 6L16 6a5 5 0 011 9.9M15 13v6m-3-3h6"></path>
|
||||
</svg>
|
||||
<span>PDF Export</span>
|
||||
</button>
|
||||
<button
|
||||
type="button"
|
||||
id="addApplicationBtn"
|
||||
class="inline-flex items-center gap-2 rounded-full px-4 py-3 text-sm font-medium text-white shadow-sm transition-colors bg-blue-600 hover:bg-blue-700">
|
||||
<svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 6v6m0 0v6m0-6h6m-6 0H6"></path>
|
||||
</svg>
|
||||
<span>Bewerbung hinzufügen</span>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Upcoming appointments (from the application calendar) -->
|
||||
|
||||
Reference in New Issue
Block a user