Added Motionia to the resources page

Author: dangerworm

pages-resources/resources-tools.html

@@ -59,7 +59,8 @@ <h4>
                     and 2 minutes to learn. All the icons on this site are thanks to Font Awesome.
                 </p>
                 <p>
-                    We use FontAwesome for all the icons on this site, so for some examples check out the source code for
+                    We use FontAwesome for all the icons on this site, so for some examples check out the source code
+                    for
                     this page.
                 </p>
             </div>
@@ -87,6 +88,24 @@ <h4>
         </div>
     </div>
 
+    <div class="col-lg-4 col-md-6 d-flex align-items-stretch">
+        <div class="row">
+            <div class="card">
+                <h4>
+                    <span class="fab fa-js-square"></span>
+                    <a href="https://www.cssscript.com/animation-engine-motionia/" target="_blank">Motionia</a>
+                    <span class="badge badge-danger">Hard</span>
+                </h4>
+                <p>
+                    Motionia is a lightweight, easy-to-use JavaScript animation library that provides over 100
+                    performant animations to pick from, which animate any elements on a web page and even change
+                    attributes such as colour and background. You can also start from the
+                    <a href="https://github.com/abhiprojectz/motionia" target="_blank">the Motionia GitHub repo</a>.
+                </p>
+            </div>
+        </div>
+    </div>
+
     <div class="col-lg-4 col-md-6 d-flex align-items-stretch">
         <div class="row">
             <div class="card">