Tom and Theresa Preston-Werner Gift Announcement (#384)

Co-authored-by: Ella <git@ella.cx>

components/announcements/amount.js

@@ -3,7 +3,7 @@ import Sparkles from '../sparkles'
 const Amount = ({amount}) => (
   <Sparkles sx={{
     WebkitTextStroke: 'currentColor',
-    WebkitTextStrokeWidth: '2px',
+    WebkitTextStrokeWidth: ['2px', '3px'],
     WebkitTextFillColor: 'transparent'
   }}>{amount}</Sparkles>
 )

components/announcements/cta.js

@@ -21,7 +21,7 @@ export default function SlackCTA() {
           </Heading>
           <Text variant="subtitle" sx={{ lineHeight: 'caption', mb: 3 }}>
             Hack Club is a global community of high school makers & student-led
-            coding clubs. We’ve got a 24/7 Slack chatroom of 15k+ teenagers
+            coding clubs. We’ve got a 24/7 Slack chatroom of 16k+ teenagers
             learning to code & building amazing projects, & you’ll fit right in.
           </Text>
           <br />

components/announcements/preston-werner-2022.mdx

@@ -0,0 +1,13 @@
+This gift means a lot to the Hack Club community, and we are grateful for Tom and Theresa’s continued support.
+
+In 2014, Hack Club was founded, and Tom joined as Hack Club’s first board member. In the years since, he has contributed open source code, mentored Hack Clubbers 1:1, donated dozens of laptops to teenagers who didn't have access to computers, and been a constant advisor on the Hack Club community, strategy, and product.
+
+Tom and Theresa also helped fund [The Hacker Zephyr](https://hack.af/zephyrdoc), an epic, cross-country train hackathon taken by 42 teen hackers in the summer of 2021. Tom even hacked alongside Hack Clubbers onboard.
+
+With this gift, we will continue to build the engineering team at Hack Club, including a Tech Lead for [Hack Club Bank](https://hackclub.com/bank), and new engineers to support clubs, the Hack Club online community, and events.
+
+One of our goals in 2022 is to improve Hack Club, and to support more teenagers in joining the community. Thank you Tom and Theresa for helping make this possible.
+
+We thank Tom and Theresa for their generous gift and will carefully use each cent to advance our mission to create a new generation of young, highly-technical teen leaders capable of solving our world’s greatest problems. Every penny will be spent [transparently](https://bank.hackclub.com/hq).
+
+— Christina Asquith, COO, and Zach Latta, founder

pages/preston-werner-2022.js

@@ -0,0 +1,86 @@
+import {
+  Avatar,
+  Box,
+  Button,
+  Container,
+  Flex,
+  Grid,
+  Heading,
+  Link,
+  Text
+} from 'theme-ui'
+import Head from 'next/head'
+import Meta from '@hackclub/meta'
+import Nav from '../components/nav'
+import ForceTheme from '../components/force-theme'
+import Footer from '../components/footer'
+import PrestonWernerCopy from '../components/announcements/preston-werner-2022.mdx'
+import Amount from '../components/announcements/amount'
+import SlackCTA from '../components/announcements/cta'
+import AnnouncementHolder from '../components/announcements/holder'
+import {
+  PillHolder,
+  AuthorPill,
+  DatePill
+} from '../components/announcements/pills'
+
+const Page = () => (
+  <>
+    <Meta
+      as={Head}
+      title="Tom and Theresa Preston-Werner are Giving $500K"
+      description="We’re thrilled to announce Tom and Theresa Preston-Werner have donated $500k to Hack Club, a global nonprofit network of high school hackers & coding clubs."
+      image="https://workshop-cards.hackclub.com/Preston-Werner%20Gift%20Announcement.png?fontSize=175px&brand=HQ"
+    />
+    <ForceTheme theme="light" />
+    <Nav />
+    <Box
+      as="section"
+      sx={{
+        pt: [5, 6],
+        pb: [4, 5],
+        bg: 'rgb(104, 41, 205)',
+        backgroundImage: theme => theme.util.gx('blue', 'green')
+      }}
+    >
+      <Container sx={{ textAlign: 'center', color: 'white' }}>
+        <Heading
+          as="h1"
+          variant="title"
+          sx={{
+            fontSize: [5, 6, null, '82px'],
+            span: {
+              WebkitTextStroke: 'currentColor',
+              WebkitTextStrokeWidth: ['2px', '3px'],
+              WebkitTextFillColor: 'transparent'
+            }
+          }}
+        >
+          Tom and Theresa{' '}
+          <span style={{ whiteSpace: 'nowrap' }}>Preston-Werner</span> are
+          donating <Amount amount="$500,000" /> to&nbsp;Hack&nbsp;Club
+        </Heading>
+      </Container>
+    </Box>
+    <AnnouncementHolder>
+      <PillHolder>
+        <AuthorPill
+          firstName="Christina"
+          tag="Christina Asquith, COO"
+          image="https://cloud-macp9mbpq.vercel.app/0image.png"
+        />
+        <AuthorPill
+          firstName="Zach"
+          tag="Zach Latta, founder"
+          image="https://hackclub.com/team/zach.jpg"
+        />
+        <DatePill tag="Mar 15, 2022" />
+      </PillHolder>
+      <PrestonWernerCopy />
+    </AnnouncementHolder>
+    <SlackCTA />
+    <Footer />
+  </>
+)
+
+export default Page