|
- <script type="module">
- import * as DarkModeToggle from 'https://unpkg.com/dark-mode-toggle';
-
- const toggle = document.querySelector('dark-mode-toggle');
- const body = document.body;
-
- // Set or remove the `dark` class the first time.
- body.classList.remove('dark');
- body.classList.remove('light');
- if (toggle.mode === 'dark') {
- body.classList.add('dark')
- } else {
- body.classList.add('light')
- }
-
- // Listen for toggle changes (which includes `prefers-color-scheme` changes)
- // and toggle the `dark` class accordingly.
- toggle.addEventListener('colorschemechange', () => {
- body.classList.toggle('dark', toggle.mode === 'dark');
- body.classList.toggle('light', toggle.mode !== 'dark');
- });
- </script>
|