Upload 2 files

script.js

@@ -77,7 +77,7 @@ function render(reset = true) {
       <h4>${e.name}</h4>
       <p>${e.desc}</p>
       <span class="method">${e.method}</span>
-      <span class="status">${e.isActive ? "Active" : "Inactive"}</span>
+      <span class="status ${e.isActive ? "active" : "inactive"}">${e.isActive ? "Active" : "Inactive"}</span>
     `;
     card.onclick = () => openModal(e);
     grid.appendChild(card);
@@ -122,7 +122,7 @@ function openModal(e) {
     <p>${e.desc}</p>
     <p><strong>Method:</strong> ${e.method}</p>
     ${e.params.length ? `<p><strong>Params:</strong> ${e.params.join(", ")}</p>` : ""}
-    <p><strong>Status:</strong> ${e.isActive ? "Active" : "Inactive"}</p>
+    <p><strong>Status:</strong> <span class="status ${e.isActive ? "active" : "inactive"}">${e.isActive ? "Active" : "Inactive"}</span></p>
     <div class="code-snippet">curl -X ${e.method} "${url}"</div>
     <div style="margin-top:1rem">
       <button class="btn-copy" onclick="navigator.clipboard.writeText('${url}')">Copy URL</button>

styles.css

@@ -136,9 +136,10 @@ nav a:hover { color: var(--accent-solid); }
 .status {
   position: absolute; bottom: 1rem; right: 1rem;
   font-size: .7rem; font-weight: 600;
-  color: #000; background: #ffb347;
-  padding: .2rem .5rem; border-radius: 12px;
+  color: #000; padding: .2rem .5rem; border-radius: 12px;
 }
+.status.active   { background: #2ecc71; }
+.status.inactive { background: #e74c3c; }
 .load-more {
   display: block; margin: 2.5rem auto 0;
   padding: .75rem 2rem; border: 1px solid var(--accent-solid);