on master help sign in
highlight cards on index
commitae1998ab380a7879d276768cde1ca5b8f7e2e7e9 authorGordon <gordon@hey.com> dateThu 26 Jan 2023, 13:32 (4 years ago) parent720034a
2 files changed+153−59
components/IndexCard.js+32 pages/index.js+121−59
components/IndexCard.jsnew file+32
@@ -0,0 +1,32 @@
1+import Link from "next/link";
2+export default function IndexCard({ slug, feat }) {
3+ return (
4+ <Link href={slug}>
5+ <div className="hover:opacity-80 cursor-pointer bg-wall-100 rounded-xl min-h-0 flex-1">
6+ <div className="flex flex-col p-4 h-full relative">
7+ {feat.image ? (
8+ <div
9+ className="w-64 md:w-full rounded-xl object-cover overflow-hidden basis-1/2"
10+ style={{
11+ backgroundColor: feat?.matchedPost?.bgColor || "rgba(0,0,0,0)",
12+ }}
13+ >
14+ <img className="h-full w-64 md:w-full object-cover" src={feat.image} />
15+ </div>
16+ ) : (
17+ <div
18+ className="rounded-xl w-full"
19+ style={{
20+ backgroundColor: feat?.matchedPost?.bgColor || "rgba(0,0,0,0)",
21+ }}
22+ />
23+ )}
24+ <div className="pt-4">
25+ <p className="mb-2 font-semibold leading-5">{feat.title}</p>
26+ <p className="text-sm leading-5">{feat?.description}</p>
27+ </div>
28+ </div>
29+ </div>
30+ </Link>
31+ );
32+}
pages/index.js+121−59
@@ -58,27 +58,62 @@ export default function Home({
5858 // Hero
5959 }
6060
61− <Section className="pb-12">
62− <div className="bg-wall-100 w-full p-4 md:p-8 rounded-3xl flex flex-wrap items-center">
6361
64− <div className="basis-full sm:basis-1/3 pb-4 sm:pb-0">
65− <img className="rounded-xl w-72" src="https://storage.googleapis.com/media.urbit.org/assembly/assembly-thumb2.jpg" />
66− </div>
67− <div className="sm:basis-2/3 sm:pl-6 align-middle">
68− <h2 className="text-2xl pb-2">Assembly 2022</h2 >
69− <p className="max-w-prose pb-4">
70− Select talks and panels are being released from the second annual Urbit confluence in Miami.
71− </p>
72− <Link href="https://assembly.urbit.org" passHref>
73− <a className="button-sm border-2 border-wall-600 text-wall-600 type-sm max-w-fit">
74− Watch Now
75− </a>
76− </Link>
77− </div>
62+ <Section className="pb-12">
63+
64+ <div className="flex flex-col space-y-4 md:space-y-0 md:flex-row md:space-x-4">
65+
66+
67+ <Link href="#">
68+ <div className="cursor-pointer bg-wall-100 rounded-xl min-h-0 flex-1">
69+ <div className="flex flex-col p-4 h-full relative">
70+ <div className="w-64 md:w-full rounded-xl object-cover overflow-hidden basis-3/5">
71+ <img className="h-full w-64 md:w-full object-cover" src="https://storage.googleapis.com/media.urbit.org/site/featured/state-of-network.png"/>
72+ </div>
73+ <div className="pt-4">
74+ <p className="mb-2 font-semibold leading-5">State of the Network</p>
75+ <p className="text-sm leading-5">Urbit is not the same in 2023 as it was in 2022.</p>
76+ </div>
77+ </div>
78+ </div>
79+ </Link>
80+
81+ <Link href="https://roadmap.urbit.org">
82+ <div className="bg-wall-100 rounded-xl min-h-0 flex-1">
83+ <div className="cursor-pointer flex flex-col p-4 h-full relative">
84+ <div className="w-64 md:w-full rounded-xl object-cover overflow-hidden basis-3/5">
85+ <img className="h-full w-64 md:w-full object-cover" src="https://storage.googleapis.com/media.urbit.org/site/featured/roadmap-icon.jpg"/>
86+ </div>
87+ <div className="pt-4">
88+ <p className="mb-2 font-semibold leading-5">Roadmap</p>
89+ <p className="text-sm leading-5">Explore the technical plan for making Urbit suitable to mass adoption.</p>
90+ </div>
91+ </div>
92+ </div>
93+ </Link>
94+
95+
96+ <Link href="https://developers.urbit.org/courses/hsl">
97+ <div className="bg-wall-100 rounded-xl min-h-0 flex-1">
98+ <div className="cursor-pointer flex flex-col p-4 h-full relative">
99+ <div className="w-64 md:w-full rounded-xl object-cover overflow-hidden basis-3/5">
100+ <img className="h-full w-64 md:w-full object-cover" src="https://storage.googleapis.com/media.urbit.org/site/featured/hoon-school-23.png"/>
101+ </div>
102+ <div className="pt-4">
103+ <p className="mb-2 font-semibold leading-5">Hoon School Live 23'</p>
104+ <p className="text-sm leading-5">The next cohort class to learn Hoon begins in March.</p>
105+ </div>
106+ </div>
107+ </div>
108+ </Link>
109+
78110 </div>
111+
79112 </Section>
80113
81114
115+
116+
82117 <Section narrow className="space-y-8">
83118
84119 <div className="w-full space-y-8 max-w-prose">
@@ -139,6 +174,53 @@ export default function Home({
139174 </Link>
140175 </div>
141176 </Section>
177+
178+ {
179+ // Build on Urbit Developer CTA
180+ }
181+ <Section narrow>
182+ <h2 className="pb-8">Build on Urbit</h2>
183+ <h4 className="pb-6">
184+ Urbit is a personal OS designed from scratch to run peer-to-peer
185+ applications.
186+ </h4>
187+ <p className="pb-6">
188+ It solves the hard problems of implementing a peer-to-peer network
189+ (including identity, NAT traversal, and exactly-once delivery) in
190+ the kernel so app developers can focus on business logic.
191+ </p>
192+ <p className="pb-6">
193+ The entire OS is a{" "}
194+ <Link href="https://urbit.org/docs/nock/definition/" passHref>
195+ <a>single pure function</a>
196+ </Link>{" "}
197+ that provides application developers with strong guarantees:
198+ automated persistence and memory management, repeatable builds, and
199+ support for hot code reloading.
200+ </p>
201+ <p className="pb-10">
202+ You can get started learning how to{" "}
203+ <Link href="https://urbit.org/docs/development/develop/" passHref>
204+ <a>contribute to the project</a>
205+ </Link>
206+ , or view a variety of{" "}
207+ <Link
208+ href="https://github.com/urbit/awesome-urbit#http-apis-airlock"
209+ passHref
210+ >
211+ <a>libraries</a>
212+ </Link>{" "}
213+ for building on Urbit using the languages you already know.
214+ </p>
215+ <Link href="https://developers.urbit.org" passHref>
216+ <a className="button-lg type-ui text-white bg-green-400 max-w-fit">
217+ Visit Urbit Developers
218+ </a>
219+ </Link>
220+ </Section>
221+
222+
223+
142224 {
143225 // Grants
144226 }
@@ -188,49 +270,6 @@ export default function Home({
188270 </div>
189271 </Section>
190272
191− {
192− // Build on Urbit Developer CTA
193− }
194− <Section narrow>
195− <h2 className="pb-8">Build on Urbit</h2>
196− <h4 className="pb-6">
197− Urbit is a personal OS designed from scratch to run peer-to-peer
198− applications.
199− </h4>
200− <p className="pb-6">
201− It solves the hard problems of implementing a peer-to-peer network
202− (including identity, NAT traversal, and exactly-once delivery) in
203− the kernel so app developers can focus on business logic.
204− </p>
205− <p className="pb-6">
206− The entire OS is a{" "}
207− <Link href="https://urbit.org/docs/nock/definition/" passHref>
208− <a>single pure function</a>
209− </Link>{" "}
210− that provides application developers with strong guarantees:
211− automated persistence and memory management, repeatable builds, and
212− support for hot code reloading.
213− </p>
214− <p className="pb-10">
215− You can get started learning how to{" "}
216− <Link href="https://urbit.org/docs/development/develop/" passHref>
217− <a>contribute to the project</a>
218− </Link>
219− , or view a variety of{" "}
220− <Link
221− href="https://github.com/urbit/awesome-urbit#http-apis-airlock"
222− passHref
223− >
224− <a>libraries</a>
225− </Link>{" "}
226− for building on Urbit using the languages you already know.
227− </p>
228− <Link href="https://developers.urbit.org" passHref>
229− <a className="button-lg type-ui text-white bg-green-400 max-w-fit">
230− Visit Urbit Developers
231− </a>
232− </Link>
233− </Section>
234273
235274 {
236275 // Blog Posts
@@ -272,6 +311,26 @@ export default function Home({
272311 </Link>
273312 </Section>
274313
314+ <Section className="pb-12">
315+ <div className="bg-wall-100 w-full p-4 md:p-8 rounded-3xl flex flex-wrap items-center">
316+
317+ <div className="basis-full sm:basis-1/3 pb-4 sm:pb-0">
318+ <img className="rounded-xl w-72" src="https://storage.googleapis.com/media.urbit.org/assembly/assembly-thumb2.jpg" />
319+ </div>
320+ <div className="sm:basis-2/3 sm:pl-6 align-middle">
321+ <h2 className="text-2xl pb-2">Assembly 2022</h2 >
322+ <p className="max-w-prose pb-4">
323+ Watch talks and panels from last year's confluence in Miami.
324+ </p>
325+ <Link href="https://assembly.urbit.org" passHref>
326+ <a className="button-sm border-2 border-wall-600 text-wall-600 type-sm max-w-fit">
327+ Watch Now
328+ </a>
329+ </Link>
330+ </div>
331+ </div>
332+ </Section>
333+
275334 <Section narrow>
276335 <h2 className="pb-2">Urbit Monthly</h2>
277336 <p className="pb-8">Get monthly email updates on all things Urbit.</p>
@@ -279,6 +338,9 @@ export default function Home({
279338 <Contact emphasize />
280339 </Section>
281340
341+
342+
343+
282344 <Section narrow>
283345 <h2 className="pb-8">Social Media</h2>
284346 <p className="pb-2">