From ac0cf6f7eed35702db00a6c108420b926864371a Mon Sep 17 00:00:00 2001
From: jyswee <jyswee@gmail.com>
Date: Thu, 23 Jul 2026 23:02:20 +0000
Subject: [PATCH] Seed: developer-tools template (15 files)

---
 src/pages/Status.tsx | 14 +++++++-------
 1 file changed, 7 insertions(+), 7 deletions(-)

diff --git a/src/pages/Status.tsx b/src/pages/Status.tsx
index 44391a3..213193c 100644
--- a/src/pages/Status.tsx
+++ b/src/pages/Status.tsx
@@ -43,7 +43,7 @@ function StatusDot({ status }: { status: string }) {
     degraded: "bg-amber-500",
     down: "bg-red-500",
   };
-  return <span className={`h-3 w-3 rounded-full \${colors[status] || colors.operational} inline-block`} />;
+  return <span className={`h-3 w-3 rounded-full ${colors[status] || colors.operational} inline-block`} />;
 }
 
 export default function StatusPage() {
@@ -56,7 +56,7 @@ export default function StatusPage() {
       <div className="pt-32 pb-24 mx-auto max-w-4xl px-6">
         {/* Overall Status */}
         <div className="text-center mb-16">
-          <div className={`inline-flex items-center gap-3 px-6 py-3 rounded-full mb-6 \${
+          <div className={`inline-flex items-center gap-3 px-6 py-3 rounded-full mb-6 ${
             allOperational
               ? "bg-emerald-500/10 border border-emerald-500/20"
               : "bg-amber-500/10 border border-amber-500/20"
@@ -66,7 +66,7 @@ export default function StatusPage() {
             ) : (
               <AlertTriangle className="h-6 w-6 text-amber-400" />
             )}
-            <span className={`text-lg font-semibold \${allOperational ? "text-emerald-400" : "text-amber-400"}`}>
+            <span className={`text-lg font-semibold ${allOperational ? "text-emerald-400" : "text-amber-400"}`}>
               {allOperational ? "All Systems Operational" : "Partial Degradation"}
             </span>
           </div>
@@ -84,7 +84,7 @@ export default function StatusPage() {
             {services.map((service, i) => (
               <div
                 key={service.name}
-                className={`flex items-center justify-between py-4 \${
+                className={`flex items-center justify-between py-4 ${
                   i < services.length - 1 ? "border-b border-slate-800" : ""
                 }`}
               >
@@ -93,7 +93,7 @@ export default function StatusPage() {
                   <span className="font-medium text-white">{service.name}</span>
                 </div>
                 <div className="flex items-center gap-4">
-                  <Badge variant="outline" className={`text-xs \${
+                  <Badge variant="outline" className={`text-xs ${
                     service.status === "operational"
                       ? "text-emerald-400 border-emerald-500/30"
                       : service.status === "degraded"
@@ -122,10 +122,10 @@ export default function StatusPage() {
               {Array.from({ length: 90 }).map((_, i) => (
                 <div
                   key={i}
-                  className={`flex-1 rounded-sm \${
+                  className={`flex-1 rounded-sm ${
                     i === 62 ? "bg-amber-500" : i === 71 ? "bg-amber-500" : "bg-emerald-500/60"
                   }`}
-                  title={`Day \${90 - i}`}
+                  title={`Day ${90 - i}`}
                 />
               ))}
             </div>