Update illustrations & icons docs + Fixes

This commit is contained in:
venashial
2022-05-07 17:22:33 -07:00
parent 91b602341b
commit fd936e5bf3
13 changed files with 228 additions and 229 deletions

View File

@@ -2,6 +2,20 @@
title: Using illustrations
---
TODO
Find an illustration from [unDraw](https://undraw.co/illustrations) and download it as an SVG.
Use `.illustration` class.
Put the illustration in the `src/assets/images/illustrations` folder. Rename it to `undraw_` + the illustration slug.
Replace colors in the SVG with CSS variables such as `var(--color-brand)` and `var(--color-raised)`. For colors that are the same as the font color, use `currentColor`.
Add the `.illustration` class to the SVG
Import the SVG in the `<script>` of your svelte file, and treat the illustration as a Svelte component:
```svelte
<script>
import NoData from '$assets/images/illustrations/undraw_no_data.svg'
</script>
<NoData />
```