@@ -2,11 +2,28 @@ import classnames from "classnames";
22import Link from "next/link";
33
44export default function GrantPreview({ grant }) {
5+ const isOpen = !grant.extra.completed && grant.extra.assignee === "";
6+ const type = grant.taxonomies.grant_type;
7+
8+ const className = classnames({
9+ "bg-lightBlue": type.includes("Proposal") && isOpen,
10+ "bg-lightGreen": type.includes("Apprenticeship") && isOpen,
11+ "bg-lightYellow": type.includes("Bounty") && isOpen,
12+ });
13+
514 return (
6− <div key={grant.slug} className="mb-4 cursor-pointer bg-wall rounded-lg">
15+ <div
16+ key={grant.slug}
17+ className={`mb-4 cursor-pointer bg-wall rounded-lg ${className}`}
18+ >
719 <Link href={`/grants/${grant.slug}`}>
820 <div className="p-8">
9− <h3 className="type-ui mb-4">{grant.title}</h3>
21+ <div className="flex items-center mb-4">
22+ <h3 className="type-ui">{grant.title}</h3>
23+ <div className={`bg-gray text-wall badge-sm ml-2`}>
24+ {isOpen ? "Open" : "Completed"}
25+ </div>
26+ </div>
1027 <p className="mb-4">{grant.extra.description}</p>
1128 <div className="flex w-full flex-col md:flex-row md:items-center justify-between">
1229 <p className="text-gray">