Skip to content

Commit 0cce822

Browse files
authored
docs(readme.md): add svelte example
1 parent e0bbb03 commit 0cce822

File tree

1 file changed

+32
-0
lines changed

1 file changed

+32
-0
lines changed

README.md

Lines changed: 32 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -83,6 +83,38 @@ console.log(theme);
8383
// => "--colors-primary: red;--colors-secondary: blue;--shadows-main: box-shadow: 1px 1px black;--font-family-primary: Arial;"
8484
```
8585

86+
### Svelte example
87+
ThemeProvider.svelte
88+
```html
89+
<script>
90+
import { theme } from './my-design-system';
91+
import generateCSSVariables from 'css-vars-from-json';
92+
93+
const style = generateCSSVariables(theme);
94+
</script>
95+
96+
<div {style}>
97+
<slot />
98+
</div>
99+
```
100+
101+
App.svelte
102+
```html
103+
<script>
104+
import ThemeProvider from './ThemeProvider.svelte';
105+
</script>
106+
107+
<ThemeProvider>
108+
<h1>Hi</h1>
109+
</ThemeProvider>
110+
111+
<style>
112+
h1 {
113+
color: var(--color-primary);
114+
}
115+
</style>
116+
```
117+
86118
## Run tests
87119

88120
```sh

0 commit comments

Comments
 (0)