add better youtube and twitch support

EwanLyon · Jan 1, 2024 · 2849482 · 2849482
1 parent e3c23c0
commit 2849482
Show file tree

Hide file tree

Showing 19 changed files with 553 additions and 205 deletions.
diff --git a/.vscode/settings.json b/.vscode/settings.json
@@ -0,0 +1,5 @@
+{
+	"cSpell.words": [
+		"vfile"
+	]
+}
diff --git a/docs/assets/favicon.png b/docs/assets/favicon.png
diff --git a/docs/guides/100/_category_.json b/docs/guides/100/_category_.json
@@ -1,4 +1,8 @@
 {
 	"label": "100%",
-	"position": 5
+	"position": 3,
+	"link": {
+	  "type": "generated-index",
+	  "title": "100% Guides"
+	}
 }
diff --git a/docs/guides/any/_category_.json b/docs/guides/any/_category_.json
@@ -1,4 +1,8 @@
 {
 	"label": "Any%",
-	"position": 4
+	"position": 2,
+	"link": {
+	  "type": "generated-index",
+	  "title": "Any% Guides"
+	}
 }
diff --git a/docs/guides/any/level-1.md b/docs/guides/any/level-1.md
@@ -1,3 +1,9 @@
+---
+sidebar_position: 1
+sidebar_custom_props:
+  category_image: /speedrun-docs/img/run-man.svg # This is in dev while I wait for Docusaurus 3.1.0 to come out
+---
+
 # Level 1
 
 :::note Example File

diff --git a/docs/guides/deploying.mdx b/docs/guides/deploying.mdx
@@ -12,6 +12,14 @@ You should remove this page when making your docs.
 1. Set your GitHub username as an environment variable:
 
 <Tabs>
+<TabItem value="cmd" label="CMD/Windows Terminal">
+
+```cmd
+set GIT_USER=<GitHub-Username>
+```
+
+</TabItem>
+
 <TabItem value="ps" label="Powershell">
 
 ```powershell
@@ -25,13 +33,6 @@ $env:GIT_USER="<GitHub-Username>"
 GIT_USER=<GitHub-Username> npm run deploy
 ```
 
-</TabItem>
-<TabItem value="cmd" label="CMD/Windows Terminal">
-
-```cmd
-set GIT_USER=<GitHub-Username>
-```
-
 </TabItem>
 </Tabs>
 

diff --git a/docs/guides/embedding-content.md b/docs/guides/embedding-content.md
@@ -0,0 +1,56 @@
+---
+sidebar_position: 5
+---
+
+# Embedding Content
+
+:::note Speedrun Docs Guide
+
+You should remove this page when making your docs.
+
+:::
+
+## Images and Local Videos
+
+1. Add the image to the `static` folder at the root directory.
+2. Add `![Title of image](<path to file>)`.
+
+Example:
+
+`![Speedrun Docs Logo](/img/run-man.svg)`
+![Speedrun Docs Logo](/img/run-man.svg)
+
+:::tip Speedrun Docs Logo
+
+Feel free to modify and customise the logo to your desired game! An example can be seen in the [Heavenly Bodies Docs](https://ewanlyon.github.io/HeavenlyBodies-SpeedrunDocs/).
+
+:::
+
+## Online Videos
+
+Currently Speedrun-docs supports:
+
+- YouTube Videos
+- Twitch Clips
+- Twitch VODs
+- Twitch Channels
+
+### YouTube
+
+`![ASM2023 AFL Evolution Pop-off](https://www.youtube.com/watch?v=DI8vHDrvJGc&t=943s)`
+
+![ASM2023 AFL Evolution Pop-off](https://www.youtube.com/watch?v=DI8vHDrvJGc&t=943s)
+
+### Twitch
+
+`![AusSpeedruns Channel](https://www.twitch.tv/ausspeedruns)`
+
+`![Little Intermission Goofing Clip](https://www.twitch.tv/ausspeedruns/clip/LuckyDirtyPheasantWOOP-KmnZnto7H0NjjaQM)`
+
+`![ASM2023 AFL Evolution VOD](https://www.twitch.tv/videos/1872434389?collection=_twiuAyjchdwJQ&t=00h15m42s)`
+
+![AusSpeedruns Channel](https://www.twitch.tv/ausspeedruns)
+
+![Little Intermission Goofing Clip](https://www.twitch.tv/ausspeedruns/clip/LuckyDirtyPheasantWOOP-KmnZnto7H0NjjaQM)
+
+![ASM2023 AFL Evolution VOD](https://www.twitch.tv/videos/1872434389?collection=_twiuAyjchdwJQ&t=00h15m42s)
diff --git a/docs/guides/embedding-content.mdx b/docs/guides/embedding-content.mdx
diff --git a/docs/guides/index.md b/docs/guides/index.md
@@ -47,6 +47,33 @@ To create pages make a new text file with the file extension `.md` in the `docs/
 
 To create nested pages create a folder and add the file there.
 
+### Front matter
+
+Docusaurus has support for more information at the top of a markdown file called "front matter".
+
+```yaml
+---
+sidebar_position: 1
+description: This is a handmade description for a page
+sidebar_custom_props:
+  image: <url>
+---
+```
+
+#### Speedrun-Docs Custom Props
+
+Speedrun Docs will have support for more built in theming.
+
+| Property        | Type   |
+|-----------------|--------|
+| [image](#image) | String |
+
+##### image
+
+Adding a `sidebar_custom_props` to the front matter and then adding an `image` property under that (like in the example above), will add an image to the generated sidebar document view.
+
+An example of this can be seen in the [Any% generated page](category/any) and in the front matter for [Level 1](any/level-1.md).
+
 ## Adding new tabs
 
 Adding a new tab at the top such as the "Tutorial" and "Resources" tab.

diff --git a/docs/guides/markdown-guide.md b/docs/guides/markdown-guide.md
@@ -1,5 +1,5 @@
 ---
-sidebar_position: 2
+sidebar_position: 4
 ---
 
 # Markdown