mirror of
https://github.com/aljazceru/awesome-nostr.git
synced 2025-02-22 14:48:59 +00:00
Users light/dark preferrence will be stored so it doesn't change when they refresh
This commit is contained in:
parent
bcf564a72b
commit
cc89534da6
25
script.js
25
script.js
@ -2,13 +2,34 @@
|
||||
const darkModeToggle = document.getElementById('darkModeToggle');
|
||||
const body = document.body;
|
||||
|
||||
darkModeToggle.addEventListener('click', () => {
|
||||
body.dataset.theme = body.dataset.theme === 'dark' ? 'light' : 'dark';
|
||||
// Initialize theme from localStorage or system preference
|
||||
document.addEventListener('DOMContentLoaded', () => {
|
||||
const savedTheme = localStorage.getItem('theme');
|
||||
if (savedTheme) {
|
||||
body.dataset.theme = savedTheme;
|
||||
} else {
|
||||
// Check system preference if no saved theme
|
||||
const prefersDark = window.matchMedia('(prefers-color-scheme: dark)').matches;
|
||||
body.dataset.theme = prefersDark ? 'dark' : 'light';
|
||||
localStorage.setItem('theme', body.dataset.theme);
|
||||
}
|
||||
|
||||
// Update toggle button icon
|
||||
darkModeToggle.innerHTML = body.dataset.theme === 'dark'
|
||||
? '<i class="fas fa-sun"></i>'
|
||||
: '<i class="fas fa-moon"></i>';
|
||||
});
|
||||
|
||||
darkModeToggle.addEventListener('click', () => {
|
||||
const newTheme = body.dataset.theme === 'dark' ? 'light' : 'dark';
|
||||
body.dataset.theme = newTheme;
|
||||
localStorage.setItem('theme', newTheme);
|
||||
|
||||
darkModeToggle.innerHTML = newTheme === 'dark'
|
||||
? '<i class="fas fa-sun"></i>'
|
||||
: '<i class="fas fa-moon"></i>';
|
||||
});
|
||||
|
||||
// Mobile menu toggle
|
||||
const menuToggle = document.getElementById('menuToggle');
|
||||
const sidebar = document.querySelector('.sidebar');
|
||||
|
Loading…
Reference in New Issue
Block a user