This commit is contained in:
Mateusz Gruszczyński 2025-02-24 23:18:11 +01:00
parent ecc979b4ac
commit 8ef2fdf950

View File

@ -1,5 +1,5 @@
<!DOCTYPE html> <!DOCTYPE html>
<html lang="pl" data-bs-theme="light"> <html lang="pl" data-bs-theme="dark">
<head> <head>
<meta charset="UTF-8"> <meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1"> <meta name="viewport" content="width=device-width, initial-scale=1">
@ -69,12 +69,24 @@
box-shadow: none; box-shadow: none;
} }
/* Uwaga: Styl alertów nie jest modyfikowany, dzięki czemu pozostają kolorowe. */ /* Uwaga: Styl alertów nie jest modyfikowany, dzięki czemu pozostają kolorowe. */
/* Dodatkowy styl dla przycisku wyloguj w trybie ciemnym */
body.dark-mode .btn-logout {
/* Używamy przycisku obrysowanego, który lepiej widoczny jest na ciemnym tle */
background-color: transparent;
border: 2px solid #dc3545;
color: #dc3545;
}
body.dark-mode .btn-logout:hover {
background-color: #dc3545;
color: #ffffff;
}
</style> </style>
{% block extra_css %} {% block extra_css %}
<!-- Dodatkowe style CSS można dodać tutaj --> <!-- Dodatkowe style CSS można dodać tutaj -->
{% endblock %} {% endblock %}
</head> </head>
<body> <body class="dark-mode">
<!-- Pasek nawigacyjny --> <!-- Pasek nawigacyjny -->
<nav class="navbar navbar-expand-lg navbar-light bg-light"> <nav class="navbar navbar-expand-lg navbar-light bg-light">
<div class="container-fluid"> <div class="container-fluid">
@ -98,14 +110,14 @@
<li class="nav-item me-2"> <li class="nav-item me-2">
<!-- Przełącznik trybu ciemnego --> <!-- Przełącznik trybu ciemnego -->
<div class="form-check form-switch"> <div class="form-check form-switch">
<input class="form-check-input" type="checkbox" id="darkModeToggle"> <input class="form-check-input" type="checkbox" id="darkModeToggle" checked>
<label class="form-check-label" for="darkModeToggle">Dark Mode</label> <label class="form-check-label" for="darkModeToggle">Dark Mode</label>
</div> </div>
</li> </li>
{% if session.get('user_id') %} {% if session.get('user_id') %}
<li class="nav-item"><a class="nav-link" href="{{ url_for('change_password') }}">Zmień hasło</a></li> <li class="nav-item"><a class="nav-link" href="{{ url_for('change_password') }}">Zmień hasło</a></li>
<li class="nav-item"> <li class="nav-item">
<a class="nav-link btn btn-danger text-white ms-2" href="{{ url_for('logout') }}">Wyloguj</a> <a class="nav-link btn btn-outline-danger text-white ms-2 btn-logout" href="{{ url_for('logout') }}">Wyloguj</a>
</li> </li>
{% else %} {% else %}
<li class="nav-item"> <li class="nav-item">
@ -177,11 +189,16 @@
}); });
} }
// Ustawienie trybu ciemnego na podstawie ciasteczka // Ustawienie trybu ciemnego na podstawie ciasteczka lub domyślnie (dark mode)
const darkModeToggle = document.getElementById('darkModeToggle'); const darkModeToggle = document.getElementById('darkModeToggle');
if (getCookie('darkMode') === 'enabled') { if (getCookie('darkMode') === 'disabled') {
document.body.classList.remove('dark-mode');
darkModeToggle.checked = false;
} else {
// Domyślnie ustawiamy dark mode
document.body.classList.add('dark-mode'); document.body.classList.add('dark-mode');
darkModeToggle.checked = true; darkModeToggle.checked = true;
setCookie('darkMode', 'enabled', 30);
} }
// Na starcie dopasuj tabele // Na starcie dopasuj tabele
applyDarkModeTables(); applyDarkModeTables();