Add Tags tutorial + small typo fix

CNAME

@@ -1 +1 @@
-docs.geode-sdk.org
+docs.geode-sdk.org

geometrydash/index.md

@@ -0,0 +1,6 @@
+---
+title: Geometry Dash
+order: 6
+---
+
+These pages contain documentation for Geometry Dash.

geometrydash/tags.md

@@ -0,0 +1,71 @@
+---
+title: Tags
+order: 1
+---
+
+# Tags
+
+In Geometry Dash, there are tags you can use for things such as `FLAlertLayer`, `DialogLayer`, or `MDPopup`...
+
+Let's learn how to use these tags:
+
+## Color
+
+In Geometry Dash, there are color tags, which change the color of text. Below is an example using some of these color tags:
+
+| **Tag** | **Color Code** | **Example**                           |
+|---------|----------------|---------------------------------------|
+| `<cb>`  | `0x4A52E1`     | <p style="color: #4A52E1;">Sample</p> |
+| `<cg>`  | `0x40E348`     | <p style="color: #40E348;">Sample</p> |
+| `<cl>`  | `0x60ABEF`     | <p style="color: #60ABEF;">Sample</p> |
+| `<cj>`  | `0x32C8FF`     | <p style="color: #32C8FF;">Sample</p> |
+| `<cy>`  | `0xFFFF00`     | <p style="color: #FFFF00;">Sample</p> |
+| `<co>`  | `0xFF5A4B`     | <p style="color: #FF5A4B;">Sample</p> |
+| `<cr>`  | `0xFF5A5A`     | <p style="color: #FF5A5A;">Sample</p> |
+| `<cp>`  | `0xFF00FF`     | <p style="color: #FF00FF;">Sample</p> |
+| `<ca>`  | `0x9632FF`     | <p style="color: #9632FF;">Sample</p> |
+| `<cd>`  | `0xFF96FF`     | <p style="color: #FF96FF;">Sample</p> |
+| `<cc>`  | `0xFFFF96`     | <p style="color: #FFFF96;">Sample</p> |
+| `<cf>`  | `0x96FFFF`     | <p style="color: #96FFFF;">Sample</p> |
+| `<cs>`  | `0xFFDC41`     | <p style="color: #FFDC41;">Sample</p> |
+| `<c_>`  | `0xFF0000`     | <p style="color: #FF0000;">Sample</p> |
+
+To use these tags, follow the syntax below:
+
+```
+"Welcome to my red <cr>lair</c>! As you can see, my <cg>things</c> are green, and my <cb>doorframe</c> is blue! Why? That's up to <co>Rob</c><cj>Top</c> to answer!"
+```
+
+By using `</c>`, you are closing the tag. `</c>` closes all color tags.
+
+## Delay
+
+In Geometry Dash, there are also delay tags to wait a certain amount of centiseconds (1/100 of a second) before more text appearing. Below is an example:
+
+```
+Wait!<d040> You shouldn't go there<d500>.<d500>.<d500>.
+```
+
+In the `<d...>` tag, the number next to the `<d` specifies the number of centiseconds to wait. This number must be 3 digits. This is how it looks like in-game (GIF from GDDocs):
+
+![GIF showing delay tag](/assets/delay_tag.gif)
+
+## Shake
+
+Shake tags make text shake. Below is an example:
+
+```
+<co>I HAVE SAID TOO MUCH! QUICKLY TO THE <s260>CHOPPER!</s></c>
+```
+
+In the `<s...>` tag, the number next to the `<s` specifies the intensity of the shaking. For reference, this is how it looks like in-game (GIF from GDDocs):
+
+![GIF showing shake tag](/assets/shake_tag.gif)
+
+# Instant/Fade
+
+Fade Tags are used to fade in a block of text on screen instead of making it appear character by character. Similarly to colour tags, Fade tags have a start and end tag to denote which piece of text should appear instantly. The number is specified in centiseconds, which is 1/100th of a second.
+
+Usage: `Hello, <i100>world!</i>`
+
+![GIF showing fade tag](/assets/fadein_tag.gif)

misc/ios.md

@@ -4,7 +4,7 @@ title: iOS Development Setup
 
 # iOS Development Setup
 
-You will have to edit your `CMakeLists.txt` on your exiting mods. Newer created mods will already have this change
+You will have to edit your `CMakeLists.txt` on your existing mods. Newer created mods will already have this change
 ```cmake
 # At the beginning of your CMakeLists.txt, change this:
 #  set(CMAKE_OSX_ARCHITECTURES "arm64;x86_64")

tutorials/popup.md

@@ -69,30 +69,7 @@ public:
 
 ## Colored text
 
-`FLAlertLayer` supports colored text in the content field by default. You can add colors with **color tags**, for example `<cy>Hi mom!</c>` will produce yellow text. The built-in color tags in GD are:
-
-| Tag | Color                               |
-|-----|-------------------------------------|
-| cb  | <span style="color: #4a52e1">Blue</span>   |
-| cg  | <span style="color: #40e348">Green</span>  |
-| cl  | <span style="color: #60abef">Aqua</span>   |
-| cj  | <span style="color: #32c8ff">Cyan</span>   |
-| cy  | <span style="color: #ffff00">Yellow</span> |
-| co  | <span style="color: #ffa54b">Orange</span> |
-| cr  | <span style="color: #ff5a5a">Red</span>    |
-| cp  | <span style="color: #ff00ff">Pink</span>   |
-
-```cpp
-FLAlertLayer::create(
-    "Color Example",
-    "This is <cp>pink text</c>!",
-    "OK"
-)->show();
-```
-
-Note that the closing tag **must be `</c>` only without the color specified again**. Doing otherwise will likely result in a crash.
-
-> You might wonder about how to use other colors than the ones listed; there are currently no plans in Geode to add that, but one could easily make a mod that adds support for arbitary color tags.
+`FLAlertLayer` supports colored text in the content field by default. You can add colors with **color tags**, for example `<cy>Hi mom!</c>` will produce yellow text. The built-in color tags in GD are listed [here](../geometrydash/tags.md)
 
 ## Disabling the popup animation