| 1234567891011121314151617181920212223242526272829303132333435 |
- import { Injectable, signal } from '@angular/core';
- @Injectable({
- providedIn: 'root'
- })
- export class ThemeService {
- private readonly isDark = signal(false);
- readonly isDarkMode = this.isDark.asReadonly();
- constructor() {
- const stored = localStorage.getItem('theme');
- if (stored === 'dark') {
- this.setDark(true);
- }
- }
- toggle(): void {
- this.setDark(!this.isDark());
- }
- setDark(dark: boolean): void {
- this.isDark.set(dark);
- const html = document.documentElement;
- if (dark) {
- html.classList.add('dark');
- html.classList.remove('light');
- localStorage.setItem('theme', 'dark');
- } else {
- html.classList.remove('dark');
- html.classList.add('light');
- localStorage.setItem('theme', 'light');
- }
- }
- }
|