Add Guides to Categories

src/help/guides/categories.md

@@ -4,7 +4,80 @@ lang: en-US
 ---
 
 # Categories
-:construction: :construction_worker_man: W.I.P. Description, help us improve through [here](https://github.com/tachiyomiorg/website/edit/master/src/help/guides/categories.md)!
+Categories helps to keep your library neat and organized.
 
-## Guide?
-:construction: :construction_worker_man: W.I.P.
+## Create a Category
+You can create a Category in `Triple dots > Edit Categories` then press the button with a plus.
+::: expander <strong>Click to reveal video guide!</strong>
+<figure class="centered">
+	<video autoplay crossorigin="use-credentials" height="534"
+	  intrinsicsize="500x100" loading="lazy" loop="loop" muted="muted"
+	  playsinline="playsinline" :poster="$withBase('/assets/media/createcategory.png')"
+	  preload="none" width="300">
+		<source :src="$withBase('/assets/media/createcategory.webm')" type="video/webm" />
+		<source :src="$withBase('/assets/media/createcategory.mp4')" type="video/mp4" />
+	</video>
+</figure>
+:::
+
+## Edit a Category
+You can edit a Category in `Triple dots > Edit Categories` then long press the category you want to edit, then press the pen icon.
+::: expander <strong>Click to reveal video guide!</strong>
+<figure class="centered">
+	<video autoplay crossorigin="use-credentials" height="534"
+	  intrinsicsize="500x100" loading="lazy" loop="loop" muted="muted"
+	  playsinline="playsinline" :poster="$withBase('/assets/media/editcategory.png')"
+	  preload="none" width="300">
+		<source :src="$withBase('/assets/media/editcategory.webm')" type="video/webm" />
+		<source :src="$withBase('/assets/media/editcategory.mp4')" type="video/mp4" />
+	</video>
+</figure>
+:::
+
+## Delete a Gategory
+You can delete a Category in `Triple dots > Edit Categories` then long press the category you want to delete, then press the trash can icon.
+::: expander <strong>Click to reveal video guide!</strong>
+<figure class="centered">
+	<video autoplay crossorigin="use-credentials" height="534"
+	  intrinsicsize="500x100" loading="lazy" loop="loop" muted="muted"
+	  playsinline="playsinline" :poster="$withBase('/assets/media/removecategory.png')"
+	  preload="none" width="300">
+		<source :src="$withBase('/assets/media/removecategory.webm')" type="video/webm" />
+		<source :src="$withBase('/assets/media/removecategory.mp4')" type="video/mp4" />
+	</video>
+</figure>
+:::
+
+## Add Manga to Category
+You can add a Manga to a Category by long pressing on the one you want to add. Then press the square looking icon. Thereafter select which category you want it in. You can also add multiple manga to a category by selecting them when you see the square looking icon.
+::: tip
+You can add a Manga to multiple Categories by selecting the categories you want to have it in
+:::
+::: expander <strong>Click to reveal video guide!</strong>
+<figure class="centered">
+	<video autoplay crossorigin="use-credentials" height="534"
+	  intrinsicsize="500x100" loading="lazy" loop="loop" muted="muted"
+	  playsinline="playsinline" :poster="$withBase('/assets/media/addmangatocategory.png')"
+	  preload="none" width="300">
+		<source :src="$withBase('/assets/media/addmangatocategory.webm')" type="video/webm" />
+		<source :src="$withBase('/assets/media/addmangatocategory.mp4')" type="video/mp4" />
+	</video>
+</figure>
+:::
+
+## Delete Manga from Category
+You can delete a Manga from a Category by long pressing on the one you want. Then press the square looking icon. Thereafter deselect which category you want to remove it from. You can also remove multiple manga from a category by selecting them when you see the square looking icon.
+::: tip
+You can remove a Manga to multiple Categories by selecting the categories you want to have it in
+:::
+::: expander <strong>Click to reveal video guide!</strong>
+<figure class="centered">
+	<video autoplay crossorigin="use-credentials" height="534"
+	  intrinsicsize="500x100" loading="lazy" loop="loop" muted="muted"
+	  playsinline="playsinline" :poster="$withBase('/assets/media/removemangafromcategory.png')"
+	  preload="none" width="300">
+		<source :src="$withBase('/assets/media/removemangafromcategory.webm')" type="video/webm" />
+		<source :src="$withBase('/assets/media/removemangafromcategory.mp4')" type="video/mp4" />
+	</video>
+</figure>
+:::