tabler-theme.js 1007 B

1234567891011121314151617181920212223242526272829303132333435
  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 themeConfig = {
  7. "theme": "light",
  8. "theme-base": "gray",
  9. "theme-font": "sans-serif",
  10. "theme-primary": "blue",
  11. "theme-radius": "1",
  12. }
  13. const params = new Proxy(new URLSearchParams(window.location.search), {
  14. get: (searchParams, prop) => searchParams.get(prop),
  15. })
  16. for (const key in themeConfig) {
  17. const param = params[key]
  18. let selectedValue
  19. if (!!param) {
  20. localStorage.setItem('tabler-' + key, param)
  21. selectedValue = param
  22. } else {
  23. const storedTheme = localStorage.getItem('tabler-' + key)
  24. selectedValue = storedTheme ? storedTheme : themeConfig[key]
  25. }
  26. if (selectedValue !== themeConfig[key]) {
  27. document.documentElement.setAttribute('data-bs-' + key, selectedValue)
  28. } else {
  29. document.documentElement.removeAttribute('data-bs-' + key)
  30. }
  31. }