demo-theme.js 877 B

12345678910111213141516171819202122232425262728
  1. /**
  2. * demo-theme is specifically loaded right after the body and not deferred
  3. * to ensure we switch to the chosen dark/light theme as fast as possible.
  4. * This will prevent any flashes of the light theme (default) before switching.
  5. */
  6. const themeStorageKey = "tablerTheme"
  7. const defaultTheme = "light"
  8. let selectedTheme
  9. // https://stackoverflow.com/a/901144
  10. const params = new Proxy(new URLSearchParams(window.location.search), {
  11. get: (searchParams, prop) => searchParams.get(prop),
  12. })
  13. if (!!params.theme) {
  14. localStorage.setItem(themeStorageKey, params.theme)
  15. selectedTheme = params.theme
  16. } else {
  17. const storedTheme = localStorage.getItem(themeStorageKey)
  18. selectedTheme = storedTheme ? storedTheme : defaultTheme
  19. }
  20. if (selectedTheme === 'dark') {
  21. document.body.setAttribute("data-bs-theme", selectedTheme)
  22. } else {
  23. document.body.removeAttribute("data-bs-theme")
  24. }