reptil1990/SDSStundenerfassung
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Darkmode fixes

Browse Source
This commit is contained in:
Carsten Graf
2026-03-25 16:04:30 +01:00
parent 907519c6d2
commit 449b649ad2
5 changed files with 93 additions and 30 deletions
Download Patch File Download Diff File Expand all files Collapse all files

70
public/css/style.css
View File

@@ -688,6 +688,44 @@ table input[type="text"] {
width: 100%;
}
/* Admin: Collapsible Sections (Darkmode-sicher, keine Inline-Farben) */
.collapsible-header {
cursor: pointer;
padding: 15px;
background-color: var(--bg-soft);
border: 1px solid var(--border-color);
border-radius: 4px;
display: flex;
justify-content: space-between;
align-items: center;
}
.collapsible-content {
display: none;
padding: 20px;
border: 1px solid var(--border-color);
border-top: none;
border-radius: 0 0 4px 4px;
background-color: var(--bg-surface);
}
.collapsible-content-scroll {
overflow-x: auto;
max-width: 100%;
}
.collapsible-section {
margin-top: 15px;
margin-bottom: 10px;
padding-bottom: 10px;
border-bottom: 1px solid var(--border-soft);
}
.collapsible-title {
font-weight: 600;
color: var(--text-strong);
}
/* Admin Container - volle Breite */
.admin-container .container {
max-width: 100%;
@@ -941,6 +979,23 @@ table input[type="text"] {
background-color: var(--table-hover);
}
/* Projektauswertung: Detail-Zeile (Mitarbeiter-Aufschlüsselung) */
.employee-details-row {
background-color: var(--bg-soft);
}
.employee-details-row td {
background-color: var(--bg-soft);
}
.employee-summary-row {
cursor: default;
}
.employee-summary-row .toggle-details-btn {
white-space: nowrap;
}
/* PDF Preview */
.pdf-preview-row {
background-color: var(--bg-soft);
@@ -1454,6 +1509,21 @@ table input.break-below-legal,
z-index: 10000;
}
[data-theme="dark"] .app-modal-card {
background: var(--bg-surface);
border-color: var(--border-color);
}
.app-modal-card {
background: var(--bg-surface);
border: 1px solid var(--border-color);
border-radius: 8px;
width: 90%;
max-width: 520px;
box-shadow: var(--shadow-lg);
padding: 18px 18px 14px 18px;
}
[data-theme="dark"] .theme-toggle-btn {
border-color: rgba(226, 232, 240, 0.45);
background: rgba(15, 23, 42, 0.25);

28
views/admin.ejs
View File

@@ -37,12 +37,12 @@
<!-- Benutzer anlegen - Zusammenklappbar -->
<div class="add-user-section" style="margin-top: 20px;">
<div class="collapsible-header" onclick="toggleAddUserSection()" style="cursor: pointer; padding: 15px; background-color: #f5f5f5; border: 1px solid #ddd; border-radius: 4px; display: flex; justify-content: space-between; align-items: center;">
<div class="collapsible-header" onclick="toggleAddUserSection()">
<h3 style="margin: 0;">Neuen Benutzer anlegen</h3>
<span id="addUserToggleIcon" style="font-size: 18px; transition: transform 0.3s;">▼</span>
</div>
<div id="addUserContent" style="display: none; padding: 20px; border: 1px solid #ddd; border-top: none; border-radius: 0 0 4px 4px; background-color: #fff;">
<div id="addUserContent" class="collapsible-content">
<div class="add-user-form">
<form id="addUserForm">
<div class="form-row">
@@ -122,12 +122,12 @@
<!-- Benutzer-Liste - Zusammenklappbar -->
<div class="user-list-section" style="margin-top: 20px;">
<div class="collapsible-header" onclick="toggleUserListSection()" style="cursor: pointer; padding: 15px; background-color: #f5f5f5; border: 1px solid #ddd; border-radius: 4px; display: flex; justify-content: space-between; align-items: center;">
<div class="collapsible-header" onclick="toggleUserListSection()">
<h3 style="margin: 0;">Benutzer-Liste</h3>
<span id="userListToggleIcon" style="font-size: 18px; transition: transform 0.3s;">▼</span>
</div>
<div id="userListContent" style="display: none; padding: 20px; border: 1px solid #ddd; border-top: none; border-radius: 0 0 4px 4px; background-color: #fff; overflow-x: auto; max-width: 100%;">
<div id="userListContent" class="collapsible-content collapsible-content-scroll">
<div class="user-list" style="min-width: 100%;">
<table style="width: 100%; min-width: 900px;">
<thead>
@@ -224,12 +224,12 @@
</div>
<div class="options-section" style="margin-top: 40px;">
<div class="collapsible-header" onclick="toggleOptionsSection()" style="cursor: pointer; padding: 15px; background-color: #f5f5f5; border: 1px solid #ddd; border-radius: 4px; display: flex; justify-content: space-between; align-items: center;">
<div class="collapsible-header" onclick="toggleOptionsSection()">
<h2 style="margin: 0;">Optionen</h2>
<span id="optionsToggleIcon" style="font-size: 18px; transition: transform 0.3s;">▼</span>
</div>
<div id="optionsContent" style="display: none; padding: 20px; border: 1px solid #ddd; border-top: none; border-radius: 0 0 4px 4px; background-color: #fff;">
<div id="optionsContent" class="collapsible-content">
<div class="options-form">
<h3>Wochenend-Prozentsätze</h3>
<p style="margin-bottom: 20px; color: #666;">Konfigurieren Sie die Prozentsätze für die Wochenendstunden. 100% entspricht normal, 150% entspricht 1,5 mal, 200% entspricht doppelt.</p>
@@ -269,12 +269,12 @@
</div>
<div class="ldap-sync-section" style="margin-top: 40px;">
<div class="collapsible-header" onclick="toggleLDAPSection()" style="cursor: pointer; padding: 15px; background-color: #f5f5f5; border: 1px solid #ddd; border-radius: 4px; display: flex; justify-content: space-between; align-items: center;">
<div class="collapsible-header" onclick="toggleLDAPSection()">
<h2 style="margin: 0;">LDAP-Synchronisation</h2>
<span id="ldapToggleIcon" style="font-size: 18px; transition: transform 0.3s;">▼</span>
</div>
<div id="ldapContent" style="display: none; padding: 20px; border: 1px solid #ddd; border-top: none; border-radius: 0 0 4px 4px; background-color: #fff;">
<div id="ldapContent" class="collapsible-content">
<div class="ldap-config-form">
<h3>LDAP-Konfiguration</h3>
<form id="ldapConfigForm">
@@ -394,12 +394,12 @@
</div>
<div class="mssql-config-section" style="margin-top: 40px;">
<div class="collapsible-header" onclick="toggleMssqlSection()" style="cursor: pointer; padding: 15px; background-color: #f5f5f5; border: 1px solid #ddd; border-radius: 4px; display: flex; justify-content: space-between; align-items: center;">
<div class="collapsible-header" onclick="toggleMssqlSection()">
<h2 style="margin: 0;">MSSQL-Projektsuche Konfiguration</h2>
<span id="mssqlToggleIcon" style="font-size: 18px; transition: transform 0.3s;">▼</span>
</div>
<div id="mssqlContent" style="display: none; padding: 20px; border: 1px solid #ddd; border-top: none; border-radius: 0 0 4px 4px; background-color: #fff;">
<div id="mssqlContent" class="collapsible-content">
<div class="mssql-config-form">
<h3>MSSQL-Verbindungsdaten</h3>
<p style="margin-bottom: 20px; color: #666;">
@@ -443,12 +443,12 @@
</div>
<div class="options-section" style="margin-top: 40px;">
<div class="collapsible-header" onclick="toggleTimesheetMaintenanceSection()" style="cursor: pointer; padding: 15px; background-color: #f5f5f5; border: 1px solid #ddd; border-radius: 4px; display: flex; justify-content: space-between; align-items: center;">
<div class="collapsible-header" onclick="toggleTimesheetMaintenanceSection()">
<h2 style="margin: 0;">Datenbankpflege – doppelte Timesheet-Einträge</h2>
<span id="timesheetMaintenanceToggleIcon" style="font-size: 18px; transition: transform 0.3s;">▼</span>
</div>
<div id="timesheetMaintenanceContent" style="display: none; padding: 20px; border: 1px solid #ddd; border-top: none; border-radius: 0 0 4px 4px; background-color: #fff;">
<div id="timesheetMaintenanceContent" class="collapsible-content">
<p style="margin-bottom: 15px; color: #666;">
Es werden alle Tage angezeigt, an denen ein Mitarbeiter mehr als einen Eintrag in der Tabelle <code>timesheet_entries</code> hat
(Schlüssel: Benutzer + Datum). Über diese Übersicht können Sie fehlerhafte Einträge gezielt löschen.
@@ -463,12 +463,12 @@
</div>
<div class="pdf-archive-section" style="margin-top: 40px;">
<div class="collapsible-header" onclick="togglePdfArchiveSection()" style="cursor: pointer; padding: 15px; background-color: #f5f5f5; border: 1px solid #ddd; border-radius: 4px; display: flex; justify-content: space-between; align-items: center;">
<div class="collapsible-header" onclick="togglePdfArchiveSection()">
<h2 style="margin: 0;">PDF-Archiv (Timesheets)</h2>
<span id="pdfArchiveToggleIcon" style="font-size: 18px; transition: transform 0.3s;">▼</span>
</div>
<div id="pdfArchiveContent" style="display: none; padding: 20px; border: 1px solid #ddd; border-top: none; border-radius: 0 0 4px 4px; background-color: #fff;">
<div id="pdfArchiveContent" class="collapsible-content">
<div class="form-row" style="display: flex; gap: 20px; flex-wrap: wrap; align-items: flex-end;">
<div class="form-group" style="min-width: 180px;">
<label for="pdfYearSelect">Jahr</label>

8
views/overtime-breakdown.ejs
View File

@@ -189,12 +189,12 @@
<span class="summary-label">Manuelle Korrektur (Verwaltung):</span>
<span class="summary-value" id="overtimeOffset">-</span>
</div>
<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>
<div id="correctionsSection" class="collapsible-section" style="display: none;">
<div id="correctionsHeader" class="collapsible-header">
<span class="collapsible-title">Korrekturen durch die Verwaltung</span>
<span id="correctionsToggleIcon" style="font-size: 16px; transition: transform 0.3s;">▼</span>
</div>
<div id="correctionsContent" style="display: none; border: 1px solid #ddd; border-top: none; border-radius: 0 0 4px 4px; background-color: #fff; padding: 10px 12px;">
<div id="correctionsContent" class="collapsible-content" style="padding: 10px 12px;">
<ul id="correctionsList" style="margin: 0; padding-left: 18px;"></ul>
</div>
</div>

2
views/projekt-auswertung.ejs
View File

@@ -94,7 +94,7 @@
</td>
</tr>
<% if (activities.length > 0) { %>
<tr class="employee-details-row" data-user-id="<%= row.userId %>" style="display: none; background-color: #fafafa;">
<tr class="employee-details-row" data-user-id="<%= row.userId %>" style="display: none;">
<td colspan="3">
<div style="padding: 10px 5px 5px 5px;">
<strong>Aufschlüsselung für <%= row.firstname %> <%= row.lastname %>:</strong>

15
views/verwaltung.ejs
View File

@@ -759,22 +759,15 @@
`;
const box = document.createElement('div');
box.style.cssText = `
background: #fff;
border-radius: 8px;
width: 90%;
max-width: 520px;
box-shadow: 0 4px 12px rgba(0,0,0,0.2);
padding: 18px 18px 14px 18px;
`;
box.className = 'app-modal-card';
box.innerHTML = `
<div style="display:flex; align-items:center; justify-content:space-between; gap:10px; margin-bottom: 8px;">
<h3 style="margin: 0; font-size: 16px; color: #2c3e50;">${title}</h3>
<h3 style="margin: 0; font-size: 16px; color: var(--text-strong);">${title}</h3>
<button type="button" data-action="close" class="btn btn-secondary btn-sm" style="padding: 6px 10px;">✕</button>
</div>
<div style="color:#666; font-size: 13px; margin-bottom: 10px;">${promptText}</div>
<textarea data-role="reason" rows="4" style="width: 100%; padding: 10px; border: 1px solid #ddd; border-radius: 6px; font-family: inherit; font-size: 13px; resize: vertical;" placeholder="Grund..."></textarea>
<div style="color: var(--text-muted); font-size: 13px; margin-bottom: 10px;">${promptText}</div>
<textarea data-role="reason" rows="4" style="width: 100%; padding: 10px; border: 1px solid var(--border-color); border-radius: 6px; font-family: inherit; font-size: 13px; resize: vertical; background: var(--bg-surface); color: var(--text-main);" placeholder="Grund..."></textarea>
<div data-role="error" style="display:none; margin-top: 8px; color:#dc3545; font-size: 13px;"></div>
<div style="display:flex; justify-content:flex-end; gap: 10px; margin-top: 12px;">
<button type="button" data-action="cancel" class="btn btn-secondary">Abbrechen</button>