This commit is contained in:
2026-06-19 04:32:02 +02:00
parent c2a629e2c0
commit 6952309de9
4 changed files with 232 additions and 61 deletions
+8 -6
View File
@@ -3,7 +3,7 @@
<head>
<%- include('partials/head') %>
</head>
<body class="min-h-screen transition-colors duration-300 bg-gray-50 dark:bg-gray-900" id="body">
<body class="min-h-screen transition-colors duration-300 bg-gray-50 dark:bg-gray-900 text-gray-900 dark:text-gray-100" id="body">
<%- include('partials/header', { hideSettings: true }) %>
<%
@@ -191,23 +191,25 @@
<script>
(function () {
const body = document.getElementById('body');
// The `dark` class lives on <html> so Tailwind's `.dark .dark:*`
// selectors also style the <body> itself.
const root = document.documentElement;
const dm = localStorage.getItem('darkMode');
if (dm === 'enabled' || (!dm && window.matchMedia('(prefers-color-scheme: dark)').matches)) {
body.classList.add('dark');
root.classList.add('dark');
}
const toggle = document.getElementById('darkModeToggle');
const sun = document.getElementById('sunIcon');
const moon = document.getElementById('moonIcon');
function sync() {
const d = body.classList.contains('dark');
const d = root.classList.contains('dark');
if (sun) sun.classList.toggle('hidden', d);
if (moon) moon.classList.toggle('hidden', !d);
}
sync();
if (toggle) toggle.addEventListener('click', () => {
body.classList.toggle('dark');
localStorage.setItem('darkMode', body.classList.contains('dark') ? 'enabled' : 'disabled');
root.classList.toggle('dark');
localStorage.setItem('darkMode', root.classList.contains('dark') ? 'enabled' : 'disabled');
sync();
});
const cy = document.getElementById('currentYear');
+5 -3
View File
@@ -3,7 +3,7 @@
<head>
<%- include('partials/head') %>
</head>
<body class="min-h-screen transition-colors duration-300" id="body">
<body class="min-h-screen transition-colors duration-300 bg-gray-50 dark:bg-gray-900 text-gray-900 dark:text-gray-100" id="body">
<%- include('partials/header') %>
<main class="container mx-auto px-4 py-8">
@@ -56,7 +56,8 @@
</div>
<div class="ml-auto">
<button
<button
type="button"
id="exportPdfBtn"
class="px-4 py-2 bg-green-600 hover:bg-green-700 text-white rounded-md transition-colors flex items-center space-x-2">
<svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
@@ -67,7 +68,8 @@
</div>
<div>
<button
<button
type="button"
id="addApplicationBtn"
class="px-4 py-2 bg-blue-600 hover:bg-blue-700 text-white rounded-md transition-colors flex items-center space-x-2">
<svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+4
View File
@@ -3,5 +3,9 @@
<title>Bewerbungs-Tracker</title>
<!-- Tailwind CSS CDN -->
<script src="https://cdn.tailwindcss.com"></script>
<script>
// Toggle dark mode via the `.dark` class (default is `media`, i.e. OS-driven)
tailwind.config = { darkMode: 'class' };
</script>
<!-- Custom CSS -->
<link rel="stylesheet" href="/css/styles.css">