on master help sign in
Merge branch 'master' into mp/omnibus
commit08b4ab4c4ea923d4862f00e5f150dc12d1275e74 authorMatilde Park <matilde@tlon.io> dateWed 28 Jul 2021, 17:28 (5 years ago) parented3d3d901059c0
6 files changed+79−87
components/Contact.js+3−3 components/EventPreview.js+11−1 components/Header.js+3−2 pages/events/[slug].js+14−2 pages/index.js+47−78 styles/globals.css+1−1
components/Contact.js+3−3
@@ -18,7 +18,7 @@ export default function Contact({ emphasize }) {
1818 fillRule="evenodd"
1919 clipRule="evenodd"
2020 d="M3.2 1.6C3.2 0.716344 3.91634 0 4.8 0H11.3615L14.9333 2.38124V12.2667C14.9333 13.1503 14.217 13.8667 13.3333 13.8667H12.8V14.4C12.8 15.2837 12.0837 16 11.2 16H2.66667C1.78301 16 1.06667 15.2837 1.06667 14.4V3.73333C1.06667 2.84968 1.78301 2.13333 2.66667 2.13333H3.2V1.6ZM3.2 3.2H2.66667C2.37211 3.2 2.13333 3.43878 2.13333 3.73333V14.4C2.13333 14.6946 2.37211 14.9333 2.66667 14.9333H11.2C11.4946 14.9333 11.7333 14.6946 11.7333 14.4V13.8667H4.8C3.91634 13.8667 3.2 13.1503 3.2 12.2667V3.2Z"
21− fill="#32302D"
21+ fill="#666666"
2222 />
2323 </svg>
2424 ) : copyStatus === "copied" ? (
@@ -33,7 +33,7 @@ export default function Contact({ emphasize }) {
3333 fillRule="evenodd"
3434 clipRule="evenodd"
3535 d="M0 8C0 3.58172 3.58172 0 8 0C12.4183 0 16 3.58172 16 8C16 12.4183 12.4183 16 8 16C3.58172 16 0 12.4183 0 8ZM7.54325 11.4247L12.1498 5.66647L11.3169 5.00013L7.39013 9.90859L4.60812 7.59025L3.92526 8.40969L7.54325 11.4247Z"
36− fill="#32302D"
36+ fill="#666666"
3737 />
3838 </svg>
3939 ) : (
@@ -48,7 +48,7 @@ export default function Contact({ emphasize }) {
4848 fillRule="evenodd"
4949 clipRule="evenodd"
5050 d="M0 8C0 3.58172 3.58172 0 8 0C12.4183 0 16 3.58172 16 8C16 12.4183 12.4183 16 8 16C3.58172 16 0 12.4183 0 8ZM10.8229 11.5772L8.00004 8.75429L5.17716 11.5772L4.42292 10.8229L7.24579 8.00004L4.42292 5.17716L5.17716 4.42292L8.00004 7.24579L10.8229 4.42292L11.5772 5.17716L8.75429 8.00004L11.5772 10.8229L10.8229 11.5772Z"
51− fill="#32302D"
51+ fill="#666666"
5252 />
5353 </svg>
5454 );
components/EventPreview.js+11−1
@@ -1,6 +1,6 @@
11import Link from "next/link";
22
3−export default function EventPreview({ event, className, title }) {
3+export default function EventPreview({ event, className, title, rsvp }) {
44 // Event tiles have a 'dark mode' used when their background images are dark and white text is needed for legibility.
55 const grayText = event.extra?.dark ? "text-midWhite" : "text-gray";
66 const blackText = event.extra?.dark ? "text-white" : "text-black";
@@ -25,6 +25,16 @@ export default function EventPreview({ event, className, title }) {
2525 {event.extra.guests}
2626 </p>
2727 </div>
28+ {rsvp && event.extra.registration_url && event.extra.pinned ? (
29+ <div className="absolute right-0 bottom-0 p-4">
30+ <a
31+ className="button-sm bg-green text-white"
32+ href={event.extra.registration_url}
33+ >
34+ RSVP
35+ </a>
36+ </div>
37+ ) : null}
2838 </div>
2939 </Link>
3040 </div>
components/Header.js+3−2
@@ -98,9 +98,10 @@ export default function Header(props) {
9898 e.stopPropagation();
9999 props.search.toggleSearch(e);
100100 }}
101− className="button-sm bg-wall text-gray"
101+ className="bg-wall text-gray flex px-4 py-1 rounded-lg type-ui"
102102 >
103− Search<div className="ml-4 text-lightGray">{shortcut}</div>
103+ <div>Search</div>
104+ <div className="ml-4 text-lightGray">{shortcut}</div>
104105 </button>
105106 </nav>
106107
pages/events/[slug].js+14−2
@@ -36,6 +36,7 @@ export default function Event({
3636 <Header search={search} />
3737 <Section narrow short>
3838 <h1>{post.title}</h1>
39+
3940 {post.extra.author ? (
4041 <div className="type-ui text-gray mt-4 md:mt-8 lg:mt-10">
4142 {post.extra.author}
@@ -44,8 +45,19 @@ export default function Event({
4445 {post.extra.ship ? (
4546 <div className="type-ui text-gray font-mono">{post.extra.ship}</div>
4647 ) : null}
47− <div className="type-ui text-gray mt-16">
48− {formatDate(new Date(post.date))}
48+
49+ <div className="mt-16">
50+ <p className="type-ui text-gray">
51+ {formatDate(new Date(post.date))} {", " + post.extra.time}
52+ </p>
53+ {post.extra.registration_url && post.extra.pinned ? (
54+ <a
55+ className="button-sm bg-green text-white flex-0 mt-4"
56+ href={post.extra.registration_url}
57+ >
58+ RSVP
59+ </a>
60+ ) : null}
4961 </div>
5062 </Section>
5163 <Section short wide>
pages/index.js+47−78
@@ -1,5 +1,4 @@
11import Head from "next/head";
2−import Meta from "../components/Meta";
32import Link from "next/link";
43import React, { useState, useEffect } from "react";
54import Container from "../components/Container";
@@ -52,7 +51,6 @@ export default function Home({ posts, events, openGrantsCount, search }) {
5251 <Container>
5352 <Head>
5453 <title>urbit.org</title>
55− {Meta()}
5654 </Head>
5755 <SingleColumn>
5856 <Header search={search} />
@@ -185,88 +183,59 @@ export default function Home({ posts, events, openGrantsCount, search }) {
185183 </Section>
186184
187185 {
188− // Blog and Events Combo Section
186+ // Blog Posts
189187 }
190188 <Section narrow>
191189 <div className="flex items-center measure pb-12">
192− <button
193− onClick={() => setTab(0)}
194− className={`tab-button-lg mr-6 ${
195− tab === 0 ? "text-black" : "text-gray"
196− }`}
197− >
198− Blog
199− </button>
200− <button
201− onClick={() => setTab(1)}
202− className={`tab-button-lg ${
203− tab === 1 ? "text-black" : "text-gray"
204− }`}
205− >
206− Events
190+ <h2>Blog</h2>
191+ </div>
192+
193+ <div className="flex flex-wrap">
194+ <PostPreview
195+ post={posts[0]}
196+ className={`w-full md:w-1/2 pr-0 pb-8 md:pr-4`}
197+ key={posts[0].slug}
198+ />
199+ <PostPreview
200+ post={posts[1]}
201+ className={`w-full md:w-1/2 pl-0 pb-8 md:pl-4`}
202+ key={posts[1].slug}
203+ />
204+ </div>
205+ <Link href="/blog">
206+ <button className="button-lg type-ui text-white bg-green">
207+ See More
207208 </button>
209+ </Link>
210+ </Section>
211+
212+ {
213+ // Events Posts
214+ }
215+ <Section narrow>
216+ <div className="flex items-center measure pb-12">
217+ <h2>Events</h2>
208218 </div>
209219
210− <TabCarousel index={tab}>
211− <div className="flex flex-wrap">
212− <PostPreview
213− post={posts[0]}
214− className={`w-full md:w-1/2 pr-0 pb-8 md:pr-4`}
215− key={posts[0].slug}
216− />
217− <PostPreview
218− post={posts[1]}
219− className={`w-full md:w-1/2 pl-0 pb-8 md:pl-4`}
220− key={posts[1].slug}
221− />
222− <PostPreview
223− post={posts[2]}
224− className={`w-full md:w-1/2 pr-0 pb-8 md:pr-4`}
225− key={posts[2].slug}
226− />
227− <PostPreview
228− post={posts[3]}
229− className={`w-full md:w-1/2 pl-0 pb-8 md:pl-4`}
230− key={posts[3].slug}
231− />
232− <div>
233− <Link href="/blog">
234− <button className="button-lg type-ui text-white bg-ultraDeepWall">
235− Read More
236− </button>
237− </Link>
238− </div>
239− </div>
240− <div className="flex flex-wrap">
241− <EventPreview
242− event={events[0]}
243− className={`w-full md:w-1/2 pr-0 pb-8 md:pr-4`}
244− key={events[0].slug}
245− />
246− <EventPreview
247− event={events[1]}
248− className={`w-full md:w-1/2 pl-0 pb-8 md:pl-4`}
249− key={events[1].slug}
250− />
251− <EventPreview
252− event={events[2]}
253− className={`w-full md:w-1/2 pr-0 pb-8 md:pr-4`}
254− key={events[2].slug}
255− />
256− <EventPreview
257− event={events[3]}
258− className={`w-full md:w-1/2 pl-0 pb-8 md:pl-4`}
259− key={events[3].slug}
260− />
261− <div>
262− <Link href="/events">
263− <button className="button-lg type-ui text-white bg-ultraDeepWall">
264− More Events
265− </button>
266− </Link>
267− </div>
268− </div>
269− </TabCarousel>
220+ <div className="flex flex-wrap">
221+ <EventPreview
222+ rsvp
223+ event={events[0]}
224+ className={`w-full md:w-1/2 pr-0 pb-8 md:pr-4`}
225+ key={events[0].slug}
226+ />
227+ <EventPreview
228+ rsvp
229+ event={events[1]}
230+ className={`w-full md:w-1/2 pl-0 pb-8 md:pl-4`}
231+ key={events[1].slug}
232+ />
233+ </div>
234+ <Link href="/docs">
235+ <button className="button-lg type-ui text-white bg-ultraDeepWall">
236+ More Events
237+ </button>
238+ </Link>
270239 </Section>
271240
272241 {
styles/globals.css+1−1
@@ -72,7 +72,7 @@ button {
7272}
7373
7474.button-sm {
75− @apply flex px-4 py-1 rounded-lg type-ui;
75+ @apply table px-4 py-1 rounded-lg type-ui;
7676}
7777
7878.button-lg {