update
This commit is contained in:
+8
-6
@@ -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
@@ -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">
|
||||
|
||||
@@ -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">
|
||||
|
||||
Reference in New Issue
Block a user