Fix defaults

This commit is contained in:
saberzero1 2024-10-17 17:01:05 +02:00
parent 65052b865d
commit 753ea31711
No known key found for this signature in database
GPG Key ID: 41AEE99107640F10
3 changed files with 13 additions and 7 deletions

View File

@ -63,7 +63,7 @@ type Options = {
category: string category: string
categoryId: string categoryId: string
// defaults to 'https://giscus.app' // defaults to 'https://giscus.app/themes'
themeUrl?: string themeUrl?: string
// defaults to 'light' // defaults to 'light'

View File

@ -37,6 +37,9 @@ export default ((opts: Options) => {
data-strict={boolToStringBool(opts.options.strict ?? true)} data-strict={boolToStringBool(opts.options.strict ?? true)}
data-reactions-enabled={boolToStringBool(opts.options.reactionsEnabled ?? true)} data-reactions-enabled={boolToStringBool(opts.options.reactionsEnabled ?? true)}
data-input-position={opts.options.inputPosition ?? "bottom"} data-input-position={opts.options.inputPosition ?? "bottom"}
data-light-theme={opts.options.lightTheme ?? "light"}
data-dark-theme={opts.options.darkTheme ?? "dark"}
data-theme-url={opts.options.themeUrl ?? "https://giscus.app/themes"}
></div> ></div>
) )
} }

View File

@ -17,11 +17,14 @@ const changeTheme = (e: CustomEventMap["themechange"]) => {
}, },
}, },
}, },
getThemeUrl(), getThemeUrl(getThemeName(theme)),
) )
} }
const getThemeName = (theme: "light" | "dark") => { const getThemeName = (theme: string) => {
if (theme !== "dark" && theme !== "light") {
return theme
}
const giscusContainer = document.querySelector(".giscus") as GiscusElement const giscusContainer = document.querySelector(".giscus") as GiscusElement
if (!giscusContainer) { if (!giscusContainer) {
return theme return theme
@ -31,12 +34,12 @@ const getThemeName = (theme: "light" | "dark") => {
return theme === "dark" ? darkGiscus : lightGiscus return theme === "dark" ? darkGiscus : lightGiscus
} }
const getThemeUrl = () => { const getThemeUrl = (theme: string) => {
const giscusContainer = document.querySelector(".giscus") as GiscusElement const giscusContainer = document.querySelector(".giscus") as GiscusElement
if (!giscusContainer) { if (!giscusContainer) {
return "https://giscus.app" return `https://giscus.app/themes/${theme}.css`
} }
return giscusContainer.dataset.themeUrl ?? "https://giscus.app" return `${giscusContainer.dataset.themeUrl ?? "https://giscus.app/themes"}/${theme}.css`
} }
type GiscusElement = Omit<HTMLElement, "dataset"> & { type GiscusElement = Omit<HTMLElement, "dataset"> & {
@ -78,7 +81,7 @@ document.addEventListener("nav", () => {
const theme = document.documentElement.getAttribute("saved-theme") const theme = document.documentElement.getAttribute("saved-theme")
if (theme) { if (theme) {
giscusScript.setAttribute("data-theme", theme) giscusScript.setAttribute("data-theme", getThemeName(theme))
} }
giscusContainer.appendChild(giscusScript) giscusContainer.appendChild(giscusScript)