mcp/carbon-components-svelte
1
0
Fork 0
mirror of https://github.com/carbon-design-system/carbon-components-svelte.git synced 2025-09-14 18:01:06 +00:00
Code Issues Projects Releases Packages Wiki Activity

docs(theme): use Theme component from library (#1700)

Browse source
This commit is contained in:
Gregor Wassmann 2023-03-25 00:10:50 +01:00 • committed by GitHub
commit aa2e97f110
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
2 changed files with 3 additions and 32 deletions
Download patch file Download diff file Expand all files Collapse all files

30
docs/src/components/Theme.svelte
View file

@ -1,30 +0,0 @@
<script>
export let persist = false;
export let persistKey = "carbon-theme";
export const themes = ["white", "g10", "g80", "g90", "g100"];
import { onMount, afterUpdate } from "svelte";
import { theme } from "../store";
const isValidTheme = (value) => themes.includes(value);
onMount(() => {
try {
const persisted_theme = localStorage.getItem(persistKey);
if (isValidTheme(persisted_theme)) theme.set(persisted_theme);
} catch (e) {}
});
afterUpdate(() => {
if (isValidTheme($theme)) {
document.documentElement.setAttribute("theme", $theme);
if (persist) {
try {
localStorage.setItem(persistKey, $theme);
} catch (e) {}
}
}
});
</script>
<slot />

5
docs/src/pages/_layout.svelte
View file

@ -12,10 +12,11 @@
SideNav,
SideNavItems,
SideNavMenuItem,
Theme,
Tag,
} from "carbon-components-svelte";
import LogoGithub from "carbon-icons-svelte/lib/LogoGithub.svelte";
import Theme from "../components/Theme.svelte";
import { theme } from "../store";
const deprecated = [];
const new_components = [];
@ -38,7 +39,7 @@
<!-- routify:options bundle=true -->
<svelte:window bind:innerWidth />
<Theme persist>
<Theme persist bind:theme="{$theme}">
<Header
aria-label="Navigation"
href="{$url('/')}"