Mode:
Duration:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
document.addEventListener('DOMContentLoaded', () => {
const counterEl = document.getElementById('counter');
const incrementBtn = document.getElementById('increment');
const decrementBtn = document.getElementById('decrement');
const resetBtn = document.getElementById('reset');
const toggleThemeBtn = document.getElementById('toggleTheme');
const appEl = document.getElementById('app');
let count = parseInt(localStorage.getItem('count') || '0', 10);
let isDark = localStorage.getItem('isDark') === 'true';
const updateUI = () => {
counterEl.textContent = `Counter: ${count}`;
appEl.className = isDark ? 'dark-theme' : 'light-theme';
toggleThemeBtn.textContent = `Switch to ${isDark ? 'Light' : 'Dark'} Theme`;
};
incrementBtn.addEventListener('click', () => { count++; saveAndUpdate(); });
decrementBtn.addEventListener('click', () => { count--; saveAndUpdate(); });
resetBtn.addEventListener('click', () => { count = 0; saveAndUpdate(); });
toggleThemeBtn.addEventListener('click', () => { isDark = !isDark; saveAndUpdate(); });
function saveAndUpdate() {
localStorage.setItem('count', count);
localStorage.setItem('isDark', isDark);
updateUI();
}
updateUI();
});Coding works best on desktop or with an external keyboard.