diff --git a/src/routes/classes/Actions.md b/src/routes/classes/Actions.md
index 7ee91fbf9d..1273b81d2b 100644
--- a/src/routes/classes/Actions.md
+++ b/src/routes/classes/Actions.md
@@ -1,15 +1,15 @@
```svelte example raised
-
-
-
- Updated 12 days ago
-
+
+
+
+ Updated 12 days ago
+
```
diff --git a/src/routes/classes/Base.md b/src/routes/classes/Base.md
index 82abd291c8..ffdda5b3ac 100644
--- a/src/routes/classes/Base.md
+++ b/src/routes/classes/Base.md
@@ -1,7 +1,5 @@
Base should be applied to a "root" element, like ``, to provide base styles for common things like text. The theme mode, `light-theme`, `dark-theme`, or `oled-theme`, should also be added to this element.
```svelte example
-
- ...
-
+
...
```
diff --git a/src/routes/classes/Card.md b/src/routes/classes/Card.md
index 4543e84e44..3f8d553dbb 100644
--- a/src/routes/classes/Card.md
+++ b/src/routes/classes/Card.md
@@ -2,11 +2,13 @@
```svelte example
-
Moon/Distance to Earth
-
238,900 mi
-
- The moon's distance from Earth affects the strength of ocean tides and the appearance of solar eclipses in our skies. The average distance between the blue planet and its only natural satellite is about 238,855 miles (384,400 kilometers), according to NASA.
-
+
Moon/Distance to Earth
+
238,900 mi
+
+ The moon's distance from Earth affects the strength of ocean tides and the appearance of solar
+ eclipses in our skies. The average distance between the blue planet and its only natural
+ satellite is about 238,855 miles (384,400 kilometers), according to NASA.
+
```
@@ -14,18 +16,18 @@
```svelte example
-
-
-
-
-
-
Project
-
A project that has a description right here.
+
+
+
+
+
+
Project
+
A project that has a description right here.
```
diff --git a/src/routes/classes/Divider.md b/src/routes/classes/Divider.md
index 2a5da1e2fd..b3c54789e2 100644
--- a/src/routes/classes/Divider.md
+++ b/src/routes/classes/Divider.md
@@ -6,8 +6,8 @@ Some words could go here.
And some other words could go here.
```
diff --git a/src/routes/classes/InfoTable.md b/src/routes/classes/InfoTable.md
index f873e96799..c34a8c1da7 100644
--- a/src/routes/classes/InfoTable.md
+++ b/src/routes/classes/InfoTable.md
@@ -1,10 +1,10 @@
```svelte example raised
-
- License
- MIT
- Project ID
- 11223344
- Visibilty
- Approved
-
+
+ License
+ MIT
+ Project ID
+ 11223344
+ Visibilty
+ Approved
+
```
diff --git a/src/routes/classes/Link.md b/src/routes/classes/Link.md
index 99267115f2..eff9904f32 100644
--- a/src/routes/classes/Link.md
+++ b/src/routes/classes/Link.md
@@ -8,15 +8,15 @@
```svelte example raised
```
diff --git a/src/routes/classes/Stat.md b/src/routes/classes/Stat.md
index 7bbecdb98e..06d7cff3c1 100644
--- a/src/routes/classes/Stat.md
+++ b/src/routes/classes/Stat.md
@@ -2,12 +2,12 @@
```svelte example raised
-
- 123K stars
+
+ 123K stars
```
@@ -15,18 +15,18 @@
```svelte example raised
-
-
- 4.1B downloads
-
-
-
- 3 followers
-
+
+
+ 4.1B downloads
+
+
+
+ 3 followers
+
```
diff --git a/src/routes/classes/Tags.md b/src/routes/classes/Tags.md
index c850191dc8..13f249dfd7 100644
--- a/src/routes/classes/Tags.md
+++ b/src/routes/classes/Tags.md
@@ -1,15 +1,15 @@
```svelte example raised
-
- Food
-
-
- World generation
-
+
+ Food
+
+
+ World generation
+
```
diff --git a/src/routes/components/Avatar.md b/src/routes/components/Avatar.md
index 47900b7aac..5288aec402 100644
--- a/src/routes/components/Avatar.md
+++ b/src/routes/components/Avatar.md
@@ -2,12 +2,14 @@ Avatars are used for project icons and user profile pictures. Low resolution ima
```svelte example raised
-
+
```
diff --git a/src/routes/components/Badge.md b/src/routes/components/Badge.md
index dfb2004806..11b511d02e 100644
--- a/src/routes/components/Badge.md
+++ b/src/routes/components/Badge.md
@@ -1,6 +1,6 @@
```svelte example raised
diff --git a/src/routes/components/Button.md b/src/routes/components/Button.md
index a1b9bb907f..f56e73c278 100644
--- a/src/routes/components/Button.md
+++ b/src/routes/components/Button.md
@@ -2,8 +2,8 @@
```svelte example
@@ -13,21 +13,21 @@
```svelte example raised
-
-
-
-
-
-
-
-
-
-
+
+
+
+
+
+
+
+
+
+
```
@@ -35,13 +35,13 @@
```svelte example raised
-
-
+
+
```
diff --git a/src/routes/components/Checkbox.md b/src/routes/components/Checkbox.md
index 44c3893b89..98ad274492 100644
--- a/src/routes/components/Checkbox.md
+++ b/src/routes/components/Checkbox.md
@@ -2,7 +2,7 @@
```svelte example raised
Extra components
@@ -12,9 +12,9 @@
```svelte example raised
- Food
+ Food
```
diff --git a/src/routes/components/CheckboxList.md b/src/routes/components/CheckboxList.md
index 5b861b9c75..5dcbca2613 100644
--- a/src/routes/components/CheckboxList.md
+++ b/src/routes/components/CheckboxList.md
@@ -1,37 +1,36 @@
```svelte example raised
+ bind:value={selected}
+ options={[
+ {
+ label: 'Circle',
+ icon: IconCircle,
+ value: 'CIR',
+ },
+ {
+ label: 'Triangle',
+ icon: IconTriangle,
+ value: 'TRI',
+ },
+ {
+ label: 'Square',
+ icon: IconSquare,
+ value: 'SQU',
+ },
+ {
+ label: 'Blank',
+ value: 'BLA',
+ },
+ ]} />
Selected: {selected}
```
diff --git a/src/routes/components/CheckboxVirtualList.md b/src/routes/components/CheckboxVirtualList.md
index fa6eb73ab0..6d4c98a57a 100644
--- a/src/routes/components/CheckboxVirtualList.md
+++ b/src/routes/components/CheckboxVirtualList.md
@@ -1,23 +1,21 @@
```svelte example raised
-
+
Selected: {selected}
```
diff --git a/src/routes/components/Chips.md b/src/routes/components/Chips.md
index d3f196f8a4..f5787a3b55 100644
--- a/src/routes/components/Chips.md
+++ b/src/routes/components/Chips.md
@@ -2,42 +2,46 @@
```svelte example raised
-
+
```
### Force an option to be selected with `neverEmpty`
```svelte example raised
-
+
```
diff --git a/src/routes/components/FormField.md b/src/routes/components/FormField.md
index 2797790633..5d1c20aa54 100644
--- a/src/routes/components/FormField.md
+++ b/src/routes/components/FormField.md
@@ -1,14 +1,14 @@
```svelte example raised
-
+
-
+
```
diff --git a/src/routes/components/NavRow.md b/src/routes/components/NavRow.md
index 8840406f7d..c831161208 100644
--- a/src/routes/components/NavRow.md
+++ b/src/routes/components/NavRow.md
@@ -2,25 +2,25 @@
```svelte example raised
- Click for fun
+ level={1}
+ links={[
+ {
+ href: '/Button',
+ label: 'Button',
+ },
+ {
+ href: '/Chips',
+ label: 'Chips',
+ },
+ {
+ href: '/NavRow',
+ label: 'NavRow',
+ },
+ ]}>
+ Click for fun
```
diff --git a/src/routes/components/Pagination.md b/src/routes/components/Pagination.md
index 11096acadd..0a371947e8 100644
--- a/src/routes/components/Pagination.md
+++ b/src/routes/components/Pagination.md
@@ -2,7 +2,7 @@ Use pagination to show a set of page numbers and navigation directions to move t
```svelte example
diff --git a/src/routes/components/Select.md b/src/routes/components/Select.md
index b044809dc8..164fa605d2 100644
--- a/src/routes/components/Select.md
+++ b/src/routes/components/Select.md
@@ -1,19 +1,17 @@
```svelte example raised
+ options={[
+ { value: '', label: 'Relevance' },
+ { value: 'downloads', label: 'Downloads' },
+ { value: 'follows', label: 'Followers' },
+ { value: 'newest', label: 'Recently' },
+ { value: 'updated', label: 'Recently updated really fast whoot' },
+ ]}
+ bind:value={sortMethod} />
```
diff --git a/src/routes/components/Slider.md b/src/routes/components/Slider.md
index 42c378a5e9..2c8e55e10b 100644
--- a/src/routes/components/Slider.md
+++ b/src/routes/components/Slider.md
@@ -1,7 +1,7 @@
```svelte example raised
-
+
```
diff --git a/src/routes/components/TextInput.md b/src/routes/components/TextInput.md
index 9cbf5f8d04..cdaf6679d7 100644
--- a/src/routes/components/TextInput.md
+++ b/src/routes/components/TextInput.md
@@ -1,7 +1,7 @@
```svelte example raised
diff --git a/src/routes/getting-started/icons.md b/src/routes/getting-started/icons.md
index ebe5efcc81..4ca73b672c 100644
--- a/src/routes/getting-started/icons.md
+++ b/src/routes/getting-started/icons.md
@@ -20,8 +20,8 @@ Then use the icon as if it were a Svelte component:
```svelte example
-
That's lovely !
+
That's lovely !
```
diff --git a/src/routes/getting-started/illustrations.md b/src/routes/getting-started/illustrations.md
index 1870b509dc..e566150b1c 100644
--- a/src/routes/getting-started/illustrations.md
+++ b/src/routes/getting-started/illustrations.md
@@ -14,7 +14,7 @@ Import the SVG in the `
diff --git a/src/routes/getting-started/utils.md b/src/routes/getting-started/utils.md
index a399c9d251..4cd01e592a 100644
--- a/src/routes/getting-started/utils.md
+++ b/src/routes/getting-started/utils.md
@@ -14,16 +14,17 @@ The `markdown` parser is designed for bodies of markdown text and supports image
```svelte example
```
diff --git a/src/routes/index.md b/src/routes/index.md
index 66604f9a8c..b8158b239e 100644
--- a/src/routes/index.md
+++ b/src/routes/index.md
@@ -22,7 +22,7 @@ Use a component by importing from `omorphia`. For example, use the [Button compo
```svelte example raised