Allow filtering of projects

src/components/ProjectCard.astro

@@ -14,9 +14,16 @@ interface Props {
   project: CollectionEntry<"projects">;
   textOn?: "left" | "right";
   quality?: number;
+  class?: string;
 }
 
-const { project, textOn = "left", quality = "80" } = Astro.props;
+const {
+  project,
+  textOn = "left",
+  quality = "80",
+  class: className,
+  ...attrs
+} = Astro.props;
 
 const images = getAllProjectImages(project);
 
@@ -124,7 +131,10 @@ const projectHasBody = project.body && project.body.trim().length > 0;
 const link = `/projects/${slugify(project.data.type)}/${slugify(project.data.slug)}/`;
 ---
 
-<div class="grid grid-cols-1 text-left md:grid-cols-2">
+<div
+  class:list={["grid grid-cols-1 text-left md:grid-cols-2", className]}
+  {...attrs}
+>
   <div
     class:list={[
       "order-1 flex flex-col items-start justify-center py-4",