77( ( ) => {
88 'use strict'
99
10- const storedTheme = localStorage . getItem ( 'theme' )
11-
1210 const getPreferredTheme = ( ) => {
13- if ( storedTheme ) {
14- return storedTheme
15- }
16-
1711 return window . matchMedia ( '(prefers-color-scheme: dark)' ) . matches ? 'dark' : 'light'
1812 }
1913
2014 const setTheme = function ( theme ) {
21- if ( theme === 'auto' && window . matchMedia ( '(prefers-color-scheme: dark)' ) . matches ) {
15+ if ( window . matchMedia ( '(prefers-color-scheme: dark)' ) . matches ) {
2216 document . documentElement . setAttribute ( 'data-bs-theme' , 'dark' )
2317 } else {
2418 document . documentElement . setAttribute ( 'data-bs-theme' , theme )
2721
2822 setTheme ( getPreferredTheme ( ) )
2923
30- const showActiveTheme = theme => {
31- const activeThemeIcon = document . querySelector ( '.theme-icon-active use' )
32- const btnToActive = document . querySelector ( `[data-bs-theme-value="${ theme } "]` )
33- const svgOfActiveBtn = btnToActive . querySelector ( 'svg use' ) . getAttribute ( 'href' )
34-
35- document . querySelectorAll ( '[data-bs-theme-value]' ) . forEach ( element => {
36- element . classList . remove ( 'active' )
37- } )
38-
39- btnToActive . classList . add ( 'active' )
40- activeThemeIcon . setAttribute ( 'href' , svgOfActiveBtn )
41- }
42-
4324 window . matchMedia ( '(prefers-color-scheme: dark)' ) . addEventListener ( 'change' , ( ) => {
44- if ( storedTheme !== 'light' || storedTheme !== 'dark' ) {
45- setTheme ( getPreferredTheme ( ) )
46- }
47- } )
48-
49- window . addEventListener ( 'DOMContentLoaded' , ( ) => {
50- showActiveTheme ( getPreferredTheme ( ) )
51-
52- document . querySelectorAll ( '[data-bs-theme-value]' )
53- . forEach ( toggle => {
54- toggle . addEventListener ( 'click' , ( ) => {
55- const theme = toggle . getAttribute ( 'data-bs-theme-value' )
56- localStorage . setItem ( 'theme' , theme )
57- setTheme ( theme )
58- showActiveTheme ( theme )
59- } )
60- } )
25+ setTheme ( getPreferredTheme ( ) )
6126 } )
6227} ) ( )
0 commit comments