https://shikokuchuo.net/ichimoku/lightswitch.js

1
2/*!
3 * Color mode toggler for Bootstrap's docs (https://getbootstrap.com/)
4 * Copyright 2011-2023 The Bootstrap Authors
5 * Licensed under the Creative Commons Attribution 3.0 Unported License.
6 * Updates for {pkgdown} by the {bslib} authors, also licensed under CC-BY-3.0.
7 */
8
9const getStoredTheme = () => localStorage.getItem('theme')
10const setStoredTheme = theme => localStorage.setItem('theme', theme)
11
12const getPreferredTheme = () => {
13  const storedTheme = getStoredTheme()
14  if (storedTheme) {
15    return storedTheme
16  }
17
18  return window.matchMedia('(prefers-color-scheme: dark)').matches ? 'dark' : 'light'
19}
20
21const setTheme = theme => {
22  if (theme === 'auto') {
23    document.documentElement.setAttribute('data-bs-theme', (window.matchMedia('(prefers-color-scheme: dark)').matches ? 'dark' : 'light'))
24  } else {
25    document.documentElement.setAttribute('data-bs-theme', theme)
26  }
27}
28
29function bsSetupThemeToggle() {
30  'use strict'
31
32  const showActiveTheme = (theme, focus = false) => {
33    var activeLabel, activeIcon;
34
35    document.querySelectorAll('[data-bs-theme-value]').forEach(element => {
36      const buttonTheme = element.getAttribute('data-bs-theme-value')
37      const isActive = buttonTheme == theme
38
39      element.classList.toggle('active', isActive)
40      element.setAttribute('aria-pressed', isActive)
41
42      if (isActive) {
43        activeLabel = element.textContent;
44        activeIcon = element.querySelector('span').classList.value;
45      }
46    })
47
48    const themeSwitcher = document.querySelector('#dropdown-lightswitch')
49    if (!themeSwitcher) {
50      return
51    }
52
53    themeSwitcher.setAttribute('aria-label', activeLabel)
54    themeSwitcher.querySelector('span').classList.value = activeIcon;
55
56    if (focus) {
57      themeSwitcher.focus()
58    }
59  }
60
61  window.matchMedia('(prefers-color-scheme: dark)').addEventListener('change', () => {
62    const storedTheme = getStoredTheme()
63    if (storedTheme !== 'light' && storedTheme !== 'dark') {
64      setTheme(getPreferredTheme())
65    }
66  })
67
68  window.addEventListener('DOMContentLoaded', () => {
69    showActiveTheme(getPreferredTheme())
70
71    document
72      .querySelectorAll('[data-bs-theme-value]')
73      .forEach(toggle => {
74        toggle.addEventListener('click', () => {
75          const theme = toggle.getAttribute('data-bs-theme-value')
76          setTheme(theme)
77          setStoredTheme(theme)
78          showActiveTheme(theme, true)
79        })
80      })
81  })
82}
83
84setTheme(getPreferredTheme());
85bsSetupThemeToggle();