badges

frontend/src/components/SubmissionList.tsx

@@ -5,8 +5,13 @@ import { useLiveUpdates } from "../contexts/LiveUpdateContext";
 import { ExternalLink } from "lucide-react";
 
 const StatusBadge = ({ status }: { status: TwitterSubmission["status"] }) => {
-  const className = `status-badge status-${status}`;
-  return <span className={className}>{status}</span>;
+  const baseClasses = "px-2 py-1 rounded-full text-sm font-semibold border";
+  const statusClasses = {
+    pending: "bg-yellow-200 text-yellow-900 border-yellow-400",
+    approved: "bg-green-200 text-green-900 border-green-400",
+    rejected: "bg-red-200 text-red-900 border-red-400"
+  };
+  return <span className={`${baseClasses} ${statusClasses[status]}`}>{status}</span>;
 };
 
 const SubmissionList = () => {

frontend/src/index.css

@@ -14,19 +14,4 @@
   .card-shadow {
     @apply border-2 border-gray-800 shadow-sharp hover:shadow-sharp-hover transition-shadow duration-200 translate-x-0 translate-y-0 hover:-translate-x-0.5 hover:-translate-y-0.5;
   }
-  .status-badge {
-    @apply px-2 py-1 rounded-full text-sm font-semibold;
-  }
-
-  .status-pending {
-    @apply bg-yellow-100 text-yellow-800;
-  }
-
-  .status-approved {
-    @apply bg-green-100 text-green-800;
-  }
-
-  .status-rejected {
-    @apply bg-red-100 text-red-800;
-  }
 }