Styling
This commit is contained in:
@@ -145,15 +145,11 @@
|
||||
<span class="summary-label">Davon genommen:</span>
|
||||
<span class="summary-value" id="totalOvertimeTaken">-</span>
|
||||
</div>
|
||||
<div class="summary-item">
|
||||
<span class="summary-label">Verbleibend:</span>
|
||||
<span class="summary-value" id="remainingOvertime">-</span>
|
||||
</div>
|
||||
<div class="summary-item" id="offsetItem" style="display: none;">
|
||||
<span class="summary-label">Manuelle Korrektur (Verwaltung):</span>
|
||||
<span class="summary-value" id="overtimeOffset">-</span>
|
||||
</div>
|
||||
<div id="correctionsSection" style="margin-top: 15px; display: none;">
|
||||
<div id="correctionsSection" style="margin-top: 15px; margin-bottom: 10px; padding-bottom: 10px; border-bottom: 1px solid #e0e0e0; display: none;">
|
||||
<div id="correctionsHeader" class="collapsible-header" style="cursor: pointer; padding: 12px; background-color: #f5f5f5; border: 1px solid #ddd; border-radius: 4px; display: flex; justify-content: space-between; align-items: center;">
|
||||
<span style="font-weight: 600; color: #2c3e50;">Korrekturen durch die Verwaltung</span>
|
||||
<span id="correctionsToggleIcon" style="font-size: 16px; transition: transform 0.3s;">▼</span>
|
||||
@@ -162,6 +158,10 @@
|
||||
<ul id="correctionsList" style="margin: 0; padding-left: 18px;"></ul>
|
||||
</div>
|
||||
</div>
|
||||
<div class="summary-item">
|
||||
<span class="summary-label">Verbleibend:</span>
|
||||
<span class="summary-value" id="remainingOvertime">-</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="loading" class="loading">Lade Daten...</div>
|
||||
@@ -323,12 +323,16 @@
|
||||
corrections.forEach(c => {
|
||||
const dt = parseSqliteDatetime(c.corrected_at);
|
||||
const dateText = dt ? dt.toLocaleDateString('de-DE') : '';
|
||||
const hoursText = formatHoursMin(c.correction_hours);
|
||||
const rawHours = Number(c.correction_hours) || 0;
|
||||
const absHours = Math.abs(rawHours);
|
||||
const signPrefix = rawHours >= 0 ? '+' : '-';
|
||||
const hoursClass = rawHours >= 0 ? 'overtime-positive' : 'overtime-negative';
|
||||
const hoursDisplay = signPrefix + formatHoursMin(absHours);
|
||||
const reason = (c && c.reason != null) ? String(c.reason).trim() : '';
|
||||
const li = document.createElement('li');
|
||||
li.textContent = reason
|
||||
? `Korrektur am ${dateText} ${hoursText} – ${reason}`
|
||||
: `Korrektur am ${dateText} ${hoursText}`;
|
||||
li.innerHTML = reason
|
||||
? `Korrektur am ${dateText} <span class="${hoursClass}">${hoursDisplay}</span> – ${reason}`
|
||||
: `Korrektur am ${dateText} <span class="${hoursClass}">${hoursDisplay}</span>`;
|
||||
correctionsListEl.appendChild(li);
|
||||
});
|
||||
|
||||
|
||||
@@ -645,12 +645,16 @@
|
||||
corrections.forEach(c => {
|
||||
const dt = parseSqliteDatetime(c.corrected_at);
|
||||
const dateText = dt ? dt.toLocaleDateString('de-DE') : '';
|
||||
const hoursText = formatHoursMin(c.correction_hours);
|
||||
const rawHours = Number(c.correction_hours) || 0;
|
||||
const absHours = Math.abs(rawHours);
|
||||
const signPrefix = rawHours >= 0 ? '+' : '-';
|
||||
const hoursClass = rawHours >= 0 ? 'overtime-positive' : 'overtime-negative';
|
||||
const hoursDisplay = signPrefix + formatHoursMin(absHours);
|
||||
const reason = (c && c.reason != null) ? String(c.reason).trim() : '';
|
||||
const li = document.createElement('li');
|
||||
li.textContent = reason
|
||||
? `Korrektur am ${dateText} ${hoursText} – ${reason}`
|
||||
: `Korrektur am ${dateText} ${hoursText}`;
|
||||
li.innerHTML = reason
|
||||
? `Korrektur am ${dateText} <span class="${hoursClass}">${hoursDisplay}</span> – ${reason}`
|
||||
: `Korrektur am ${dateText} <span class="${hoursClass}">${hoursDisplay}</span>`;
|
||||
if (listEl) listEl.appendChild(li);
|
||||
});
|
||||
} catch (e) {
|
||||
|
||||
Reference in New Issue
Block a user