diff --git a/src/routes/classes/Actions.md b/src/routes/classes/Actions.md
index 7ee91fbf9..1273b81d2 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 82abd291c..ffdda5b3a 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 4543e84e4..3f8d553db 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 2a5da1e2f..b3c54789e 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 f873e9679..c34a8c1da 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 99267115f..eff9904f3 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 7bbecdb98..06d7cff3c 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 c850191dc..13f249dfd 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 47900b7aa..5288aec40 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 dfb200480..11b511d02 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 a1b9bb907..f56e73c27 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 44c3893b8..98ad27449 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 5b861b9c7..5dcbca261 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 fa6eb73ab..6d4c98a57 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 d3f196f8a..f5787a3b5 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 279779063..5d1c20aa5 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 8840406f7..c83116120 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 11096acad..0a371947e 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 b044809dc..164fa605d 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 42c378a5e..2c8e55e10 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 9cbf5f8d0..cdaf6679d 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 ebe5efcc8..4ca73b672 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 1870b509d..e566150b1 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 a399c9d25..4cd01e592 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 66604f9a8..b8158b239 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