marijo/go
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Style update

Browse source
This commit is contained in:
marijo 2026-06-09 12:57:18 +00:00
parent c6e206ffe7
commit aa2ecc44e6
2 changed files with 10 additions and 4 deletions
Download patch file Download diff file Expand all files Collapse all files

10
app.js
View file

@ -368,7 +368,7 @@ function renderEntries() {
const source = sourceLabels[entry.source] || entry.source; const source = sourceLabels[entry.source] || entry.source;
return ` return `
<tr class="${isPastEntry(entry) ? 'past-entry' : ''}"> <tr class="${isPastEntry(entry) ? 'past-entry' : ''}">
<td><strong>${escapeHtml(entry.title)}</strong> <span class="muted">${escapeHtml(source)}</span><br><span class="muted entry-date">${escapeHtml(entry.start_date)} → ${escapeHtml(entry.end_date)}</span>${Number(entry.allow_unpaid) ? ' <span class="pill unpaid">unpaid</span>' : ''}</td> <td><strong>${escapeHtml(entry.title)}</strong> <span class="muted">${escapeHtml(source)}</span><br><span class="muted entry-date">${formatDate(entry.start_date)} → ${formatDate(entry.end_date)}</span>${Number(entry.allow_unpaid) ? ' <span class="pill unpaid">unpaid</span>' : ''}</td>
<td class="num strong-num">${days(summary.workdays)}</td> <td class="num strong-num">${days(summary.workdays)}</td>
<td class="num">${days(summary.usedVacation)}</td> <td class="num">${days(summary.usedVacation)}</td>
<td class="num">${days(summary.usedFeriefridage)}</td> <td class="num">${days(summary.usedFeriefridage)}</td>
@ -427,7 +427,7 @@ function renderMonthRow(month) {
<span class="month-entry"> <span class="month-entry">
<strong>${escapeHtml(item.title)}</strong> <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-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">${escapeHtml(item.start_date)} → ${escapeHtml(item.end_date)}</small> <small class="planner-entry-dates">${formatDate(item.start_date)} → ${formatDate(item.end_date)}</small>
</span> </span>
`).join('') `).join('')
: '<span class="muted">—</span>'; : '<span class="muted">—</span>';
@ -866,6 +866,12 @@ function parseDate(value) {
return dateFromParts(year, month, day); return dateFromParts(year, month, day);
} }
function formatDate(value) {
const [year, month, day] = String(value).split('-');
if (!year || !month || !day) return escapeHtml(value);
return `${day}/${month}/${year}`;
}
function monthKey(year, month) { function monthKey(year, month) {
return `${year}-${String(month).padStart(2, '0')}`; return `${year}-${String(month).padStart(2, '0')}`;
} }

4
style.css
View file

@ -293,9 +293,9 @@ table { width: 100%; border-collapse: collapse; font-size: .92rem; }
th, td { padding: .75rem .65rem; border-bottom: 1px solid var(--line); text-align: left; vertical-align: top; } th, td { padding: .75rem .65rem; border-bottom: 1px solid var(--line); text-align: left; vertical-align: top; }
th { color: var(--muted); font-size: .78rem; text-transform: uppercase; letter-spacing: .04em; } th { color: var(--muted); font-size: .78rem; text-transform: uppercase; letter-spacing: .04em; }
tbody tr:hover { background: rgba(255,255,255,.04); } tbody tr:hover { background: rgba(255,255,255,.04); }
.planner-body-table tr.past-month { opacity: .55; } .planner-body-table tr.past-month { opacity: .78; }
.planner-body-table tr.past-month td:first-child { color: var(--muted); } .planner-body-table tr.past-month td:first-child { color: var(--muted); }
.planner-body-table tr.past-month .balance-override-input { opacity: .72; } .planner-body-table tr.past-month .balance-override-input { opacity: .9; }
.num { text-align: right; font-variant-numeric: tabular-nums; } .num { text-align: right; font-variant-numeric: tabular-nums; }
.strong-num { font-weight: 900; color: var(--ink); } .strong-num { font-weight: 900; color: var(--ink); }
.muted { color: var(--muted); } .muted { color: var(--muted); }