From 2f6764027ec8a93432739f6ca34a46ed19e6ac6a Mon Sep 17 00:00:00 2001
From: "Claude (Chronicler #60)" <claude@firefrostgaming.com>
Date: Sun, 5 Apr 2026 08:59:33 +0000
Subject: [PATCH] Dynamic server count on servers page
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

WHAT WAS DONE:
- Hero text now shows dynamic count from API
- 'Nine Minecraft experiences' → '[count] Minecraft experiences'
- Count updates when servers load

Signed-off-by: Claude (Chronicler #60) <claude@firefrostgaming.com>
---
 servers.njk | 8 ++++++--
 1 file changed, 6 insertions(+), 2 deletions(-)

diff --git a/servers.njk b/servers.njk
index bb595e4..81fcec7 100644
--- a/servers.njk
+++ b/servers.njk
@@ -1,13 +1,13 @@
 ---
 layout: layouts/base.njk
 title: Our Servers
-description: Nine Minecraft experiences. One community built to last. All servers available to all subscribers.
+description: Minecraft experiences. One community built to last. All servers available to all subscribers.
 ---
 
 <!-- SERVERS PAGE - HERO -->
 <div style="padding: 100px 40px; background: linear-gradient(135deg, #0f0f1e 0%, #1a1a2e 100%); text-align: center;">
   <h1 style="font-size: 4rem; font-weight: 900; margin-bottom: 30px; color: #ffffff; text-shadow: 2px 2px 8px rgba(0,0,0,0.7);">Our Servers</h1>
-  <p style="font-size: 1.5rem; color: #a8dadc; max-width: 900px; margin: 0 auto 40px; line-height: 1.8;">Nine Minecraft experiences. One community built to last.</p>
+  <p style="font-size: 1.5rem; color: #a8dadc; max-width: 900px; margin: 0 auto 40px; line-height: 1.8;"><span id="server-count">Multiple</span> Minecraft experiences. One community built to last.</p>
   <p style="font-size: 1.8rem; color: #FFD700; font-weight: 700;">All servers available to all subscribers</p>
 </div>
 
@@ -36,6 +36,7 @@ description: Nine Minecraft experiences. One community built to last. All server
 <script>
 document.addEventListener("DOMContentLoaded", () => {
   const grid = document.getElementById('server-grid');
+  const countEl = document.getElementById('server-count');
   const WORKER_URL = 'https://servers-api.michael-b25.workers.dev';
 
   function fetchServers() {
@@ -47,6 +48,9 @@ document.addEventListener("DOMContentLoaded", () => {
           return;
         }
 
+        // Update the count in the hero
+        countEl.textContent = data.servers.length;
+
         grid.innerHTML = data.servers.map(server => {
           const isOnline = server.status === 'Online';
           const statusColor = isOnline ? '#4ecdc4' : '#ff6b35';