Made project count badge dynamic

Author: mrinmoyChakraborty-mrinox

web-app/index.html

@@ -628,7 +628,7 @@ <h1>
                     <h2 class="hero-title">Learn Python the Fun Way!</h2>
                     <p class="hero-subtitle">Small browser experiments for games, math, utilities, and terminal-style practice.</p>
                     <div class="hero-meta" aria-label="Project summary">
-                        <span>25+ projects</span>
+                        <span id="projectCountBadge">25+ projects</span>
                         <span>zero setup</span>
                         <span>beginner friendly</span>
                     </div>

web-app/js/main.js

@@ -83,7 +83,13 @@ document.addEventListener('DOMContentLoaded', function () {
     var removeTrap = null;
     var lastFocusedElement = null;
     var recentSearches = JSON.parse(localStorage.getItem('recentSearches') || '[]');
+    //-----------------------project count badge------------------------------------
+    const projectCountBadge = document.getElementById("projectCountBadge");
+    const projectCount = document.querySelectorAll(".project-card").length;
 
+    if (projectCountBadge) {
+        projectCountBadge.textContent = `${projectCount} projects`;
+    }
     // ── Theme Toggle ────────────────────────────────────────────────
     function updateThemeToggleAria(isLightTheme) {
         if (!themeToggle) return;