Update Badges (#12)

* Refactor Config

* Rename Icons and Clone

* Pre GitHub Badge

* BAD GitHub Badge Implementation

* Not Much Better Badge Implementation

* Remove Github

* Slightly Better Badges

* Cleanup

* Update Config

Author: smashedr

src/html/index.html

@@ -40,20 +40,26 @@ <h1 class="animate__animated animate__zoomIn"><i class="fa-brands fa-github me-2
     </p>
 
     <h2 id="web-extensions">Web Extensions</h2>
-    <div class="row row-cols-1 row-cols-md-2 row-cols-xl-3 g-3 mb-4" id="ext-container"></div>
+    <div class="row row-cols-1 row-cols-md-2 row-cols-xl-3 g-3 mb-4" id="webExtensions"></div>
 
     <h2 id="web-apps" class="" data-aos="zoom-in">Web Apps</h2>
-    <div class="row row-cols-1 row-cols-md-2 row-cols-xl-3 g-3 mb-4" id="apps-container"></div>
+    <div class="row row-cols-1 row-cols-md-2 row-cols-xl-3 g-3 mb-4" id="webApps"></div>
 
     <h2 id="github-actions" class="" data-aos="zoom-in">GitHub Actions</h2>
-    <div class="row row-cols-1 row-cols-md-2 row-cols-xl-3 g-3 mb-4" id="actions-container"></div>
+    <div class="row row-cols-1 row-cols-md-2 row-cols-xl-3 g-3 mb-4" id="githubActions"></div>
 
     <h2 id="other-software" class="" data-aos="zoom-in">Other Software</h2>
-    <div class="row row-cols-1 row-cols-md-2 row-cols-xl-3 g-3 mb-4" id="other-container"></div>
+    <div class="row row-cols-1 row-cols-md-2 row-cols-xl-3 g-3 mb-4" id="otherSoftware"></div>
 
 </div> <!-- container -->
 
-<div class="d-none clone">
+<div class="text-center bounce d-none" id="scroll-down">
+    Scroll Down for More
+    <br>
+    <i class="fa-solid fa-angles-down fa-xl"></i>
+</div> <!-- scroll-down -->
+
+<div id="clone" class="d-none">
     <div class="col info-card" data-aos="flip-up">
         <div class="card h-100">
             <div class="card-body">
@@ -75,13 +81,7 @@ <h4 class="card-title">
     <i class="devicon-python-plain colored" data-bs-toggle="tooltip" data-bs-placement="bottom" data-bs-title="Python"></i>
     <i class="devicon-javascript-plain colored" data-bs-toggle="tooltip" data-bs-placement="bottom" data-bs-title="JavaScript"></i>
     <i class="devicon-typescript-plain colored" data-bs-toggle="tooltip" data-bs-placement="bottom" data-bs-title="TypeScript"></i>
-</div> <!-- d-none clone -->
-
-<div class="text-center bounce d-none" id="scroll-down">
-    Scroll Down for More
-    <br>
-    <i class="fa-solid fa-angles-down fa-xl"></i>
-</div> <!-- scroll-down -->
+</div> <!-- clone -->
 
 {% comment %}<script src="https://cdnjs.cloudflare.com/ajax/libs/animejs/3.2.2/anime.min.js" integrity="sha512-aNMyYYxdIxIaot0Y1/PLuEu3eipGCmsEUBrUq+7aVyPGMFH8z0eTP0tkqAvv34fzN6z+201d3T8HPb1svWSKHQ==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>{% endcomment %}
 {% comment %}<script src="https://cdnjs.cloudflare.com/ajax/libs/ScrollMagic/2.0.8/ScrollMagic.min.js" integrity="sha512-8E3KZoPoZCD+1dgfqhPbejQBnQfBXe8FuwL4z/c8sTrgeDMFEnoyTlH3obB4/fV+6Sg0a0XF+L/6xS4Xx1fUEg==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>{% endcomment %}