Kitchen Sink
Published at Jul 23, 2023
Photo by Jacek Dylag on Unsplash
Chucking things in here to see how they will render.
Headers
# Heading 1
## Heading 2
### Heading 3
#### Heading 4
##### Heading 5
###### Heading 6
Heading 1
Heading 2
Heading 3
Heading 4
Heading 5
Heading 6
Emphasis
_Italic text_
**Bold text**
**_Bold and italic text_**
~~Strikethrough text~~
Italic text
Bold text
Bold and italic text
Strikethrough text
Lists
Unordered List
- Item 1
- Item 2
- Item 3
- Item 1
- Item 2
- Item 3
Ordered List
1. First item
2. Second item
3. Third item
- First item
- Second item
- Third item
Links
[Link to Google](https://www.google.com)
Images
![Alt text](/images/family-workout-cover.jpg)
Code Blocks
````javascript
export function toggleTheme() {
theme.update((currentTheme) => {
const newTheme = currentTheme === 'dark' ? 'light' : 'dark';
document.documentElement.setAttribute('data-theme', newTheme);
localStorage.setItem('data-theme', newTheme);
return newTheme;
});
}
```
```javascript
export function toggleTheme() {
theme.update((currentTheme) => {
const newTheme = currentTheme === 'dark' ? 'light' : 'dark';
document.documentElement.setAttribute('data-theme', newTheme);
localStorage.setItem('data-theme', newTheme);
return newTheme;
});
}
```
And inline code looks like this - `npm install mdsvex`
## Blockquotes
```markdown
> This is a blockquote.
```
> This is a blockquote.
## Horizontal Rule
```markdown
---
```
---
## Tables
```markdown
| Column 1 | Column 2 |
| -------- | -------- |
| Cell 1 | Cell 2 |
| Cell 3 | Cell 4 |
```
| Column 1 | Column 2 |
| -------- | -------- |
| Cell 1 | Cell 2 |
| Cell 3 | Cell 4 |
## Task Lists
```markdown
- [x] Task 1
- [ ] Task 2
- [ ] Task 3
```
- [x] Task 1
- [ ] Task 2
- [ ] Task 3
## Svelte Components
```svelte
<script>
import Name from '$lib/components/Name.svelte';
</script>
<Name />
```
<script>
import P5Wrapper from '$lib/components/P5Wrapper.svelte';
import Name from '$lib/components/Name.svelte';
</script>
<Name />
## p5js Sketches
```svelte
<script>
import P5Wrapper from '$lib/components/P5Wrapper.svelte';
</script>
<P5Wrapper path={'../../_content/sketches/continuous-loop/sketch.ts'} />
```
<P5Wrapper path={'../../_content/sketches/continuous-loop/sketch.ts'} />