💗 Added the gif tutorials

instructions/instructions.md

@@ -2,7 +2,7 @@
     Instructions for using TumblrTextTint
 </h2>
 
-<p align="justify">There are two ways of accessing the web app: via your computer or on a smaller mobile device. The instructions will cover both methods. Afterwards, it will show you how to insert the code to your Tumblr blog post. Unfortunately, this method can only be done on a computer or laptop since the option of seeing the rich HTML editor is not available on a mobile device. Without further ado, here's how to use TumblrTextTint!</p>
+<p align="justify">There are two ways of accessing the web app: via your computer or on a smaller mobile device. The instructions will cover both methods. Afterwards, it will show you how to insert the code to your Tumblr blog post. Unfortunately, this method can only be done on a computer or laptop since the option of seeing the HTML editor is not available on a mobile device. Without further ado, here's how to use TumblrTextTint!</p>
 
 <h3>Table of Contents</h3>
 <ul>
@@ -11,12 +11,14 @@
   <li><a href="https://github.com/xiacodes/TumblrTextTint/edit/main/instructions/instructions.md#inserting-the-code-to-your-tumblr-blog-post">Inserting the Code to your Tumblr Blog Post</a></li>
 </ul>
 
--------
+---
 
 <h3>On The Computer</h3>
+<br>
 <div align="center">
     <img src="web-tutorial.gif" alt="Web tutorial gif">
 </div>
+<br>
 <ol>
   <li>Navigate to the TumblrTextTint website at <a href="https://xiacodes.github.io/TumblrTextTint/">https://xiacodes.github.io/TumblrTextTint/</a></li>
   <li>Type or paste your desired text into the input field.</li>
@@ -26,12 +28,14 @@
   <li>Click the "reset" button to start again if you need to.</li>
 </ol>
 
--------
+---
 
 <h3>On Mobile/Tablet Devices</h3>
+<br>
 <div align="center">
     <img src="mobile-tutorial.gif" alt="Moblie tutorial gif">
 </div>
+<br>
 <ol>
 <li>Open a web browser on your mobile or tablet device.</li>
   <li>Navigate to the TumblrTextTint website at <a href="https://xiacodes.github.io/TumblrTextTint/">https://xiacodes.github.io/TumblrTextTint/</a></li>
@@ -42,13 +46,15 @@
   <li>Tap the "reset" button to start again if you need to.</li>
 </ol>
 
--------
+---
 
 <h3>Inserting the Code to your Tumblr Blog Post</h3>
-<p align="justify">To insert the HTML code generated by TumblrTextTint into your Tumblr blog post, you will need to access the rich HTML editor for your post. This can only be done on a computer or laptop, as the rich HTML editor is not available on the mobile version of Tumblr - like I mentioned before.</p>
+<br>
 <div align="center">
     <img src="tumblr-tutorial.gif" alt="Tumblr tutorial gif">
 </div>
+<br>
+<p align="justify">To insert the HTML code generated by TumblrTextTint into your Tumblr blog post, you will need to access the HTML editor for your post. This can only be done on a computer or laptop, as the HTML editor is not available on the mobile version of Tumblr - like I mentioned before.</p>
 <ol>
 <li>Log in to your Tumblr account on your computer.</li>
   <li>Create a new blog post or edit an existing one.</li>
@@ -58,9 +64,7 @@
   <li>Switch back to the rich text editor to view and edit your post as usual!</li>
 </ol>
 
-----------
-
-
+---
 
 With these instructions, you can use TumblrTextTint to format your Tumblr blog posts with custom colors for your text!