https://a.fireside.fm/assets/v2/bootstrap5/light_dark_toggle-4b75a…ff66bd87a45fc82165a17f296252e8ab61ea805a.js

1/*!
2 * Color mode toggler for Bootstrap's docs (https://getbootstrap.com/)
3 * Copyright 2011-2025 The Bootstrap Authors
4 * Licensed under the Creative Commons Attribution 3.0 Unported License.
5 */
6
7(() => {
8  "use strict";
9
10  const getStoredTheme = () => localStorage.getItem("theme");
11  const setStoredTheme = (theme) => localStorage.setItem("theme", theme);
12
13  const getPreferredTheme = () => {
14    const storedTheme = getStoredTheme();
15    if (storedTheme) {
16      return storedTheme;
17    }
18
19    return window.matchMedia("(prefers-color-scheme: dark)").matches ? "dark" : "light";
20  };
21
22  const setTheme = (theme) => {
23    if (theme === "auto") {
24      document.documentElement.setAttribute(
25        "data-bs-theme",
26        window.matchMedia("(prefers-color-scheme: dark)").matches ? "dark" : "light",
27      );
28    } else {
29      document.documentElement.setAttribute("data-bs-theme", theme);
30    }
31  };
32
33  setTheme(getPreferredTheme());
34
35  const showActiveTheme = (theme) => {
36    const btnToActive = document.querySelector(`[data-bs-theme-value="${theme}"]`);
37    if (!btnToActive) return;
38
39    /* Deselect all of the options */
40    document.querySelectorAll("[data-bs-theme-value]").forEach((element) => {
41      element.classList.remove("active");
42      element.setAttribute("aria-pressed", "false");
43    });
44
45    /* Update the state of the active button */
46    btnToActive.classList.add("active");
47    btnToActive.setAttribute("aria-pressed", "true");
48  };
49
50  window.matchMedia("(prefers-color-scheme: dark)").addEventListener("change", () => {
51    const storedTheme = getStoredTheme();
52    if (storedTheme !== "light" && storedTheme !== "dark") {
53      setTheme(getPreferredTheme());
54    }
55  });
56
57  window.addEventListener("DOMContentLoaded", () => {
58    showActiveTheme(getStoredTheme() || "auto");
59
60    document.querySelectorAll("[data-bs-theme-value]").forEach((toggle) => {
61      toggle.addEventListener("click", () => {
62        const theme = toggle.getAttribute("data-bs-theme-value");
63        setStoredTheme(theme);
64        setTheme(theme);
65        showActiveTheme(theme, true);
66      });
67    });
68  });
69})();