on master help sign in
pages, components: revise for og card layout
commit8bd0e94bc7c8342b283e835b5a0a3b4f9617998b authorMatilde Park <matilde.park@urbit.org> dateWed 17 Aug 2022, 11:47 (4 years ago) parent8d9e23b
18 files changed+106−130
components/BasicPage.js+1−1 components/ecosystem/BasicPage.js+6−8 pages/applications/[[...application]].js+4−15 pages/blog/[slug].js+1−2 pages/community/[[...slug]].js+1−1 pages/ecosystem/index.js+1−1 pages/ecosystem/spotlight/[slug].js+1−1 pages/events/[slug].js+1−1 pages/getting-started/[[...slug]].js+1−1 pages/grants/[slug].js+1−1 pages/groups/[[...group]].js+4−22 pages/ids/[id].js+13−22 pages/index.js+66−46 pages/marketplaces/[slug].js+1−1 pages/organizations/[slug].js+1−4 pages/overview/[[...slug]].js+1−1 pages/podcasts/[slug].js+1−1 pages/updates/[slug].js+1−1
components/BasicPage.js+1−1
@@ -22,7 +22,7 @@ export default function BasicPage({ post, markdown, search, index = false }) {
2222 return (
2323 <Container>
2424 <Head>
25− <title>Urbit • {post.title}</title>
25+ <title>{post.title}</title>
2626 {Meta(post)}
2727 </Head>
2828 <IntraNav ourSite="https://urbit.org" search={search} />
components/ecosystem/BasicPage.js+6−8
@@ -29,7 +29,7 @@ export default function BasicPage({
2929 <Container>
3030 <Head>
3131 <title>
32− {post.title} • {section} • Urbit
32+ {post.title} • {section}
3333 </title>
3434 {Meta(post)}
3535 </Head>
@@ -40,12 +40,10 @@ export default function BasicPage({
4040 <div className="flex items-center space-x-4">
4141 <img src={post.image} className="w-36" />
4242 <div className="flex flex-col pl-2">
43− <h1
44− className={classnames({ "text-3xl": section === "Podcasts" })}
45− >
43+ <h1 className={classnames({ "text-3xl": section === "Podcast" })}>
4644 {post.title}
4745 </h1>
48− <p>{section.slice(0, -1)}</p>
46+ <p>{section}</p>
4947 </div>
5048 </div>
5149 {/* General purpose metadata bar -- podcast listen button is special-cased URL, flexed at the end of the row */}
@@ -63,7 +61,7 @@ export default function BasicPage({
6361 <p className="shrink-0">{post.date}</p>
6462 </div>
6563 )}
66− {post?.URL && section !== "Podcasts" && (
64+ {post?.URL && section !== "Podcast" && (
6765 <div className="flex flex-col">
6866 <p className="font-bold text-wall-400">Website</p>
6967 <a
@@ -74,7 +72,7 @@ export default function BasicPage({
7472 </a>
7573 </div>
7674 )}
77− {post?.URL && section === "Marketplaces" && (
75+ {post?.URL && section === "Urbit Marketplace" && (
7876 <div className="flex flex-col">
7977 <p className="font-bold text-wall-400">Accepts</p>
8078 <p className="text-sm font-semibold font-mono">
@@ -83,7 +81,7 @@ export default function BasicPage({
8381 </div>
8482 )}
8583 </div>
86− {post?.URL && section === "Podcasts" && (
84+ {post?.URL && section === "Podcast" && (
8785 <a
8886 href={post.URL}
8987 className="button-lg bg-green-400 text-white cursor-pointer flex space-x-2"
pages/applications/[[...application]].js+4−15
@@ -24,13 +24,6 @@ const ApplicationPage = ({ data, markdown, organisation, search, params }) => {
2424 if (!ob.isValidPatp(application[0])) {
2525 return <Gateway404 type="application" />;
2626 }
27− const reqParams = [
28− data?.bgColor ? `color=${encodeURIComponent(data?.bgColor)}` : "",
29− data?.image ? `images=${encodeURIComponent(data?.image)}` : "",
30− ].filter((e) => e !== "");
31− const image = `https://urbit-id-og-cards-78ieodof2-urbit.vercel.app/${
32− data.title
33− }.png?${reqParams.join("&")}`;
3427
3528 let devLink;
3629
@@ -60,16 +53,12 @@ const ApplicationPage = ({ data, markdown, organisation, search, params }) => {
6053 return (
6154 <Container>
6255 <Head>
63− <title>{data.title} • Applications • urbit.org</title>
56+ <title>{data.title} • Urbit Application</title>
6457 <link rel="icon" type="image/png" href="/images/favicon.ico" />
65− <meta
66− name="twitter:card"
67− content="summary_large_image"
68− key="twitter-card"
69− />
58+ <meta name="twitter:card" content="summary" key="twitter-card" />
7059 <meta
7160 name="og:title"
72− content={`${data.title} • Applications • urbit.org`}
61+ content={`${data.title} • Urbit Application`}
7362 key="title"
7463 />
7564 <meta
@@ -80,7 +69,7 @@ const ApplicationPage = ({ data, markdown, organisation, search, params }) => {
8069 }
8170 key="description"
8271 />
83− <meta property="twitter:image" content={image} key="image" />
72+ <meta property="twitter:image" content={data.image} key="image" />
8473 </Head>
8574 <IntraNav ourSite="https://urbit.org" search={search} />
8675 <SingleColumn>
pages/blog/[slug].js+1−2
@@ -21,7 +21,6 @@ import {
2121} from "@urbit/foundation-design-system";
2222import Header from "../../components/Header";
2323import Footer from "../../components/Footer";
24−import Contact from "../../components/Contact";
2524import PostPreview from "../../components/PostPreview";
2625import TwoUp from "../../components/TwoUp";
2726
@@ -41,7 +40,7 @@ export default function Post({
4140 <Container>
4241 <Head>
4342 <title>{post.title} • Blog • urbit.org</title>
44− {Meta(post)}
43+ {Meta(post, false, true)}
4544 </Head>
4645 <IntraNav ourSite="https://urbit.org" search={search} />
4746 <SingleColumn>
pages/community/[[...slug]].js+1−1
@@ -62,7 +62,7 @@ export default function UsingLayout({ posts, data, markdown, params, search }) {
6262 return (
6363 <>
6464 <Head>
65− <title>{data.title} • Community • urbit.org</title>
65+ <title>{data.title} • Community</title>
6666 {Meta(data)}
6767 </Head>
6868 <div className="flex h-screen min-h-screen w-screen sidebar">
pages/ecosystem/index.js+1−1
@@ -67,7 +67,7 @@ export default function Ecosystem({
6767 return (
6868 <Container>
6969 <Head>
70− <title>{title} • Urbit</title>
70+ <title>{title}</title>
7171 {Meta(data)}
7272 </Head>
7373 <IntraNav ourSite="https://urbit.org" search={search} />
pages/ecosystem/spotlight/[slug].js+1−1
@@ -24,7 +24,7 @@ export default function BasicPage({ post, markdown, search, index = false }) {
2424 return (
2525 <Container>
2626 <Head>
27− <title>Urbit • {post.title}</title>
27+ <title>Ecosystem Spotlight - {post.title}</title>
2828 {Meta(post)}
2929 </Head>
3030 <IntraNav ourSite="https://urbit.org" search={search} />
pages/events/[slug].js+1−1
@@ -49,7 +49,7 @@ export default function Event({
4949 <Container>
5050 <Head>
5151 <title>{event.title} • Events • urbit.org</title>
52− {Meta(event)}
52+ {Meta(event, false, true)}
5353 </Head>
5454 <IntraNav ourSite="https://urbit.org" search={search} />
5555 <SingleColumn>
pages/getting-started/[[...slug]].js+1−1
@@ -42,7 +42,7 @@ export default function UsingLayout({ posts, data, params, search, markdown }) {
4242 return (
4343 <>
4444 <Head>
45− <title>{data.title} • Getting Started • urbit.org</title>
45+ <title>{data.title} • Getting Started</title>
4646 {Meta(data)}
4747 </Head>
4848 <div className="flex h-screen min-h-screen w-screen sidebar">
pages/grants/[slug].js+1−1
@@ -46,7 +46,7 @@ export default function Grant({ post, markdown, search }) {
4646 return (
4747 <Container>
4848 <Head>
49− <title>{post.title} • Grants • urbit.org</title>
49+ <title>{post.title} • Grant</title>
5050 {Meta(post)}
5151 </Head>
5252 <IntraNav ourSite="https://urbit.org" search={search} />
pages/groups/[[...group]].js+4−22
@@ -24,33 +24,15 @@ const GroupPage = ({ data, markdown, params, search }) => {
2424 return <Gateway404 type="group" />;
2525 }
2626
27− const color = data?.tile && data?.tile.startsWith("#");
28− const reqParams = [
29− color ? `color=${encodeURIComponent(data.tile)}` : "",
30− !color
31− ? `images=${encodeURIComponent(
32− data?.tile ||
33− "https://media.urbit.org/public-links/placeholder-image.png"
34− )}`
35− : "",
36− ].filter((e) => e !== "");
37− const image = `https://urbit-id-og-cards-667veow91-urbit.vercel.app/${
38− data.title
39− }.png?${reqParams.join("&")}`;
40−
4127 return (
4228 <Container>
4329 <Head>
44− <title>{data.title} • Groups • urbit.org</title>
30+ <title>{data.title} • Urbit Group</title>
4531 <link rel="icon" type="image/png" href="/images/favicon.ico" />
46− <meta
47− name="twitter:card"
48− content="summary_large_image"
49− key="twitter-card"
50− />
32+ <meta name="twitter:card" content="summary" key="twitter-card" />
5133 <meta
5234 name="og:title"
53− content={`${data.title} • Groups • urbit.org`}
35+ content={`${data.title} • Urbit Group`}
5436 key="title"
5537 />
5638 <meta
@@ -60,7 +42,7 @@ const GroupPage = ({ data, markdown, params, search }) => {
6042 }
6143 key="description"
6244 />
63− <meta property="twitter:image" content={image} key="image" />
45+ <meta property="twitter:image" content={data.tile} key="image" />
6446 </Head>
6547 <SingleColumn>
6648 <Header search={search} />
pages/ids/[id].js+13−22
@@ -24,15 +24,6 @@ const IdPage = ({ data, markdown, applications, groups, network, params }) => {
2424 return <Gateway404 type="ID" />;
2525 }
2626
27− const reqParams = [
28− data?.bgColor ? `color=${encodeURIComponent(data?.bgColor)}` : "",
29− data?.nickname ? `nickname=${encodeURIComponent(data?.nickname)}` : "",
30− data?.image ? `images=${encodeURIComponent(data?.image)}` : "",
31− ].filter((e) => e !== "");
32− const image = `https://urbit-id-og-cards-kappa.vercel.app/${deSig(
33− id
34− )}.png?${reqParams.join("&")}`;
35−
3627 // Galaxies shouldn't show parents, so store it as boolean here for reference.
3728 const isGalaxy = ob.clan(id) === "galaxy";
3829
@@ -48,24 +39,24 @@ const IdPage = ({ data, markdown, applications, groups, network, params }) => {
4839 return (
4940 <Container>
5041 <Head>
51− <title>{id} • Urbit ID • urbit.org</title>
42+ <title>{id} • Urbit ID</title>
5243 <link rel="icon" type="image/png" href="/images/favicon.ico" />
53− <meta
54− name="twitter:card"
55− content="summary_large_image"
56− key="twitter-card"
57− />
58− <meta
59− name="og:title"
60− content={`${id} • Urbit ID • urbit.org`}
61− key="title"
62− />
44+ <meta name="twitter:card" content="summary" key="twitter-card" />
45+ <meta name="og:title" content={`${id} • Urbit ID`} key="title" />
6346 <meta
6447 name="og:description"
65− content="View more about this Urbit ID on urbit.org."
48+ content={`ID Type: ${
49+ ob.clan(id).slice(0, 1).toUpperCase() + ob.clan(id).slice(1)
50+ }`}
6651 key="description"
6752 />
68− <meta property="twitter:image" content={image} key="image" />
53+ <meta
54+ property="twitter:image"
55+ content={
56+ data?.image || `/api/sigil?patp=${id}&color=${bgColor || "24201E"}`
57+ }
58+ key="image"
59+ />
6960 </Head>
7061 <SingleColumn>
7162 <Section className="space-y-12 w-full" narrow>
pages/index.js+66−46
@@ -19,6 +19,7 @@ import { eventKeys } from "../lib/constants";
1919import IndexCard from "../components/ecosystem/IndexCard";
2020import fs from "fs";
2121import path from "path";
22+import Meta from "../components/Meta";
2223
2324export default function Home({
2425 posts,
@@ -27,10 +28,15 @@ export default function Home({
2728 grantNumbers,
2829 search,
2930}) {
31+ const post = {
32+ title: "Urbit",
33+ description: "A clean-slate OS and network for the 21st century.",
34+ };
3035 return (
3136 <Container>
3237 <Head>
33− <title>urbit.org</title>
38+ <title>Urbit</title>
39+ {Meta(post)}
3440 </Head>
3541 <IntraNav ourSite="https://urbit.org" search={search} />
3642 <SingleColumn>
@@ -47,7 +53,6 @@ export default function Home({
4753 // Hero
4854 }
4955 <Section>
50−
5156 <div className="bg-yellow-100 dark:bg-[#5C5037] w-full p-8 md:p-12 rounded-3xl flex flex-col md:flex-row">
5257 <div className="md:w-10/12 w-full md:mr-6">
5358 <h2 className="m-0 p-0 mr-4 pb-6">Assembly 2022</h2>
@@ -172,44 +177,44 @@ export default function Home({
172177 // Build on Urbit Developer CTA
173178 }
174179 <Section narrow>
175− <h2 className="pb-8">Build on Urbit</h2>
176− <h4 className="pb-6">
177− Urbit is a personal OS designed from scratch to run peer-to-peer
178− applications.
179− </h4>
180− <p className="pb-6">
181− It solves the hard problems of implementing a peer-to-peer network
182− (including identity, NAT traversal, and exactly-once delivery) in
183− the kernel so app developers can focus on business logic.
184− </p>
185− <p className="pb-6">
186− The entire OS is a{" "}
187− <Link href="https://urbit.org/docs/nock/definition/" passHref>
188− <a>single pure function</a>
189− </Link>{" "}
190− that provides application developers with strong guarantees:
191− automated persistence and memory management, repeatable builds,
192− and support for hot code reloading.
193− </p>
194− <p className="pb-10">
195− You can get started learning how to{" "}
196− <Link href="https://urbit.org/docs/development/develop/" passHref>
197− <a>contribute to the project</a>
198− </Link>
199− , or view a variety of{" "}
200− <Link
201− href="https://github.com/urbit/awesome-urbit#http-apis-airlock"
202− passHref
203− >
204− <a>libraries</a>
205− </Link>{" "}
206− for building on Urbit using the languages you already know.
207− </p>
208− <Link href="https://developers.urbit.org" passHref>
209− <a className="button-lg type-ui text-white bg-green-400 max-w-fit">
210− Visit Urbit Developers
211− </a>
180+ <h2 className="pb-8">Build on Urbit</h2>
181+ <h4 className="pb-6">
182+ Urbit is a personal OS designed from scratch to run peer-to-peer
183+ applications.
184+ </h4>
185+ <p className="pb-6">
186+ It solves the hard problems of implementing a peer-to-peer network
187+ (including identity, NAT traversal, and exactly-once delivery) in
188+ the kernel so app developers can focus on business logic.
189+ </p>
190+ <p className="pb-6">
191+ The entire OS is a{" "}
192+ <Link href="https://urbit.org/docs/nock/definition/" passHref>
193+ <a>single pure function</a>
194+ </Link>{" "}
195+ that provides application developers with strong guarantees:
196+ automated persistence and memory management, repeatable builds, and
197+ support for hot code reloading.
198+ </p>
199+ <p className="pb-10">
200+ You can get started learning how to{" "}
201+ <Link href="https://urbit.org/docs/development/develop/" passHref>
202+ <a>contribute to the project</a>
212203 </Link>
204+ , or view a variety of{" "}
205+ <Link
206+ href="https://github.com/urbit/awesome-urbit#http-apis-airlock"
207+ passHref
208+ >
209+ <a>libraries</a>
210+ </Link>{" "}
211+ for building on Urbit using the languages you already know.
212+ </p>
213+ <Link href="https://developers.urbit.org" passHref>
214+ <a className="button-lg type-ui text-white bg-green-400 max-w-fit">
215+ Visit Urbit Developers
216+ </a>
217+ </Link>
213218 </Section>
214219
215220 {
@@ -261,14 +266,29 @@ export default function Home({
261266
262267 <Section narrow>
263268 <h2 className="pb-8">Social Media</h2>
264− <p className="pb-2">Follow us on <Link href="http://twitter.com/urbit">Twitter</Link></p>
265− <p className="pb-2">Check out our posts on <Link href="http://instagram.com/urbit">Instagram</Link></p>
266− <p className="pb-2">Watch livestreams on <Link href="https://www.youtube.com/channel/UCNYIS9_SktINCC9yqO4CFZw">YouTube</Link></p>
267− <p className="pb-2">Dig into code on <Link href="http://github.com/urbit">Github</Link></p>
268− <p className="pb-2">Boot Urbit and join <Link href="https://urbit.org/groups/~bitbet-bolbel/urbit-community">Urbit Community</Link></p>
269+ <p className="pb-2">
270+ Follow us on <Link href="http://twitter.com/urbit">Twitter</Link>
271+ </p>
272+ <p className="pb-2">
273+ Check out our posts on{" "}
274+ <Link href="http://instagram.com/urbit">Instagram</Link>
275+ </p>
276+ <p className="pb-2">
277+ Watch livestreams on{" "}
278+ <Link href="https://www.youtube.com/channel/UCNYIS9_SktINCC9yqO4CFZw">
279+ YouTube
280+ </Link>
281+ </p>
282+ <p className="pb-2">
283+ Dig into code on <Link href="http://github.com/urbit">Github</Link>
284+ </p>
285+ <p className="pb-2">
286+ Boot Urbit and join{" "}
287+ <Link href="https://urbit.org/groups/~bitbet-bolbel/urbit-community">
288+ Urbit Community
289+ </Link>
290+ </p>
269291 </Section>
270−
271−
272292 </SingleColumn>
273293 <Footer />
274294 </Container>
pages/marketplaces/[slug].js+1−1
@@ -12,7 +12,7 @@ export default function Marketplace({
1212}) {
1313 return (
1414 <BasicPage
15− section="Marketplaces"
15+ section="Urbit Marketplace"
1616 post={post}
1717 markdown={markdown}
1818 search={search}
pages/organizations/[slug].js+1−4
@@ -1,6 +1,3 @@
1−// Single page per organisation
2−// Needs to have *associated ships* by which it polls content/applications for applications it "owns"
3−// Needs to look for its title in ecosystem/spotlight
41import { getAllPosts, getPostBySlug, getPostSlugs } from "../../lib/lib";
52import BasicPage from "../../components/ecosystem/BasicPage";
63import { Markdown } from "@urbit/foundation-design-system";
@@ -19,7 +16,7 @@ export default function Organization({
1916}) {
2017 return (
2118 <BasicPage
22− section="Organizations"
19+ section="Organization"
2320 post={post}
2421 markdown={markdown}
2522 search={search}
pages/overview/[[...slug]].js+1−1
@@ -21,7 +21,7 @@ export default function Overview({ posts, data, markdown, search }) {
2121 return (
2222 <Container>
2323 <Head>
24− <title>{data.title} • Overview • Urbit</title>
24+ <title>{data.title} • Overview</title>
2525 {Meta(data)}
2626 </Head>
2727 <IntraNav ourSite="https://urbit.org" search={search} />
pages/podcasts/[slug].js+1−1
@@ -12,7 +12,7 @@ export default function Podcast({
1212}) {
1313 return (
1414 <BasicPage
15− section="Podcasts"
15+ section="Podcast"
1616 post={post}
1717 markdown={markdown}
1818 search={search}
pages/updates/[slug].js+1−1
@@ -30,7 +30,7 @@ export default function Post({ post, markdown, search }) {
3030 return (
3131 <Container>
3232 <Head>
33− <title>{post.title} • Updates • urbit.org</title>
33+ <title>{post.title} • Updates</title>
3434 {Meta(post)}
3535 </Head>
3636 <IntraNav ourSite="https://urbit.org" search={search} />