From 30985747a66542652570a04eabfc910ffd294b14 Mon Sep 17 00:00:00 2001
From: marijo <marijo@novosel.dk>
Date: Tue, 9 Jun 2026 13:11:21 +0000
Subject: [PATCH] Style update

---
 app.js    | 2 +-
 style.css | 1 +
 2 files changed, 2 insertions(+), 1 deletion(-)

diff --git a/app.js b/app.js
index 355f567..97f26f5 100644
--- a/app.js
+++ b/app.js
@@ -424,7 +424,7 @@ function renderMonthRow(month) {
   const balanceClass = month.availableDays < -0.001 ? 'bad-text' : 'good-text';
   const entries = month.entries.length
     ? month.entries.map((item) => `
-      <span class="month-entry">
+      <span class="month-entry ${isPastEntry(item) ? 'past-vacation-entry' : ''}">
         <strong>${escapeHtml(item.title)}</strong>
         <small class="planner-entry-meta"><strong>${days(item.workdays)} wd</strong> · ${days(item.usedVacation)} vd · ${days(item.usedFeriefridage)} ff · ${hours(item.usedFlex)} fl</small>
         <small class="planner-entry-dates">${formatDate(item.start_date)} → ${formatDate(item.end_date)}</small>
diff --git a/style.css b/style.css
index 65cee45..97a7376 100644
--- a/style.css
+++ b/style.css
@@ -349,6 +349,7 @@ tbody tr:hover { background: rgba(255,255,255,.04); }
   color: var(--ink);
 }
 .month-entry small { color: var(--muted); }
+.month-entry.past-vacation-entry > strong { text-decoration: line-through; }
 .entry-date { font-size: .68rem; }
 .planner-entry-meta {
   display: inline;