git.iko.soy/urbit.org
on master help sign in
components: pull ecosystem badge into component
commit31e8a0a30057033358e20b95136d972edff76749 authorMatilde Park <matilde.park@urbit.org> dateTue 29 Nov 2022, 16:36 (4 years ago) parent0befd73
3 files changed+26−43
compare with master
unifiedsplit
components/ecosystem/Badge.js+20 components/ecosystem/IndexCard.js+2−22 components/ecosystem/Post.js+4−21
components/ecosystem/Badge.jsnew file+20
@@ -0,0 +1,20 @@
1+import classnames from "classnames";
2+export default function EcosystemBadge({ type }) {
3+ return (
4+ <div
5+ className={classnames(
6+ "uppercase font-bold text-white text-xs w-fit rounded-lg mb-2 px-2 py-1",
7+ {
8+ "bg-[#B37ED7]": type === "Organization",
9+ "bg-[#83b2d4]": type === "Application",
10+ "bg-wall-600": type === "Podcast",
11+ "bg-[#8dd5b1]": type === "Marketplace",
12+ "bg-[#B5966D]": type === "Article",
13+ "bg-[#219DFF]": type === "Group",
14+ }
15+ )}
16+ >
17+ {type}
18+ </div>
19+ );
20+}
components/ecosystem/IndexCard.js+2−22
@@ -1,5 +1,5 @@
11import Link from "next/link";
2−import classnames from "classnames";
2+import EcosystemBadge from "./Badge";
33export default function IndexCard({ slug, feat }) {
44 return (
55 <Link href={slug}>
@@ -24,7 +24,7 @@ export default function IndexCard({ slug, feat }) {
2424 )}
2525 <div className="pt-4">
2626 <p className="mb-2 font-semibold leading-5">{feat.title}</p>
27− {badge(feat.type)}
27+ <EcosystemBadge type={feat.type} />
2828 <p className="text-sm leading-5">{feat?.description}</p>
2929 </div>
3030 </div>
@@ -32,23 +32,3 @@ export default function IndexCard({ slug, feat }) {
3232 </Link>
3333 );
3434}
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-5 px-2 py-1",
41− {
42− "bg-[#B37ED7]": type === "Organization",
43− "bg-[#83b2d4]": type === "Application",
44− "bg-[#219DFF]": type === "Group",
45− "bg-wall-600": type === "Podcast",
46− "bg-[#8dd5b1]": type === "Marketplace",
47− "bg-[#B5966D]": type === "Article",
48− }
49− )}
50− >
51− {type}
52− </div>
53− );
54−};
components/ecosystem/Post.js+4−21
@@ -1,5 +1,6 @@
11import { Markdown } from "@urbit/foundation-design-system";
2−import classnames from "classnames";
2+import EcosystemBadge from "./Badge";
3+
34import Link from "next/link";
45export default function Post({ post }) {
56 return ["featured-1", "featured-2", "featured-3"].map((feat) => {
@@ -34,7 +35,7 @@ export default function Post({ post }) {
3435 <h4 className="text-xl pb-2 leading-6 font-bold">
3536 {post?.[feat].title}
3637 </h4>
37− {badge(post[feat].type)}
38+ <EcosystemBadge type={post[feat].type} />
3839 </div>
3940 </div>
4041 <div className="markdown mt-8 mb-8">
@@ -94,22 +95,4 @@ export default function Post({ post }) {
9495 });
9596}
9697
97−const badge = (type) => {
98− return (
99− <div
100− className={classnames(
101− "uppercase font-bold text-white text-xs w-fit rounded-lg mb-2 px-2 py-1",
102− {
103− "bg-[#B37ED7]": type === "Organization",
104− "bg-[#83b2d4]": type === "Application",
105− "bg-wall-600": type === "Podcast",
106− "bg-[#8dd5b1]": type === "Marketplace",
107− "bg-[#B5966D]": type === "Article",
108− "bg-[#219DFF]": type === "Group",
109− }
110− )}
111− >
112− {type}
113− </div>
114− );
115−};
98+