@@ -0,0 +1,52 @@
1+import { Markdown } from "foundation-design-system";
2+import classnames from "classnames";
3+import Link from "next/link";
4+export default function Post({ post }) {
5+ return ["featured-1", "featured-2", "featured-3"].map((feat) => {
6+ return post?.[feat] ? (
7+ <div className="mt-8 mb-24">
8+ <div className="flex space-x-4 items-center">
9+ <img
10+ className="rounded-xl w-24 object-cover"
11+ src={post[feat].image}
12+ />
13+ <div className="flex flex-col">
14+ <h4 className="text-2xl font-bold">{post?.[feat].title}</h4>
15+ {badge(post[feat].type)}
16+ {post[feat].type !== "Application" && (
17+ <a className="font-bold text-green-400" href={post[feat].URL}>
18+ {post[feat].URL.slice(post[feat].URL.indexOf("://") + 3)}
19+ </a>
20+ )}
21+ {post[feat].type === "Application" && (
22+ <Link href={`/applications/${post[feat].URL}`}>
23+ <a>{post[feat].URL}</a>
24+ </Link>
25+ )}
26+ </div>
27+ </div>
28+ <div className="markdown mt-8">
29+ <Markdown.render content={JSON.parse(post[feat].content)} />
30+ </div>
31+ </div>
32+ ) : null;
33+ });
34+}
35+
36+const badge = (type) => {
37+ return (
38+ <div
39+ className={classnames(
40+ "uppercase font-bold text-white text-xs w-fit rounded-lg mb-2 px-2 py-1",
41+ {
42+ "bg-[#B37ED7]": type === "Organization",
43+ "bg-[#83b2d4]": type === "Application",
44+ "bg-[#8dd5b1]": type === "Podcast",
45+ "bg-[#8dd5b1]": type === "Marketplace",
46+ }
47+ )}
48+ >
49+ {type}
50+ </div>
51+ );
52+};