fix: replace data-theme with data-bs-theme to be compatible with Boot…

…strap dark mode
razonyang · Aug 16, 2022 · abca9c0 · abca9c0
1 parent d31e780
commit abca9c0
Show file tree

Hide file tree

Showing 2 changed files with 5 additions and 2 deletions.
diff --git a/assets/js/mode/index.ts b/assets/js/mode/index.ts
@@ -70,7 +70,8 @@ class ModeToggle implements Component {
  value = getPreferMode();
  }
  console.debug(`Switch to ${value} mode`);
- document.body.parentElement.setAttribute('data-theme', value);
+ document.body.parentElement.setAttribute('data-theme', value); // TODO: remove in v1
+ document.body.parentElement.setAttribute('data-bs-theme', value);
  const event = new CustomEvent('hbs:mode', { detail: { mode: value } });
  document.dispatchEvent(event);
  }

diff --git a/layouts/_default/baseof.html b/layouts/_default/baseof.html
@@ -3,7 +3,9 @@
 {{- if not (in (slice "light" "dark" "auto") $color) }}
  {{- $color = "auto" }}
 {{- end }}
-<html class="position-relative" itemscope itemtype="http:https://schema.org/WebPage" lang="{{ .Lang }}" data-theme="{{ $color }}"
+<html class="position-relative" itemscope itemtype="http:https://schema.org/WebPage" lang="{{ .Lang }}"
+ data-theme="{{ $color }}" {{/* TODO: remove in v1 */}}
+ data-bs-theme="{{ $color }}"
  {{- with $.Site.Language.LanguageDirection }} dir="{{ . }}"{{ end }}
  {{- with $.Site.Params.palette }} data-palette="{{ replace . " " "-" }}"{{ end }}>
  <head>