a human touch

This commit is contained in:
Jose Palazon 2024-09-06 01:28:16 +01:00
parent ab02397494
commit 9fa696d5a9
3 changed files with 7 additions and 6 deletions

View file

@ -52,6 +52,7 @@ nav ul {
list-style: none; list-style: none;
margin: 0; margin: 0;
padding: 0; padding: 0;
align-items: center;
} }
nav ul li a, nav ul li span, header .action { nav ul li a, nav ul li span, header .action {

View file

@ -7,7 +7,7 @@
<ul> <ul>
<li> <li>
<div id="theme-toggle" aria-label="Toggle Dark Mode"> <div id="theme-toggle" aria-label="Toggle Dark Mode">
<i id="theme-icon" class="fas fa-moon"></i> <!-- <i id="theme-icon" class="fas fa-moon"></i> -->
</div> </div>
</li> </li>
{% if g.user %} {% if g.user %}
@ -31,21 +31,21 @@
<script> <script>
document.addEventListener('DOMContentLoaded', function() { document.addEventListener('DOMContentLoaded', function() {
const themeToggle = document.getElementById('theme-toggle'); const themeToggle = document.getElementById('theme-toggle');
const themeIcon = document.getElementById('theme-icon'); // const themeIcon = document.getElementById('theme-icon');
const currentTheme = localStorage.getItem('theme') || (window.matchMedia('(prefers-color-scheme: dark)').matches ? 'dark' : 'light'); const currentTheme = localStorage.getItem('theme') || (window.matchMedia('(prefers-color-scheme: dark)').matches ? 'dark' : 'light');
if (currentTheme === 'dark') { if (currentTheme === 'dark') {
document.body.classList.add('dark-mode'); document.body.classList.add('dark-mode');
themeIcon.classList.remove('fa-moon'); // themeIcon.classList.remove('fa-moon');
themeIcon.classList.add('fa-sun'); // themeIcon.classList.add('fa-sun');
} }
themeToggle.addEventListener('click', function() { themeToggle.addEventListener('click', function() {
document.body.classList.toggle('dark-mode'); document.body.classList.toggle('dark-mode');
const newTheme = document.body.classList.contains('dark-mode') ? 'dark' : 'light'; const newTheme = document.body.classList.contains('dark-mode') ? 'dark' : 'light';
localStorage.setItem('theme', newTheme); localStorage.setItem('theme', newTheme);
themeIcon.classList.toggle('fa-sun'); // themeIcon.classList.toggle('fa-sun');
themeIcon.classList.toggle('fa-moon'); // themeIcon.classList.toggle('fa-moon');
}); });
}); });
</script> </script>

BIN
instance/flaskr.sqlite Normal file

Binary file not shown.