Adopt page, minor adjustment to backend

web/components/PetCard.js

@@ -0,0 +1,21 @@
+//Pet cards (on adopt page)
+
+import Link from "next/link";
+import { getSpeciesEmoji, getStatusClass } from "@/components/petUtils";
+
+export default function PetCard({petId, petName, petSpecies, petStatus}) {
+  return (
+    <Link href={`/adopt/${petId}`} className="pet-card">
+      <div className="pet-card-image-wrapper">
+        <span className="pet-card-emoji">{getSpeciesEmoji(petSpecies)}</span>
+      </div>
+      <div className="pet-card-body">
+        <h3 className="pet-card-name">{petName}</h3>
+        <p className="pet-card-species">{petSpecies}</p>
+        <span className={`pet-card-status ${getStatusClass(petStatus)}`}>
+          {petStatus}
+        </span>
+      </div>
+    </Link>
+  );
+}