UI for workflow templates (#1715)

Co-authored-by: Muhammed Salih Altun <muhammedsalihaltun@gmail.com>

skyvern-frontend/src/routes/discover/WorkflowTemplateCard.tsx

@@ -0,0 +1,30 @@
+type Props = {
+  title: string;
+  image: string;
+  onClick: () => void;
+};
+
+function WorkflowTemplateCard({ title, image, onClick }: Props) {
+  return (
+    <div className="h-48 w-56 cursor-pointer rounded-xl" onClick={onClick}>
+      <div className="h-28 bg-slate-elevation1 px-6 pt-6">
+        <img
+          src={image}
+          alt={title}
+          className="h-full w-full rounded-t-xl object-cover"
+        />
+      </div>
+      <div className="h-20 space-y-1 rounded-b-xl bg-slate-elevation2 p-3">
+        <h1
+          className="overflow-hidden text-ellipsis whitespace-nowrap"
+          title={title}
+        >
+          {title}
+        </h1>
+        <p className="text-sm text-slate-400">Template</p>
+      </div>
+    </div>
+  );
+}
+
+export { WorkflowTemplateCard };