Skip to content
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.

Commit c0ff8ff

Browse files
committedMar 26, 2023
chore: Move Theme to GlobalTheme
The reason for this is that Theme is a new v11 component that allows for inline theming. That’s a different purpose than this component has. In the standard Carbon implementation a GlobalTheme is used that matches the purpose of what this Svelte component used to do. The idea is to stick to the same name as the standard implementation.
1 parent 4c5d8cd commit c0ff8ff

12 files changed

+9
-9
lines changed
 

‎docs/src/pages/components/Theme.svx renamed to ‎docs/src/pages/components/GlobalTheme.svx

+9-9
Original file line numberDiff line numberDiff line change
@@ -5,10 +5,10 @@
55
let code = `import "carbon-components-svelte/css/all.css";`;
66
</script>
77

8-
The `Theme` component can dyanmically update the Carbon theme on the client-side. It can persist the theme locally using [window.localStorage](https://developer.mozilla.org/en-US/docs/Web/API/Window/localStorage).
8+
The `GlobalTheme` component can dyanmically update the Carbon theme on the client-side. It can persist the theme locally using [window.localStorage](https://developer.mozilla.org/en-US/docs/Web/API/Window/localStorage).
99

1010
<InlineNotification svx-ignore lowContrast title="Note:" kind="info" hideCloseButton>
11-
<div class="body-short-01">You must use the "all.css" StyleSheet with the <code>Theme</code> component.</div>
11+
<div class="body-short-01">You must use the "all.css" StyleSheet with the <code>GlobalTheme</code> component.</div>
1212
</InlineNotification>
1313

1414
The `all.css` StyleSheet uses [CSS variables](https://developer.mozilla.org/en-US/docs/Web/CSS/Using_CSS_custom_properties) for dynamic theming.
@@ -17,40 +17,40 @@ The `all.css` StyleSheet uses [CSS variables](https://developer.mozilla.org/en-U
1717

1818
## Default
1919

20-
<FileSource src="/framed/Theme/Theme" />
20+
<FileSource src="/framed/GlobalTheme/GlobalTheme" />
2121

2222
## Persist locally
2323

2424
Set `persist` to `true` to persist the theme locally using the [Window.localStorage API](https://developer.mozilla.org/en-US/docs/Web/API/Window/localStorage).
2525

26-
<FileSource src="/framed/Theme/ThemePersist" />
26+
<FileSource src="/framed/GlobalTheme/GlobalThemePersist" />
2727

2828
## Custom theme
2929

3030
Define keys and values in the `tokens` prop that override default Carbon theme tokens. Refer to the [Carbon website](https://carbondesignsystem.com/guidelines/themes/overview#customizing-a-theme) for guidance on customizing a theme using token values.
3131

32-
<FileSource src="/framed/Theme/ThemeTokens" />
32+
<FileSource src="/framed/GlobalTheme/GlobalThemeTokens" />
3333

3434
## Theme toggle
3535

3636
Set `render` to `"toggle"` to render a toggle switch to control the theme.
3737

38-
<FileSource src="/framed/Theme/ThemeToggle" />
38+
<FileSource src="/framed/GlobalTheme/GlobalThemeToggle" />
3939

4040
## Theme toggle (custom)
4141

4242
Customize the toggle using the `toggle` prop.
4343

44-
<FileSource src="/framed/Theme/ThemeToggleCustom" />
44+
<FileSource src="/framed/GlobalTheme/GlobalThemeToggleCustom" />
4545

4646
## Theme select
4747

4848
Set `render` to `"select"` to render a select dropdown to control the theme.
4949

50-
<FileSource src="/framed/Theme/ThemeSelect" />
50+
<FileSource src="/framed/GlobalTheme/GlobalThemeSelect" />
5151

5252
## Theme select (custom)
5353

5454
Customize the select using the `select` prop.
5555

56-
<FileSource src="/framed/Theme/ThemeSelectCustom" />
56+
<FileSource src="/framed/GlobalTheme/GlobalThemeSelectCustom" />
File renamed without changes.
File renamed without changes.
File renamed without changes.

0 commit comments

Comments
 (0)
Please sign in to comment.