thomas/jobbi-bewerbung
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Startseite: Gemerkte Bewerbungen unter die anstehenden Termine, dezenter & modern

Browse Source 
Favoriten-Sektion wird nicht mehr ganz oben gerendert, sondern direkt
unter der Terminkarte; bei aktiver Suche wird sie nun ebenfalls ausge-
blendet. Karte bewusst dezenter gehalten (Border statt Schatten,
kleinere Überschrift, gedämpfte Akzente) mit modernen weichen Kanten.

Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
thomas
2026-07-15 10:55:20 +02:00
co-authored by Claude
parent 8405b8c057
commit ce5fa1eab1
3 changed files with 26 additions and 18 deletions
Download Patch File Download Diff File Expand all files Collapse all files
server.js
+2 -2
View File
@@ -1864,8 +1864,8 @@ initializeDatabase().then(async () => {
}; };
} }
// Gemerkte Bewerbungen — unabhängig vom Bewerbungs-Status, ganz oben auf // Gemerkte Bewerbungen — unabhängig vom Bewerbungs-Status, auf der
// der Startseite. // Startseite direkt unter den anstehenden Terminen.
const bewerbungFavoriten = await dbAll( const bewerbungFavoriten = await dbAll(
`SELECT b.id, b.firma, b.stelle, b.ort, b.status, b.datum, b.favorit `SELECT b.id, b.firma, b.stelle, b.ort, b.status, b.datum, b.favorit
FROM bewerbungen b FROM bewerbungen b
views/index.ejs
+7 -1
View File
@@ -8,7 +8,6 @@
<main class="flex-1 container mx-auto px-4 py-8"> <main class="flex-1 container mx-auto px-4 py-8">
<% var zeigeDashboard = !(typeof setupWizard !== 'undefined' && setupWizard && setupWizard.aktiv); %> <% var zeigeDashboard = !(typeof setupWizard !== 'undefined' && setupWizard && setupWizard.aktiv); %>
<%- include('partials/bewerbung-favoriten') %>
<% if (!zeigeDashboard) { %> <% if (!zeigeDashboard) { %>
<%- include('partials/einrichtung') %> <%- include('partials/einrichtung') %>
<% } %> <% } %>
@@ -110,6 +109,9 @@
</div> </div>
<% } %> <% } %>
<!-- Gemerkte Bewerbungen — direkt unter den anstehenden Terminen -->
<%- include('partials/bewerbung-favoriten') %>
<!-- Applications --> <!-- Applications -->
<style> <style>
/* Shared column grid – used by the header labels and every application line */ /* Shared column grid – used by the header labels and every application line */
@@ -459,6 +461,7 @@
var fehler = document.getElementById('searchError'); var fehler = document.getElementById('searchError');
var listCard = document.getElementById('listCard'); var listCard = document.getElementById('listCard');
var termineCard = document.getElementById('termineCard'); var termineCard = document.getElementById('termineCard');
var bewerbungFavoritenCard = document.getElementById('bewerbungFavoritenCard');
var aktivitaetCard = document.getElementById('aktivitaetCard'); var aktivitaetCard = document.getElementById('aktivitaetCard');
var MIN = 2; // kürzere Eingaben liefern nur Rauschen var MIN = 2; // kürzere Eingaben liefern nur Rauschen
@@ -575,6 +578,7 @@
panel.classList.add('hidden'); panel.classList.add('hidden');
if (listCard) listCard.classList.remove('hidden'); if (listCard) listCard.classList.remove('hidden');
if (termineCard) termineCard.classList.remove('hidden'); if (termineCard) termineCard.classList.remove('hidden');
if (bewerbungFavoritenCard) bewerbungFavoritenCard.classList.remove('hidden');
if (aktivitaetCard) aktivitaetCard.classList.remove('hidden'); if (aktivitaetCard) aktivitaetCard.classList.remove('hidden');
input.setAttribute('aria-expanded', 'false'); input.setAttribute('aria-expanded', 'false');
aktiv = -1; aktiv = -1;
@@ -595,6 +599,7 @@
panel.classList.remove('hidden'); panel.classList.remove('hidden');
if (listCard) listCard.classList.add('hidden'); if (listCard) listCard.classList.add('hidden');
if (termineCard) termineCard.classList.add('hidden'); if (termineCard) termineCard.classList.add('hidden');
if (bewerbungFavoritenCard) bewerbungFavoritenCard.classList.add('hidden');
if (aktivitaetCard) aktivitaetCard.classList.add('hidden'); if (aktivitaetCard) aktivitaetCard.classList.add('hidden');
input.setAttribute('aria-expanded', 'true'); input.setAttribute('aria-expanded', 'true');
aktiv = -1; aktiv = -1;
@@ -609,6 +614,7 @@
panel.classList.remove('hidden'); panel.classList.remove('hidden');
if (listCard) listCard.classList.add('hidden'); if (listCard) listCard.classList.add('hidden');
if (termineCard) termineCard.classList.add('hidden'); if (termineCard) termineCard.classList.add('hidden');
if (bewerbungFavoritenCard) bewerbungFavoritenCard.classList.add('hidden');
if (aktivitaetCard) aktivitaetCard.classList.add('hidden'); if (aktivitaetCard) aktivitaetCard.classList.add('hidden');
} }
views/partials/bewerbung-favoriten.ejs
+17 -15
View File
@@ -1,41 +1,43 @@
<% <%
// Gemerkte Bewerbungen — Sektion ganz oben auf der Startseite. Zeigt alle // Gemerkte Bewerbungen — Sektion auf der Startseite, direkt unter den
// favorisierten Bewerbungen unabhängig von ihrem Status. Wird nur gerendert, // anstehenden Terminen. Zeigt alle favorisierten Bewerbungen unabhängig von
// wenn mindestens ein Favorit vorhanden ist. // ihrem Status. Wird nur gerendert, wenn mindestens ein Favorit vorhanden ist.
// Bewusst dezenter als die Hauptkarten: weiche Border statt Schatten, kleinere
// Überschrift, gedämpfte Akzentfarben — aber mit modernen, weichen Kanten.
%> %>
<% if (bewerbungFavoriten && bewerbungFavoriten.length) { %> <% if (bewerbungFavoriten && bewerbungFavoriten.length) { %>
<%- include('favorit-script') %> <%- include('favorit-script') %>
<section id="bewerbungFavoritenCard" data-fav-card class="bg-white dark:bg-gray-800 rounded-lg shadow-md mb-8 overflow-hidden"> <section id="bewerbungFavoritenCard" data-fav-card class="bg-white dark:bg-gray-800/60 rounded-xl border border-gray-200/80 dark:border-gray-700/60 shadow-sm mb-8 overflow-hidden">
<div class="flex flex-wrap items-center gap-2 px-6 py-4 border-b border-gray-200 dark:border-gray-700"> <div class="flex flex-wrap items-center gap-2 px-6 py-4 border-b border-gray-100 dark:border-gray-700/60">
<svg class="h-5 w-5 text-amber-500" viewBox="0 0 24 24" fill="currentColor"><path stroke-linecap="round" stroke-linejoin="round" d="M11.48 3.5l2.6 5.27 5.82.85-4.21 4.1.99 5.79-5.2-2.73-5.2 2.73.99-5.79-4.21-4.1 5.82-.85 2.6-5.27z"/></svg> <svg class="h-4 w-4 text-amber-400 dark:text-amber-500" viewBox="0 0 24 24" fill="currentColor"><path stroke-linecap="round" stroke-linejoin="round" d="M11.48 3.5l2.6 5.27 5.82.85-4.21 4.1.99 5.79-5.2-2.73-5.2 2.73.99-5.79-4.21-4.1 5.82-.85 2.6-5.27z"/></svg>
<h2 class="text-lg font-semibold text-gray-800 dark:text-white">Gemerkte Bewerbungen</h2> <h2 class="text-sm font-semibold text-gray-700 dark:text-gray-200">Gemerkte Bewerbungen</h2>
<span class="ml-auto inline-flex items-center gap-1.5 rounded-full bg-amber-50 px-2.5 py-1 text-xs font-medium text-amber-700 dark:bg-amber-500/10 dark:text-amber-300"> <span class="ml-auto inline-flex items-center rounded-full bg-gray-100 dark:bg-gray-700/70 px-2 py-0.5 text-xs font-medium text-gray-500 dark:text-gray-400">
<%= bewerbungFavoriten.length %> <%= bewerbungFavoriten.length %>
</span> </span>
</div> </div>
<ul class="divide-y divide-gray-100 dark:divide-gray-700/60"> <ul class="divide-y divide-gray-100 dark:divide-gray-700/60">
<% bewerbungFavoriten.forEach(function(b){ %> <% bewerbungFavoriten.forEach(function(b){ %>
<li data-fav-item class="flex flex-wrap items-start justify-between gap-3 px-6 py-4"> <li data-fav-item class="flex flex-wrap items-start justify-between gap-3 px-6 py-3 transition-colors hover:bg-gray-50/70 dark:hover:bg-gray-700/30">
<div class="min-w-0 flex-1"> <div class="min-w-0 flex-1">
<div class="flex flex-wrap items-center gap-2 mb-1"> <div class="flex flex-wrap items-center gap-2 mb-1">
<% if (b.status) { %> <% if (b.status) { %>
<span class="inline-flex items-center px-2 py-0.5 rounded text-xs font-medium bg-gray-100 text-gray-700 dark:bg-gray-700 dark:text-gray-200"><%= b.status %></span> <span class="inline-flex items-center px-2 py-0.5 rounded-md text-xs font-medium bg-gray-100 text-gray-600 dark:bg-gray-700 dark:text-gray-300"><%= b.status %></span>
<% } %> <% } %>
<% if (b.datum) { %> <% if (b.datum) { %>
<span class="inline-flex items-center px-2 py-0.5 rounded text-xs font-medium bg-gray-100 text-gray-600 dark:bg-gray-700 dark:text-gray-300"><%= new Date(b.datum).toLocaleDateString('de-DE') %></span> <span class="inline-flex items-center px-2 py-0.5 rounded-md text-xs font-medium bg-gray-100 text-gray-500 dark:bg-gray-700 dark:text-gray-400"><%= new Date(b.datum).toLocaleDateString('de-DE') %></span>
<% } %> <% } %>
</div> </div>
<a href="/bewerbung/<%= b.id %>" class="text-base font-semibold text-gray-800 dark:text-gray-100 break-words hover:underline"> <a href="/bewerbung/<%= b.id %>" class="text-sm font-medium text-gray-800 dark:text-gray-100 break-words hover:underline">
<%= b.firma %> <%= b.firma %>
</a> </a>
<p class="text-sm text-gray-700 dark:text-gray-200 break-words"><%= b.stelle %></p> <p class="text-sm text-gray-600 dark:text-gray-300 break-words"><%= b.stelle %></p>
<% if (b.ort) { %> <% if (b.ort) { %>
<p class="text-sm text-gray-500 dark:text-gray-400 mt-0.5"><%= b.ort %></p> <p class="text-xs text-gray-400 dark:text-gray-500 mt-0.5"><%= b.ort %></p>
<% } %> <% } %>
</div> </div>
<div class="shrink-0 flex flex-col gap-2 self-start items-end"> <div class="shrink-0 flex flex-col gap-2 self-start items-end">
<a href="/bewerbung/<%= b.id %>" <a href="/bewerbung/<%= b.id %>"
class="inline-flex items-center justify-center gap-1.5 px-3 py-1.5 text-xs bg-blue-600 hover:bg-blue-700 text-white rounded-md transition-colors"> class="inline-flex items-center justify-center gap-1.5 px-2.5 py-1 text-xs font-medium text-gray-600 dark:text-gray-300 border border-gray-200 dark:border-gray-600/80 rounded-md hover:bg-white dark:hover:bg-gray-700 hover:border-gray-300 dark:hover:border-gray-500 transition-colors">
Öffnen Öffnen
</a> </a>
<%- include('favorit-button', { j: b, endpoint: '/api/bewerbungen/' + b.id + '/favorit' }) %> <%- include('favorit-button', { j: b, endpoint: '/api/bewerbungen/' + b.id + '/favorit' }) %>