mirror of
https://github.com/System-End/site.git
synced 2026-04-19 22:05:11 +00:00
Merge branch 'main' into slack
This commit is contained in:
Toby Brown
GitHub
commit
7af239a766
17 changed files with 425 additions and 808 deletions
|
|
@ -163,8 +163,8 @@ export default function PersonalInfoForm({
|
|||
</Field>
|
||||
<Field
|
||||
name="accommodations"
|
||||
label="Accessability needs"
|
||||
description="Please specify any accommodations or accessability needs you have so we can support you during onboarding and while using HCB"
|
||||
label="Accessibility needs"
|
||||
description="Please specify any accommodations or accessibility needs you have so we can support you during onboarding and while using HCB"
|
||||
requiredFields={requiredFields}
|
||||
>
|
||||
<Input
|
||||
|
|
|
|||
|
|
@ -8,8 +8,9 @@ export default function GitHub({
|
|||
key,
|
||||
text,
|
||||
time,
|
||||
url,
|
||||
message,
|
||||
opacity,
|
||||
url,
|
||||
...props
|
||||
}) {
|
||||
return (
|
||||
|
|
@ -17,7 +18,7 @@ export default function GitHub({
|
|||
variant="pill"
|
||||
bg="snow"
|
||||
as="a"
|
||||
href={url}
|
||||
href={url || "https://github.com/hackclub"}
|
||||
target="_blank"
|
||||
rel="noopener"
|
||||
sx={{
|
||||
|
|
@ -33,7 +34,8 @@ export default function GitHub({
|
|||
gap: 2,
|
||||
height: '2rem',
|
||||
width: ['fit-content', null, null, '100%'],
|
||||
maxWidth: '30rem'
|
||||
maxWidth: '30rem',
|
||||
opacity: opacity
|
||||
}}
|
||||
{...props}
|
||||
>
|
||||
|
|
@ -81,4 +83,4 @@ export default function GitHub({
|
|||
</Text>
|
||||
</Badge>
|
||||
)
|
||||
}
|
||||
}
|
||||
|
|
@ -146,10 +146,10 @@ const Navigation = props => (
|
|||
<Link>Hackathons</Link>
|
||||
</NextLink>
|
||||
<NextLink href="/slack" passHref>
|
||||
<Link>Slack</Link>
|
||||
<Link>Community</Link>
|
||||
</NextLink>
|
||||
<Link href="https://scrapbook.hackclub.com/">Scrapbook</Link>
|
||||
<Link href="https://jams.hackclub.com/">Jams</Link>
|
||||
<Link href="https://jams.hackclub.com/">Workshops</Link>
|
||||
<NextLink href="/onboard" passHref>
|
||||
<Link>OnBoard</Link>
|
||||
</NextLink>
|
||||
|
|
|
|||
|
|
@ -13,16 +13,16 @@ West Hollywood, CA 90069
|
|||
|
||||
<Grid columns={[2, 3]} gap={3} sx={{ p: { m: 0, lineHeight: 0 }, img: { borderRadius: 'default' } }}>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
</Grid>
|
||||
|
|
|
|||
|
|
@ -15,7 +15,7 @@ export default function Secret({ reveal, ...props }) {
|
|||
right: 5,
|
||||
bottom: 0,
|
||||
transform: `${reveal ? 'translateY(0)' : 'translateY(100%)'}`,
|
||||
transition: '1s',
|
||||
transition: '2s',
|
||||
zIndex: 3
|
||||
}}
|
||||
{...props}
|
||||
|
|
|
|||
|
|
@ -17,7 +17,7 @@ import { getCookie, hasCookie } from 'cookies-next'
|
|||
const JoinForm = ({ sx = {} }) => {
|
||||
const router = useRouter()
|
||||
const { status, formProps, useField } = useForm('/api/join/', null, {
|
||||
clearOnSubmit: 5000,
|
||||
clearOnSubmit: 60000,
|
||||
method: 'POST',
|
||||
initData: hasCookie('continent')
|
||||
? {
|
||||
|
|
@ -140,17 +140,37 @@ const JoinForm = ({ sx = {} }) => {
|
|||
)}
|
||||
|
||||
{!isAdult && (
|
||||
<Submit
|
||||
status={status}
|
||||
mt={'0px!important'}
|
||||
labels={{
|
||||
default: useWaitlist ? 'Join Waitlist' : 'Get Invite',
|
||||
error: 'Something went wrong',
|
||||
success: useWaitlist
|
||||
? "We'll be in touch soon!"
|
||||
: 'Email coming soon!'
|
||||
}}
|
||||
/>
|
||||
<Box>
|
||||
<Submit
|
||||
status={status}
|
||||
mt={'0px!important'}
|
||||
labels={{
|
||||
default: useWaitlist ? 'Join Waitlist' : 'Get Invite',
|
||||
error: 'Something went wrong',
|
||||
success: useWaitlist
|
||||
? "We'll be in touch soon!"
|
||||
: 'Check your email for invite!'
|
||||
}}
|
||||
disabled={status === 'loading' || status === 'success'}
|
||||
/>
|
||||
{status === 'success' && (
|
||||
<Text
|
||||
variant="caption"
|
||||
color="secondary"
|
||||
as="div"
|
||||
sx={{
|
||||
maxWidth: '600px',
|
||||
textAlign: 'center',
|
||||
mt: 3
|
||||
}}
|
||||
>
|
||||
Check your spam folder too! Not there?{' '}
|
||||
<Link href="mailto:slack@hackclub.com" sx={{ ml: 1 }}>
|
||||
Send us an email
|
||||
</Link>
|
||||
</Text>
|
||||
)}
|
||||
</Box>
|
||||
)}
|
||||
</form>
|
||||
</Card>
|
||||
|
|
|
|||
|
|
@ -52,9 +52,17 @@ const useForm = (
|
|||
if (r.ok) {
|
||||
setStatus('success')
|
||||
if (callback) callback(r)
|
||||
setTimeout(() => setStatus('default'), 3500)
|
||||
if (options.clearOnSubmit)
|
||||
setTimeout(() => setData({}), options.clearOnSubmit)
|
||||
if (options.clearOnSubmit) {
|
||||
setTimeout(() => {
|
||||
setData({});
|
||||
setStatus('default');
|
||||
}, options.clearOnSubmit);
|
||||
} else {
|
||||
setTimeout(() => {
|
||||
setData({});
|
||||
setStatus('default')
|
||||
}, 3500)
|
||||
}
|
||||
} else {
|
||||
setStatus('error')
|
||||
console.error(response)
|
||||
|
|
|
|||
|
|
@ -12,4 +12,11 @@ export function middleware(request) {
|
|||
response.cookies.set('continent', continent || '')
|
||||
return response
|
||||
}
|
||||
|
||||
if (request.nextUrl.pathname === '/donate/') {
|
||||
return NextResponse.redirect('https://hackclub.com/philanthropy/');
|
||||
}
|
||||
|
||||
return NextResponse.next();
|
||||
|
||||
}
|
||||
|
|
|
|||
|
|
@ -160,12 +160,12 @@ const Blinking = styled(Heading)`
|
|||
&:after {
|
||||
left: 2px;
|
||||
text-shadow: -2px 0 ${theme.colors.red};
|
||||
animation: ${animation1} 2s infinite linear alternate-reverse;
|
||||
animation: ${animation1} 2s infinite steps(2, jump-end) alternate-reverse;
|
||||
}
|
||||
&:before {
|
||||
left: -2px;
|
||||
text-shadow: -2px 0 ${theme.colors.cyan};
|
||||
animation: ${animation2} 4s infinite linear alternate-reverse;
|
||||
animation: ${animation2} 4s infinite steps(2, jump-end) alternate-reverse;
|
||||
}
|
||||
`
|
||||
|
||||
|
|
|
|||
|
|
@ -14,7 +14,8 @@ export default async function handler(req, res) {
|
|||
body: JSON.stringify({
|
||||
email: data.userEmail,
|
||||
name: data.eventName,
|
||||
transparent: data.transparent
|
||||
transparent: data.transparent,
|
||||
country: data.eventCountryCode,
|
||||
}),
|
||||
method: 'POST',
|
||||
headers: {
|
||||
|
|
|
|||
|
|
@ -453,7 +453,7 @@ const Page = () => (
|
|||
<>
|
||||
We build tools, such as{' '}
|
||||
<a href="https://sprig.hackclub.com">Sprig</a>, that your
|
||||
members can use to make projects with in meetings! Built more of
|
||||
members can use to make projects with in meetings! Build more of
|
||||
them with us in our <Link href="/slack">Slack community</Link>.
|
||||
</>
|
||||
}
|
||||
|
|
@ -466,7 +466,7 @@ const Page = () => (
|
|||
<>
|
||||
Come prepared to every meeting with over 100{' '}
|
||||
<a href="https://workshops.hackclub.com">workshops</a> (3 years’
|
||||
worth!) and 18 <a href="https://jams.hackclub.com">Jams</a>{' '}
|
||||
worth!) and 19 <a href="https://jams.hackclub.com">Jams</a>{' '}
|
||||
that guide your club members through making fun, creative
|
||||
projects.
|
||||
</>
|
||||
|
|
|
|||
|
|
@ -45,7 +45,7 @@ The below summary was calculated from HQ's export from [HCB](https://hackclub.co
|
|||
|
||||
- $5,000 - Think Together
|
||||
|
||||
Thank you to all the new donors to Hack Club this month. You make Hack Club possible. We rely on donations to keep Hack Club free for students. [Donate here.](https://hackclub.com/donate/)
|
||||
Thank you to all the new donors to Hack Club this month. You make Hack Club possible. We rely on donations to keep Hack Club free for students. [Donate here.](https://hackclub.com/philanthropy/)
|
||||
|
||||
Please note that [Elon Musk also donated $500K this month](https://twitter.com/hackclub/status/1263153557945159680), but the gift didn't hit our account until June 3rd, so it will be included in the June finance update.
|
||||
|
||||
|
|
|
|||
547
pages/donate.js
547
pages/donate.js
|
|
@ -1,547 +0,0 @@
|
|||
import React, { useEffect } from 'react'
|
||||
import styled from '@emotion/styled'
|
||||
import {
|
||||
Box,
|
||||
Button,
|
||||
Container,
|
||||
Flex,
|
||||
Heading,
|
||||
Card,
|
||||
Grid,
|
||||
Link as A,
|
||||
Text,
|
||||
Avatar
|
||||
} from 'theme-ui'
|
||||
import Photo from '../components/photo'
|
||||
import Image from 'next/image'
|
||||
import Head from 'next/head'
|
||||
import Meta from '@hackclub/meta'
|
||||
import ForceTheme from '../components/force-theme'
|
||||
import Nav from '../components/nav'
|
||||
import Footer from '../components/footer'
|
||||
import SprigForm from '../components/donate/sprigForm'
|
||||
import SprigMeta from '../components/donate/sprigMeta'
|
||||
import Sponsors from '../components/donate/sponsors'
|
||||
import donors from '../components/donate/donors.json'
|
||||
import Marquee from 'react-marquee-slider'
|
||||
import ExecuteBig from '../public/donate/codedaydc_hack.jpg'
|
||||
import HackCamp from '../public/donate/sf.jpg'
|
||||
import HackerGames from '../public/donate/0img_20210830_161125.jpg'
|
||||
import LaptopDonations from '../public/donate/0screenshot_2021-10-03_at_4.20.30_pm.png'
|
||||
import Kerala from '../public/donate/0img-20210918-wa0091.jpg'
|
||||
import HackPenn from '../public/donate/0color_pop.jpg'
|
||||
import ElonAMA from '../public/donate/elon.jpg'
|
||||
import SpaceX from '../public/donate/0spacex_and_hack_club.jpg'
|
||||
import Flagship from '../public/donate/flagship.png'
|
||||
import MAHacks from '../public/donate/0screenshot_2021-10-03_at_4.07.51_pm.png'
|
||||
import HackCamp2020 from '../public/donate/0img_6447.jpg'
|
||||
import InnovationCircuit from '../public/donate/0screenshot_2021-10-03_at_3.45.54_pm.png'
|
||||
import WindyCity from '../public/donate/6screenshot_2021-10-03_at_3.29.29_pm.png'
|
||||
import ZephyrFun from '../public/donate/0screenshot_2021-10-03_at_3.59.34_pm.png'
|
||||
import GoldenTrain from '../public/home/golden-train.png'
|
||||
|
||||
const Header = styled(Box)`
|
||||
background: url('/pattern.svg');
|
||||
`
|
||||
|
||||
const Sheet = styled(Card)`
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
border-radius: 8px;
|
||||
width: 100%;
|
||||
color: white;
|
||||
`
|
||||
Sheet.defaultProps = {
|
||||
sx: {
|
||||
bg: 'rgba(255, 255, 255, 0.875)',
|
||||
p: [3, 4],
|
||||
color: 'black',
|
||||
width: 1,
|
||||
mb: 4
|
||||
}
|
||||
}
|
||||
|
||||
const Row = styled(Box)`
|
||||
text-align: left;
|
||||
@media screen and (min-width: 48em) {
|
||||
display: grid;
|
||||
grid-gap: 18px;
|
||||
grid-template-columns: ${({ reverse }) =>
|
||||
reverse ? '3fr 2fr' : '2fr 3fr'};
|
||||
}
|
||||
`
|
||||
|
||||
const Quote = styled(Sheet)`
|
||||
position: relative;
|
||||
&:before {
|
||||
content: '“';
|
||||
line-height: 1;
|
||||
font-size: 48px;
|
||||
padding-left: 6px;
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 0;
|
||||
color: #fff;
|
||||
opacity: 0.5;
|
||||
padding: 18px;
|
||||
}
|
||||
`
|
||||
|
||||
Sheet.defaultProps = {
|
||||
sx: {
|
||||
maxWidth: '52rem',
|
||||
fontSize: 3,
|
||||
p: [4, 5],
|
||||
color: 'white'
|
||||
}
|
||||
}
|
||||
const FirstQuote = styled(Quote)`
|
||||
background-image: radial-gradient(
|
||||
at left top,
|
||||
rgb(45, 228, 207),
|
||||
rgb(41, 206, 104),
|
||||
rgb(53, 181, 36)
|
||||
);
|
||||
`
|
||||
const SecondQuote = styled(Quote)`
|
||||
background-image: radial-gradient(
|
||||
at left bottom,
|
||||
rgb(45, 158, 228),
|
||||
rgb(45, 66, 228),
|
||||
rgb(115, 45, 228)
|
||||
);
|
||||
`
|
||||
const subhline = { fontSize: [3, 4], style: { lineHeight: '1.375' } }
|
||||
|
||||
const contentContainer = {
|
||||
maxWidth: 72,
|
||||
width: 1,
|
||||
p: 3,
|
||||
color: 'black',
|
||||
style: { position: 'relative' }
|
||||
}
|
||||
const content = { maxWidth: 48, mx: 0, color: 'black' }
|
||||
|
||||
const title = 'Donate'
|
||||
const desc =
|
||||
'Contribute today to empower the next generation and help start a coding club at every high school.'
|
||||
|
||||
const DonorGrid = styled(Box)`
|
||||
display: grid;
|
||||
grid-gap: 6px;
|
||||
grid-template-columns: repeat(auto-fit, minmax(10rem, 1fr));
|
||||
align-items: center;
|
||||
p,
|
||||
a {
|
||||
width: 100%;
|
||||
}
|
||||
@media screen and (min-width: 48em) {
|
||||
grid-gap: 18px;
|
||||
grid-template-columns: repeat(auto-fit, minmax(14rem, 1fr));
|
||||
}
|
||||
`
|
||||
|
||||
const DonorCardBase = styled(Sheet)`
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
@media screen and (max-width: 32em) {
|
||||
border-radius: 0;
|
||||
box-shadow: none;
|
||||
}
|
||||
`
|
||||
const DonorCard = ({ name, link = false }) => (
|
||||
<DonorCardBase bg="white" p="18px!important" mb={0}>
|
||||
<Text color="black" sx={{ textAlign: 'center', fontSize: '16px' }}>
|
||||
{name}
|
||||
</Text>
|
||||
</DonorCardBase>
|
||||
)
|
||||
|
||||
const PhotoRow = ({ photos }) => (
|
||||
<Box sx={{ height: '200px', overflow: 'hidden' }}>
|
||||
<Box sx={{ display: ['block', 'block', 'block', 'block', 'none'] }}>
|
||||
<Marquee velocity={12}>
|
||||
{photos.map((photo, index) => (
|
||||
<Image
|
||||
placeholder="blur"
|
||||
src={photo}
|
||||
objectFit="cover"
|
||||
className="next-image"
|
||||
height="200px"
|
||||
width="300px"
|
||||
alt="Hack Club students"
|
||||
key={'image-' + index}
|
||||
/>
|
||||
))}
|
||||
</Marquee>
|
||||
</Box>
|
||||
<Box sx={{ display: ['none', 'none', 'none', 'none', 'block'] }}>
|
||||
<Marquee velocity={12}>
|
||||
{photos.map((photo, index) => (
|
||||
<Image
|
||||
placeholder="blur"
|
||||
src={photo}
|
||||
objectFit="cover"
|
||||
className="next-image"
|
||||
height="200px"
|
||||
width="600px"
|
||||
key={'image-' + index}
|
||||
alt="Hack Club students"
|
||||
/>
|
||||
))}
|
||||
</Marquee>
|
||||
</Box>
|
||||
</Box>
|
||||
)
|
||||
|
||||
const DonorListing = ({ name, url }) => {
|
||||
if (url) {
|
||||
return (
|
||||
<A target="_blank" href={url} color="black" underline>
|
||||
<DonorCard name={name} link />
|
||||
</A>
|
||||
)
|
||||
} else {
|
||||
return <DonorCard name={name} />
|
||||
}
|
||||
}
|
||||
|
||||
export default function Donate({ sprig }) {
|
||||
useEffect(() => {
|
||||
if (sprig) {
|
||||
window.document.getElementById('sprig-donation').scrollIntoView()
|
||||
}
|
||||
}, [sprig])
|
||||
|
||||
return (
|
||||
<Box>
|
||||
<Meta
|
||||
as={Head}
|
||||
title={title}
|
||||
description={desc}
|
||||
image="https://cloud-cz9a6kt0a-hack-club-bot.vercel.app/0social-photo_2.jpg"
|
||||
/>
|
||||
<Nav color="muted" />
|
||||
<ForceTheme theme="light" />
|
||||
<Header sx={{ position: 'relative' }}>
|
||||
<Box
|
||||
sx={{
|
||||
background: 'rgba(0,0,0, 0.8)',
|
||||
zIndex: 1,
|
||||
position: 'relative',
|
||||
color: 'white!important',
|
||||
height: '600px'
|
||||
}}
|
||||
pt={[5, 5, '110px']}
|
||||
>
|
||||
<Box
|
||||
sx={{
|
||||
maxWidth: '64rem',
|
||||
mx: 'auto',
|
||||
zIndex: 1,
|
||||
position: 'relative'
|
||||
}}
|
||||
align="center"
|
||||
py={2}
|
||||
px={[1, 3]}
|
||||
>
|
||||
<Container sx={{ maxWidth: '48rem' }}>
|
||||
<Heading
|
||||
sx={{
|
||||
fontSize: ['42px', '54px', '72px'],
|
||||
my: 2,
|
||||
color: 'white'
|
||||
}}
|
||||
>
|
||||
We rely on people like you to bring coding to the world.
|
||||
</Heading>
|
||||
<Box
|
||||
sx={{
|
||||
fontSize: ['22px', '23px', '28px'],
|
||||
maxWidth: '40rem',
|
||||
color: 'white'
|
||||
}}
|
||||
>
|
||||
Contribute today to empower the next generation. Help start a
|
||||
Hack Club at every high school.
|
||||
</Box>
|
||||
<Button
|
||||
variant="ctaLg"
|
||||
my={3}
|
||||
sx={{ width: ['100%', 'auto'] }}
|
||||
as="a"
|
||||
href="https://hcb.hackclub.com/donations/start/hq"
|
||||
>
|
||||
Donate
|
||||
<Text sx={{ display: ['none', 'inline-block'], ml: 2 }}>
|
||||
to Hack Club
|
||||
</Text>
|
||||
</Button>
|
||||
<Text
|
||||
sx={{ mt: 1, display: 'block', opacity: 0.8 }}
|
||||
fontSize={2}
|
||||
color="white"
|
||||
>
|
||||
Your contribution is tax-deductible.
|
||||
<br />
|
||||
Hack Club is a 501(c)(3) nonprofit with the EIN 81-2908499.
|
||||
</Text>
|
||||
</Container>
|
||||
</Box>
|
||||
</Box>
|
||||
<Box
|
||||
sx={{
|
||||
position: 'absolute',
|
||||
top: 0,
|
||||
zIndex: 0,
|
||||
width: '100%',
|
||||
display: 'block'
|
||||
}}
|
||||
>
|
||||
<PhotoRow
|
||||
photos={[
|
||||
ExecuteBig,
|
||||
HackCamp,
|
||||
HackerGames,
|
||||
LaptopDonations,
|
||||
Kerala
|
||||
]}
|
||||
/>
|
||||
<PhotoRow
|
||||
photos={[HackPenn, ElonAMA, SpaceX, GoldenTrain, Flagship]}
|
||||
/>
|
||||
<PhotoRow
|
||||
photos={[
|
||||
HackCamp2020,
|
||||
InnovationCircuit,
|
||||
WindyCity,
|
||||
MAHacks,
|
||||
ZephyrFun
|
||||
]}
|
||||
/>
|
||||
</Box>
|
||||
</Header>
|
||||
<Container mb={5} id="sprig-donation"></Container>
|
||||
{sprig && <SprigMeta />}
|
||||
<Container variant="copy">
|
||||
<Box pt={[0, 3]} mb={[2, 4]}>
|
||||
<Heading
|
||||
sx={{
|
||||
textAlign: 'center',
|
||||
fontSize: 4,
|
||||
textTransform: 'uppercase',
|
||||
fontWeight: [400, 800],
|
||||
mb: [0, 0]
|
||||
}}
|
||||
>
|
||||
Now introducing...
|
||||
</Heading>
|
||||
<Heading
|
||||
mt={2}
|
||||
sx={{
|
||||
textAlign: 'center',
|
||||
textTransform: 'uppercase',
|
||||
fontSize: [5, 7],
|
||||
lineHeight: [0.8, 1],
|
||||
mb: 0,
|
||||
marginBlockEnd: 0,
|
||||
marginBlockStart: 0,
|
||||
my: [2, 0]
|
||||
}}
|
||||
>
|
||||
Sprig Consoles
|
||||
</Heading>
|
||||
<Box
|
||||
sx={{
|
||||
display: 'flex',
|
||||
flexDirection: 'column',
|
||||
justifyContent: 'space-around'
|
||||
}}
|
||||
>
|
||||
<Heading
|
||||
variant="subtitle"
|
||||
pb={[3, 2, 2]}
|
||||
sx={{
|
||||
textAlign: 'center',
|
||||
color: 'blue',
|
||||
textTransform: 'uppercase',
|
||||
mt: [2, 0],
|
||||
fontWeight: 800
|
||||
}}
|
||||
>
|
||||
Inspiring teenagers to both make and code.
|
||||
</Heading>
|
||||
<Text sx={{ textAlign: 'center', fontSize: 2 }}>
|
||||
A donation to the Sprig fund will send a teenager a Hack Club
|
||||
Sprig Console Kit: containing a custom PCB, buttons, a screen, a
|
||||
microprocessor, and more (all open source, of course), so that
|
||||
they can build and then play their own games.
|
||||
</Text>
|
||||
</Box>
|
||||
</Box>
|
||||
<Grid
|
||||
columns={[null, '2fr 3fr']}
|
||||
gap={[2, 3, 4]}
|
||||
pt={[0, 0]}
|
||||
mb={[2, 4]}
|
||||
>
|
||||
<Box
|
||||
as="video"
|
||||
style={{
|
||||
width: '100%',
|
||||
borderRadius: '1em',
|
||||
height: '100%',
|
||||
objectFit: 'cover'
|
||||
}}
|
||||
autoPlay
|
||||
muted
|
||||
loop
|
||||
>
|
||||
<source
|
||||
src="https://cloud-5r3ak1pm6-hack-club-bot.vercel.app/0image_from_ios__online-video-cutter.com__1_.mp4"
|
||||
type="video/mp4"
|
||||
/>
|
||||
</Box>
|
||||
<Photo
|
||||
src="https://cloud-kcloydjv0-hack-club-bot.vercel.app/0image_from_ios__1_.jpg"
|
||||
alt="Sprig PCB"
|
||||
width={3000}
|
||||
height={2550}
|
||||
showAlt
|
||||
sx={{ height: '100%' }}
|
||||
/>
|
||||
</Grid>
|
||||
<Sheet
|
||||
sx={{
|
||||
color: 'white',
|
||||
bg: 'primary',
|
||||
display: 'flex',
|
||||
flexDirection: 'row',
|
||||
flexWrap: ['wrap', 'nowrap'],
|
||||
justifyContent: 'space-between',
|
||||
alignItems: 'center',
|
||||
padding: 4
|
||||
}}
|
||||
>
|
||||
<SprigForm />
|
||||
</Sheet>
|
||||
</Container>
|
||||
<Container variant="copy" mt={5}>
|
||||
<FirstQuote>
|
||||
<Heading my={3} sx={{ fontWeight: 'normal', fontSize: '27px' }}>
|
||||
When I took CS classes in high school, I always found myself
|
||||
disengaged and feeling like they were just another class. After
|
||||
getting involved in Hack Club, a career in computer science changed
|
||||
from a possibility to reality.
|
||||
</Heading>
|
||||
<Heading
|
||||
fontSize={[4, 5]}
|
||||
sx={{ fontWeight: 'bold', fontSize: ['27px', '36px'] }}
|
||||
as="h1"
|
||||
>
|
||||
Because of Hack Club, I started organizing hackathons with hundreds
|
||||
of participants, interning for companies including Intuit, and most
|
||||
importantly, fell in love with building things with code.
|
||||
</Heading>
|
||||
<Flex align="center" mt={[3, 4]}>
|
||||
<Avatar
|
||||
src="/hackers/selynna.jpg"
|
||||
sx={{ height: '48px', width: '48px' }}
|
||||
mr={3}
|
||||
st
|
||||
/>
|
||||
<Box align="left" fontSize={3}>
|
||||
<Heading>Selynna Sun</Heading>
|
||||
<Text fontSize={2} color="green.1">
|
||||
Sophomore & CS Major @ Cal Poly SLO
|
||||
</Text>
|
||||
</Box>
|
||||
</Flex>
|
||||
</FirstQuote>
|
||||
<Container maxWidth={'48rem'} sx={{ maxWidth: '48rem' }} py={[3, 4]}>
|
||||
<Heading as="h1" sx={{ fontSize: ['36px', '48px'] }}>
|
||||
Contribute beyond just dollars.
|
||||
</Heading>
|
||||
<Box mt={2} mb={2} sx={{ fontSize: '27px' }}>
|
||||
We accept donations of time, technical or hard science fiction
|
||||
books, stocks/other securities, and cryptocurrency.
|
||||
</Box>
|
||||
<Box mb={3} sx={{ fontSize: '27px' }}>
|
||||
Please get in touch at{' '}
|
||||
<A sx={{ color: 'blue' }} href="mailto:hcb@hackclub.com">
|
||||
hcb@hackclub.com
|
||||
</A>{' '}
|
||||
if you’re interested in making a contribution with cryptocurrency or
|
||||
have questions.
|
||||
</Box>
|
||||
</Container>
|
||||
<SecondQuote>
|
||||
<Heading
|
||||
fontSize={[4, 5]}
|
||||
sx={{ fontWeight: 'bold', fontSize: ['27px', '36px'] }}
|
||||
as="h1"
|
||||
>
|
||||
Hack Club has inspired me to grow and become the person I am today.
|
||||
Being part of the community allows me to meet countless like-minded
|
||||
individuals who challenge me to become a better person, and a better
|
||||
hacker.
|
||||
</Heading>
|
||||
<Flex align="center" mt={[3, 4]}>
|
||||
<Avatar
|
||||
src="/hackers/rashid.jpg"
|
||||
sx={{ height: '48px', width: '48px' }}
|
||||
mr={3}
|
||||
st
|
||||
/>
|
||||
<Box align="left" fontSize={3}>
|
||||
<Heading>Rashid Al-Abri</Heading>
|
||||
<Text fontSize={2} color="green.1">
|
||||
Club Leader from Oman in Victoria, BC, Canada
|
||||
</Text>
|
||||
</Box>
|
||||
</Flex>
|
||||
</SecondQuote>{' '}
|
||||
</Container>
|
||||
<Flex justify="center" bg="snow" color="black">
|
||||
<Container width={1} py={[4, 5]} sx={{ textAlign: ['left', 'center'] }}>
|
||||
<Heading
|
||||
px={3}
|
||||
mt={[3, 4]}
|
||||
mb={[3, 4]}
|
||||
mx="auto"
|
||||
as="h1"
|
||||
sx={{ fontSize: [5, 6] }}
|
||||
>
|
||||
A few of our amazing donors.
|
||||
</Heading>
|
||||
<DonorGrid mt={4} mb={4}>
|
||||
{Object.keys(donors).map(name => (
|
||||
<DonorListing key={name} name={name} url={donors[name]} />
|
||||
))}
|
||||
</DonorGrid>
|
||||
<Heading px={3} sx={{ fontWeight: 'normal', mt: 2 }}>
|
||||
and many more…
|
||||
</Heading>
|
||||
</Container>
|
||||
</Flex>
|
||||
<Container {...contentContainer}>
|
||||
<Row my={5} {...content}>
|
||||
<Heading {...subhline} mb={4} sx={{ fontSize: [4, 5] }}>
|
||||
These fabulous companies donate their products to us.
|
||||
</Heading>
|
||||
<Sponsors />
|
||||
</Row>
|
||||
</Container>
|
||||
<Footer />
|
||||
</Box>
|
||||
)
|
||||
}
|
||||
|
||||
export async function getServerSideProps(context) {
|
||||
return {
|
||||
props: {
|
||||
sprig: Object.keys(context.query).includes('gl')
|
||||
}
|
||||
}
|
||||
}
|
||||
184
pages/index.js
184
pages/index.js
|
|
@ -1,7 +1,17 @@
|
|||
import {Badge, Box, Button, Card, Flex, Grid, Heading, Link, Text} from 'theme-ui'
|
||||
import React, {useEffect, useRef, useState} from 'react'
|
||||
import {
|
||||
Badge,
|
||||
Box,
|
||||
Button,
|
||||
Card,
|
||||
Flex,
|
||||
Grid,
|
||||
Heading,
|
||||
Link,
|
||||
Text
|
||||
} from 'theme-ui'
|
||||
import React, { useEffect, useRef, useState } from 'react'
|
||||
import Head from 'next/head'
|
||||
import {useRouter} from 'next/router'
|
||||
import { useRouter } from 'next/router'
|
||||
import Meta from '@hackclub/meta'
|
||||
import Nav from '../components/nav'
|
||||
import BGImg from '../components/background-image'
|
||||
|
|
@ -120,6 +130,24 @@ function Page({
|
|||
}
|
||||
}, [count, images.length])
|
||||
|
||||
// Spotlight effect
|
||||
const spotlightRef = useRef()
|
||||
useEffect(() => {
|
||||
const handler = event => {
|
||||
var rect = document.getElementById('spotlight').getBoundingClientRect()
|
||||
var x = event.clientX - rect.left //x position within the element.
|
||||
var y = event.clientY - rect.top //y position within the element.
|
||||
|
||||
spotlightRef.current.style.background = `radial-gradient(
|
||||
circle at ${x}px ${y}px,
|
||||
rgba(132, 146, 166, 0) 10px,
|
||||
rgba(249, 250, 252, 0.9) 80px
|
||||
)`
|
||||
}
|
||||
window.addEventListener('mousemove', handler)
|
||||
return () => window.removeEventListener('mousemove', handler)
|
||||
}, [])
|
||||
|
||||
return (
|
||||
<>
|
||||
<Meta
|
||||
|
|
@ -148,15 +176,15 @@ function Page({
|
|||
reveal={reveal}
|
||||
onMouseEnter={() => {
|
||||
setHover(true)
|
||||
console.log(hover)
|
||||
}}
|
||||
onMouseOut={() => {
|
||||
setHover(false)
|
||||
setReveal(false)
|
||||
}}
|
||||
/>
|
||||
<Konami action={easterEgg}>
|
||||
{"Hey, I'm an Easter Egg! Look at me!"}
|
||||
</Konami>
|
||||
|
||||
<Box
|
||||
as="header"
|
||||
sx={{
|
||||
|
|
@ -228,7 +256,6 @@ function Page({
|
|||
>
|
||||
<Text
|
||||
onClick={() => {
|
||||
setHover(false)
|
||||
!reveal ? setReveal(true) : setReveal(false)
|
||||
}}
|
||||
sx={{
|
||||
|
|
@ -586,21 +613,38 @@ function Page({
|
|||
</Box>
|
||||
<Carousel cards={carouselCards} />
|
||||
<Box
|
||||
id="spotlight"
|
||||
as="section"
|
||||
sx={{
|
||||
background: 'snow',
|
||||
backgroundImage: `url('https://icons.hackclub.com/api/icons/0xF4F7FB/glyph:rep.svg')`,
|
||||
backgroundImage: `
|
||||
linear-gradient(rgba(249, 250, 252, 0.7), rgba(249, 250, 252, 0.7)),
|
||||
url('https://icons.hackclub.com/api/icons/0x8492a6/glyph:rep.svg')
|
||||
`,
|
||||
backgroundSize: '40px 40px',
|
||||
backgroundRepeat: 'repeat',
|
||||
backgroundPosition: '10% 10%'
|
||||
position: 'relative'
|
||||
}}
|
||||
>
|
||||
<Box
|
||||
ref={spotlightRef}
|
||||
sx={{
|
||||
position: 'absolute',
|
||||
zIndex: 2,
|
||||
top: 0,
|
||||
left: 0,
|
||||
right: 0,
|
||||
bottom: 0,
|
||||
bg: 'snow',
|
||||
pointerEvents: 'none'
|
||||
}}
|
||||
/>
|
||||
<Box
|
||||
sx={{
|
||||
position: 'relative',
|
||||
width: '90vw',
|
||||
maxWidth: 'layout',
|
||||
margin: 'auto'
|
||||
margin: 'auto',
|
||||
zIndex: 5
|
||||
}}
|
||||
py={[4, 4, 5]}
|
||||
>
|
||||
|
|
@ -734,6 +778,7 @@ function Page({
|
|||
url={data.url}
|
||||
message={data.message}
|
||||
key={key}
|
||||
opacity={1 / (key/2 + 1)}
|
||||
/>
|
||||
)
|
||||
})}
|
||||
|
|
@ -1068,78 +1113,79 @@ function Page({
|
|||
</Grid>
|
||||
</Box>
|
||||
</Box>
|
||||
</Box>
|
||||
{new URL(asPath, 'http://example.com').searchParams.get('gen') ===
|
||||
'z' && (
|
||||
<>
|
||||
<Box
|
||||
sx={{
|
||||
position: 'fixed',
|
||||
top: 0,
|
||||
width: '100%',
|
||||
zIndex: 1000
|
||||
}}
|
||||
>
|
||||
|
||||
{new URL(asPath, 'http://example.com').searchParams.get('gen') ===
|
||||
'z' && (
|
||||
<>
|
||||
<Box
|
||||
sx={{
|
||||
position: 'relative',
|
||||
margin: 'auto',
|
||||
width: 'fit-content',
|
||||
position: 'fixed',
|
||||
top: 0,
|
||||
width: '100%',
|
||||
zIndex: 1000
|
||||
}}
|
||||
>
|
||||
<Box
|
||||
sx={{
|
||||
position: 'relative',
|
||||
margin: 'auto',
|
||||
width: 'fit-content',
|
||||
lineHeight: 0
|
||||
}}
|
||||
>
|
||||
<iframe
|
||||
width="560"
|
||||
height="315"
|
||||
src="https://www.youtube-nocookie.com/embed/sJNK4VKeoBM?si=zvhDKhb9C5G2b4TJ&controls=1&autoplay=1&mute=1"
|
||||
title="YouTube video player"
|
||||
frameborder="0"
|
||||
allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share"
|
||||
allowfullscreen
|
||||
></iframe>
|
||||
</Box>
|
||||
</Box>
|
||||
<Box
|
||||
sx={{
|
||||
position: 'fixed',
|
||||
bottom: 0,
|
||||
right: 0,
|
||||
zIndex: 1000,
|
||||
lineHeight: 0
|
||||
}}
|
||||
>
|
||||
<iframe
|
||||
width="560"
|
||||
height="315"
|
||||
src="https://www.youtube-nocookie.com/embed/sJNK4VKeoBM?si=zvhDKhb9C5G2b4TJ&controls=1&autoplay=1&mute=1"
|
||||
src="https://www.youtube-nocookie.com/embed/ChBg4aowzX8?si=X2J_T95yiaKXB2q4&controls=1&autoplay=1&mute=1"
|
||||
title="YouTube video player"
|
||||
frameborder="0"
|
||||
allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share"
|
||||
allowfullscreen
|
||||
></iframe>
|
||||
</Box>
|
||||
</Box>
|
||||
<Box
|
||||
sx={{
|
||||
position: 'fixed',
|
||||
bottom: 0,
|
||||
right: 0,
|
||||
zIndex: 1000,
|
||||
lineHeight: 0
|
||||
}}
|
||||
>
|
||||
<iframe
|
||||
width="560"
|
||||
height="315"
|
||||
src="https://www.youtube-nocookie.com/embed/ChBg4aowzX8?si=X2J_T95yiaKXB2q4&controls=1&autoplay=1&mute=1"
|
||||
title="YouTube video player"
|
||||
frameborder="0"
|
||||
allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share"
|
||||
allowfullscreen
|
||||
></iframe>
|
||||
</Box>
|
||||
<Box
|
||||
sx={{
|
||||
position: 'fixed',
|
||||
bottom: 0,
|
||||
left: 0,
|
||||
zIndex: 1000,
|
||||
lineHeight: 0
|
||||
}}
|
||||
>
|
||||
<iframe
|
||||
width="560"
|
||||
height="315"
|
||||
src="https://www.youtube-nocookie.com/embed/JDQr1vICu54?si=U6-9AFtk7EdTabfp&autoplay=1&mute=1"
|
||||
title="YouTube video player"
|
||||
frameborder="0"
|
||||
allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share"
|
||||
allowfullscreen
|
||||
></iframe>
|
||||
</Box>
|
||||
</>
|
||||
)}
|
||||
<MailingList />
|
||||
<Box
|
||||
sx={{
|
||||
position: 'fixed',
|
||||
bottom: 0,
|
||||
left: 0,
|
||||
zIndex: 1000,
|
||||
lineHeight: 0
|
||||
}}
|
||||
>
|
||||
<iframe
|
||||
width="560"
|
||||
height="315"
|
||||
src="https://www.youtube-nocookie.com/embed/JDQr1vICu54?si=U6-9AFtk7EdTabfp&autoplay=1&mute=1"
|
||||
title="YouTube video player"
|
||||
frameborder="0"
|
||||
allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share"
|
||||
allowfullscreen
|
||||
></iframe>
|
||||
</Box>
|
||||
</>
|
||||
)}
|
||||
<MailingList />
|
||||
</Box>
|
||||
<Footer
|
||||
dark
|
||||
sx={{
|
||||
|
|
@ -1225,7 +1271,7 @@ export async function getStaticProps() {
|
|||
} catch (error) {
|
||||
hackathonsData = [] // or some default value if an error occurs
|
||||
}
|
||||
hackathonsData.sort((a, b) => new Date(a.start) - new Date(b.start));
|
||||
hackathonsData.sort((a, b) => new Date(a.start) - new Date(b.start))
|
||||
|
||||
let events = await fetch(
|
||||
'https://events.hackclub.com/api/events/upcoming/'
|
||||
|
|
|
|||
|
|
@ -82,11 +82,12 @@ const PhotoRow = ({ photos }) => (
|
|||
)
|
||||
|
||||
const data = [
|
||||
{ name: '3452 Members', Teenagers: 3452, year: '2018' },
|
||||
{ name: '6932 Members', Teenagers: 6932, year: '2019' },
|
||||
{ name: '13530 Members', Teenagers: 13530, year: '2020' },
|
||||
{ name: '18347 Members', Teenagers: 18347, year: '2021' },
|
||||
{ name: '21790 Members', Teenagers: 21790, year: '2022' }
|
||||
{ name: '3452 Teenagers', Teenagers: 3452, year: '2018' },
|
||||
{ name: '6932 Teenagers', Teenagers: 6932, year: '2019' },
|
||||
{ name: '13530 Teenagers', Teenagers: 13530, year: '2020' },
|
||||
{ name: '18347 Teenagers', Teenagers: 18347, year: '2021' },
|
||||
{ name: '21790 Teenagers', Teenagers: 21790, year: '2022' },
|
||||
{ name: '28720 Teenagers', Teenagers: 28720, year: '2023' }
|
||||
]
|
||||
|
||||
const Sheet = styled(Card)`
|
||||
|
|
@ -179,7 +180,7 @@ const Highlight = ({ children }) => {
|
|||
}
|
||||
const Line = () => {
|
||||
return (
|
||||
<Fade bottom>
|
||||
<Fade>
|
||||
<Box
|
||||
sx={{
|
||||
borderBottom: '1px solid #e0e6ed',
|
||||
|
|
@ -283,7 +284,7 @@ const delimiterIconStyles = {
|
|||
}
|
||||
const Map = () => {
|
||||
return (
|
||||
<Fade bottom>
|
||||
<Fade>
|
||||
<Box
|
||||
sx={{
|
||||
position: 'relative',
|
||||
|
|
@ -345,7 +346,7 @@ const Philanthropy = ({ posts = [] }) => {
|
|||
>
|
||||
Investing in the future
|
||||
</Text>
|
||||
<Fade bottom delay={90}>
|
||||
<Fade delay={90}>
|
||||
<Button
|
||||
variant="ctaLg"
|
||||
my={3}
|
||||
|
|
@ -373,7 +374,7 @@ const Philanthropy = ({ posts = [] }) => {
|
|||
<Header sx={{ position: 'relative' }}>
|
||||
<Box
|
||||
sx={{
|
||||
background: 'rgba(0,0,0, 0.8)',
|
||||
background: 'rgba(0,0,0, 0.7)',
|
||||
zIndex: 1,
|
||||
position: 'relative',
|
||||
color: 'white!important',
|
||||
|
|
@ -476,7 +477,7 @@ const Philanthropy = ({ posts = [] }) => {
|
|||
}
|
||||
}}
|
||||
>
|
||||
<Fade bottom delay={60}>
|
||||
<Fade delay={60}>
|
||||
<Box
|
||||
sx={{
|
||||
mt: 4,
|
||||
|
|
@ -491,7 +492,7 @@ const Philanthropy = ({ posts = [] }) => {
|
|||
</Box>
|
||||
</Fade>
|
||||
<Line />
|
||||
<Fade bottom>
|
||||
<Fade>
|
||||
<Text as="h1" mb={2} mt={4}>
|
||||
In the next ten years, Hack Club will discover, foster and inspire
|
||||
thousands more teenagers to use technical skills to solve
|
||||
|
|
@ -499,7 +500,7 @@ const Philanthropy = ({ posts = [] }) => {
|
|||
</Text>
|
||||
</Fade>
|
||||
<br />
|
||||
<Fade bottom>
|
||||
<Fade>
|
||||
<Text as="p">
|
||||
Led by young engineers, with early backing from the 21st century’s
|
||||
most iconic creators, Hack Club already reaches tens of thousands
|
||||
|
|
@ -511,7 +512,7 @@ const Philanthropy = ({ posts = [] }) => {
|
|||
</Text>
|
||||
</Fade>
|
||||
<br />
|
||||
<Fade bottom>
|
||||
<Fade>
|
||||
<Text as="p">
|
||||
Hack Club is always free for teenagers and with your support, Hack
|
||||
Club can grow to hundreds of thousands of teen hackers, bringing
|
||||
|
|
@ -520,7 +521,7 @@ const Philanthropy = ({ posts = [] }) => {
|
|||
from, how they identify, or what their parents do.
|
||||
</Text>
|
||||
</Fade>
|
||||
<Fade bottom>
|
||||
<Fade>
|
||||
<br />
|
||||
<Text as="p">
|
||||
Over time, Hack Clubbers will reshape societies as entrepreneurs,
|
||||
|
|
@ -534,35 +535,35 @@ const Philanthropy = ({ posts = [] }) => {
|
|||
</Text>
|
||||
</Fade>
|
||||
<Grid gap={2} columns={[1, 2, 3, 5]} mt={4}>
|
||||
<Fade bottom delay={30}>
|
||||
<Fade delay={30}>
|
||||
<HackClubber
|
||||
photo="arianna.png"
|
||||
quote="Always inspiring interesting new projects"
|
||||
info="Arianna, 16, Kentucky"
|
||||
/>
|
||||
</Fade>
|
||||
<Fade bottom delay={60}>
|
||||
<Fade delay={60}>
|
||||
<HackClubber
|
||||
photo="jason.png"
|
||||
quote="I’ve met some of the best people"
|
||||
info="Jason, 16, Texas"
|
||||
/>
|
||||
</Fade>
|
||||
<Fade bottom delay={90}>
|
||||
<Fade delay={90}>
|
||||
<HackClubber
|
||||
photo="sam.png"
|
||||
quote="In Hack Club I’ve found a home"
|
||||
info="Sam, 17, Singapore"
|
||||
/>
|
||||
</Fade>
|
||||
<Fade bottom delay={120}>
|
||||
<Fade delay={120}>
|
||||
<HackClubber
|
||||
photo="abby.png"
|
||||
quote="Helped build me a strong coding foundation"
|
||||
info="Abby, 15, Los Angeles"
|
||||
/>
|
||||
</Fade>
|
||||
<Fade bottom delay={150}>
|
||||
<Fade delay={150}>
|
||||
<HackClubber
|
||||
photo="adriano.png"
|
||||
quote="Totally different from the coding classes at school"
|
||||
|
|
@ -570,12 +571,12 @@ const Philanthropy = ({ posts = [] }) => {
|
|||
/>
|
||||
</Fade>
|
||||
</Grid>
|
||||
<Fade bottom>
|
||||
<Fade>
|
||||
<Text as="h2" mt={5}>
|
||||
To discuss a gift:
|
||||
</Text>
|
||||
</Fade>
|
||||
<Fade bottom>
|
||||
<Fade>
|
||||
<Grid gap={[4, 2, 2]} columns={[1, '1r 1fr', '1fr 1fr']} mt={2}>
|
||||
<Box>
|
||||
<Text as="h3">Reach out to</Text>
|
||||
|
|
@ -623,34 +624,68 @@ const Philanthropy = ({ posts = [] }) => {
|
|||
</Grid>
|
||||
</Fade>
|
||||
<Line />
|
||||
<Fade bottom delay={100}>
|
||||
<Fade delay={100}>
|
||||
<Flex sx={{ justifyContent: 'space-between' }} mt={[3, 4]}>
|
||||
<Box>
|
||||
<Text as="h2">View Hack Club's 2020 IRS Form 990</Text>
|
||||
<Text as="p">2021 Form will soon be ready and shared.</Text>
|
||||
<Text as="h2">View Hack Club's IRS Form 990s</Text>
|
||||
<Text as="p">2023 Form will be shared when ready.</Text>
|
||||
</Box>
|
||||
<Box>
|
||||
<Button
|
||||
as="a"
|
||||
variant="outline"
|
||||
href="https://cloud-d2t8vvprl-hack-club-bot.vercel.app/0form990package.pdf"
|
||||
target="_blank"
|
||||
mb={4}
|
||||
sx={{
|
||||
fontSize: '1em !important',
|
||||
width: 'fit-content',
|
||||
float: 'right',
|
||||
mt: 2
|
||||
}}
|
||||
>
|
||||
Form 990
|
||||
</Button>
|
||||
as="a"
|
||||
variant="outline"
|
||||
href="https://cloud-q56a8ttty-hack-club-bot.vercel.app/0hack_foundation_2022_form_990.pdf"
|
||||
target="_blank"
|
||||
mb={4}
|
||||
sx={{
|
||||
fontSize: '1em !important',
|
||||
width: 'fit-content',
|
||||
float: 'right',
|
||||
mt: 2
|
||||
}}
|
||||
>
|
||||
2022
|
||||
</Button>
|
||||
<Button
|
||||
as="a"
|
||||
variant="outline"
|
||||
href="https://cloud-f23epej2p-hack-club-bot.vercel.app/0hack_foundation_2021_990_-_public__1_.pdf"
|
||||
target="_blank"
|
||||
mb={4}
|
||||
sx={{
|
||||
fontSize: '1em !important',
|
||||
width: 'fit-content',
|
||||
float: 'right',
|
||||
mt: 2,
|
||||
mr: 2
|
||||
}}
|
||||
>
|
||||
2021
|
||||
</Button>
|
||||
<Button
|
||||
as="a"
|
||||
variant="outline"
|
||||
href="https://cloud-d2t8vvprl-hack-club-bot.vercel.app/0form990package.pdf"
|
||||
target="_blank"
|
||||
mb={4}
|
||||
sx={{
|
||||
fontSize: '1em !important',
|
||||
width: 'fit-content',
|
||||
float: 'right',
|
||||
mt: 2,
|
||||
mr: 2
|
||||
}}
|
||||
>
|
||||
2020
|
||||
</Button>
|
||||
</Box>
|
||||
</Flex>
|
||||
<span>
|
||||
Starting in 2021, Hack Club has engaged with an external auditing
|
||||
firm and has audited financials through the current fiscal year.
|
||||
</span>
|
||||
</Fade>
|
||||
{/* <Fade bottom delay={300}>
|
||||
{/* <Fade delay={300}>
|
||||
<Text
|
||||
as="a"
|
||||
mt={2}
|
||||
|
|
@ -677,13 +712,18 @@ const Philanthropy = ({ posts = [] }) => {
|
|||
}}
|
||||
>
|
||||
<Container sx={{ textAlign: 'center' }}>
|
||||
<Fade bottom>
|
||||
<Fade>
|
||||
<Text as="h1" sx={{ fontSize: ['28px', '28px', '36px'] }}>
|
||||
Hack Club is already making a difference!
|
||||
</Text>
|
||||
</Fade>
|
||||
<Grid my="4" gap={2} columns={[1, 1, 1, 2]}>
|
||||
<Fade bottom delay={30}>
|
||||
<Grid
|
||||
my="4"
|
||||
gap={2}
|
||||
columns={[1, 1, 1, 2]}
|
||||
sx={{ alignItems: 'center' }}
|
||||
>
|
||||
<Fade delay={30}>
|
||||
<Graph />
|
||||
</Fade>
|
||||
<Box
|
||||
|
|
@ -692,38 +732,38 @@ const Philanthropy = ({ posts = [] }) => {
|
|||
margin: 'auto'
|
||||
}}
|
||||
>
|
||||
<Fade bottom delay={90}>
|
||||
<Fade delay={90}>
|
||||
<Stat
|
||||
num="11 million"
|
||||
words="messages sent"
|
||||
background="https://icons.hackclub.com/api/icons/0xFAFAFA/glyph:slack.svg"
|
||||
/>
|
||||
</Fade>
|
||||
<Fade bottom delay={120}>
|
||||
<Fade delay={120}>
|
||||
<Stat
|
||||
num="400"
|
||||
words="Hack Clubs around the world"
|
||||
num="450+"
|
||||
words="coding clubs"
|
||||
background="https://icons.hackclub.com/api/icons/0xFAFAFA/glyph:event-code.svg"
|
||||
/>
|
||||
</Fade>
|
||||
<Fade bottom delay={150}>
|
||||
<Fade delay={180}>
|
||||
<Stat
|
||||
num="500"
|
||||
words="nonprofits supported"
|
||||
background="https://icons.hackclub.com/api/icons/0xFAFAFA/glyph:member-add.svg"
|
||||
/>
|
||||
</Fade>
|
||||
<Fade bottom delay={180}>
|
||||
<Stat
|
||||
num="100+"
|
||||
words="global events"
|
||||
num="180+"
|
||||
words="global events supported"
|
||||
background="https://icons.hackclub.com/api/icons/0xFAFAFA/glyph:profile.svg"
|
||||
/>
|
||||
</Fade>
|
||||
<Fade bottom delay={180}>
|
||||
<Fade delay={150}>
|
||||
<Stat
|
||||
num="4"
|
||||
words="life changing summers"
|
||||
num="1800+"
|
||||
words="nonprofits & clubs sponsored"
|
||||
background="https://icons.hackclub.com/api/icons/0xFAFAFA/glyph:member-add.svg"
|
||||
/>
|
||||
</Fade>
|
||||
<Fade delay={180}>
|
||||
<Stat
|
||||
num="$14 million"
|
||||
words="transacted on HCB"
|
||||
background="https://icons.hackclub.com/api/icons/0xFAFAFA/glyph:photo.svg"
|
||||
/>
|
||||
</Fade>
|
||||
|
|
@ -762,7 +802,7 @@ const Philanthropy = ({ posts = [] }) => {
|
|||
}
|
||||
}}
|
||||
>
|
||||
<Fade bottom>
|
||||
<Fade>
|
||||
<Text as="h1" my={4}>
|
||||
As the largest network of technical teenagers, we are featured in
|
||||
the news:
|
||||
|
|
@ -819,12 +859,12 @@ const Philanthropy = ({ posts = [] }) => {
|
|||
</Grid>
|
||||
</Fade>
|
||||
<Line />
|
||||
<Fade bottom>
|
||||
<Text as="h1">Board of Directors</Text>
|
||||
<Fade>
|
||||
<Text as="h1" sx={{marginBottom: '20px'}}>Board of Directors</Text>
|
||||
</Fade>
|
||||
<Grid gap={4} columns={[1, '1fr 2fr', '1fr 2fr']} mt={2}>
|
||||
<Box>
|
||||
<Fade bottom>
|
||||
<Fade>
|
||||
<Box>
|
||||
<Box sx={{ display: 'flex', alignItems: 'center' }}>
|
||||
<Box
|
||||
|
|
@ -855,7 +895,7 @@ const Philanthropy = ({ posts = [] }) => {
|
|||
</Box>
|
||||
</Box>
|
||||
</Fade>
|
||||
<Fade bottom delay={200}>
|
||||
<Fade delay={200}>
|
||||
<br />
|
||||
<Box>
|
||||
<Box sx={{ display: 'flex', alignItems: 'center' }}>
|
||||
|
|
@ -883,7 +923,7 @@ const Philanthropy = ({ posts = [] }) => {
|
|||
</Box>
|
||||
</Box>
|
||||
</Fade>
|
||||
<Fade bottom delay={400}>
|
||||
<Fade delay={400}>
|
||||
<br />
|
||||
<Box>
|
||||
<Box sx={{ display: 'flex', alignItems: 'center' }}>
|
||||
|
|
@ -911,7 +951,7 @@ const Philanthropy = ({ posts = [] }) => {
|
|||
</Box>
|
||||
</Box>
|
||||
</Fade>
|
||||
<Fade bottom delay={600}>
|
||||
<Fade delay={600}>
|
||||
<br />
|
||||
<Box>
|
||||
<Box sx={{ display: 'flex', alignItems: 'center' }}>
|
||||
|
|
@ -939,15 +979,15 @@ const Philanthropy = ({ posts = [] }) => {
|
|||
</Box>
|
||||
</Box>
|
||||
</Fade>
|
||||
<Fade bottom delay={800}>
|
||||
<Fade delay={800}>
|
||||
<br />
|
||||
<Text sx={{ color: 'muted', fontSize: '90%' }}>
|
||||
Board advisor: John Abele (Founder, Boston Scientific)
|
||||
</Text>
|
||||
</Fade>
|
||||
</Box>
|
||||
<Fade bottom delay={900}>
|
||||
<Box sx={{ color: 'muted' }}>
|
||||
<Fade delay={900}>
|
||||
<Box sx={{ color: 'slate' }}>
|
||||
<Text as="p">
|
||||
<Quote>“</Quote>Hack Club is the organization I wish I had
|
||||
when I was a teenager.
|
||||
|
|
@ -978,166 +1018,196 @@ const Philanthropy = ({ posts = [] }) => {
|
|||
</Grid>
|
||||
<Line />
|
||||
<Box>
|
||||
<Fade bottom>
|
||||
<Text as="h1">Join our community of generous donors</Text>
|
||||
<Fade>
|
||||
<Text as="h1" sx={{marginBottom: '20px'}}>Join our community of generous donors</Text>
|
||||
</Fade>
|
||||
<Grid gap={2} columns={[2, 4, 4]} mt={2}>
|
||||
<Box>
|
||||
<Fade bottom delay={50}>
|
||||
<Text as="h3">$2 Million</Text>
|
||||
<Fade delay={50}>
|
||||
<Text as="h3" sx={{marginBottom: '8px'}}>Above $5M </Text>
|
||||
</Fade>
|
||||
<Fade bottom delay={80}>
|
||||
<Fade delay={70}>
|
||||
<Text as="p" sx={{ lineHeight: '1.8em' }}>
|
||||
Tom Preston-Werner
|
||||
Musk Foundation (4x)
|
||||
</Text>
|
||||
</Fade>
|
||||
<Fade bottom delay={110}>
|
||||
<br></br>
|
||||
<Fade delay={90}>
|
||||
<Text as="h3" sx={{marginBottom: '8px'}}> $1M - $5M </Text>
|
||||
</Fade>
|
||||
<Fade delay={110}>
|
||||
<Text as="p" sx={{ lineHeight: '1.8em' }}>
|
||||
Musk Foundation
|
||||
Tom Preston-Werner (7x)
|
||||
</Text>
|
||||
</Fade>
|
||||
</Box>
|
||||
<Box>
|
||||
<Fade bottom delay={140}>
|
||||
<Text as="h3">$500k - $1M</Text>
|
||||
</Fade>
|
||||
<Fade bottom delay={170}>
|
||||
<Fade delay={120}>
|
||||
<Text as="p" sx={{ lineHeight: '1.8em' }}>
|
||||
Joe Liemandt
|
||||
Tobi Lutke
|
||||
</Text>
|
||||
</Fade>
|
||||
<Fade bottom delay={200}>
|
||||
<Fade delay={130}>
|
||||
<Text as="p" sx={{ lineHeight: '1.8em' }}>
|
||||
The Libermans
|
||||
</Text>
|
||||
</Fade>
|
||||
<Fade bottom delay={230}>
|
||||
</Box>
|
||||
<Box>
|
||||
<Fade delay={140}>
|
||||
<Text as="h3" sx={{marginBottom: '8px'}}>$500k - $1M</Text>
|
||||
</Fade>
|
||||
<Fade delay={180}>
|
||||
<Text as="p" sx={{ lineHeight: '1.8em' }}>
|
||||
Lizzy Danhakl/Andrew Reed
|
||||
Lizzy Danhakl/Andrew Reed (3x)
|
||||
</Text>
|
||||
</Fade>
|
||||
<Fade delay={210}>
|
||||
<Text as="p" sx={{ lineHeight: '1.8em' }}>
|
||||
Craig Newmark (4x)
|
||||
</Text>
|
||||
</Fade>
|
||||
<Fade delay={230}>
|
||||
<Text as="p" sx={{ lineHeight: '1.8em' }}>
|
||||
Endless Network (2x)
|
||||
</Text>
|
||||
</Fade>
|
||||
<Fade delay={250}>
|
||||
<Text as="p" sx={{ lineHeight: '1.8em' }}>
|
||||
Joe Liemandt
|
||||
</Text>
|
||||
</Fade>
|
||||
</Box>
|
||||
<Box>
|
||||
<Fade bottom delay={260}>
|
||||
<Text as="h3">$200k - $500k</Text>
|
||||
<Fade delay={260}>
|
||||
<Text as="h3" sx={{marginBottom: '8px'}}>$200k - $500k</Text>
|
||||
</Fade>
|
||||
<Fade bottom delay={290}>
|
||||
<Fade delay={290}>
|
||||
<Text as="p" sx={{ lineHeight: '1.8em' }}>
|
||||
Vitalik Buterin
|
||||
Gwynne Shotwell
|
||||
</Text>
|
||||
</Fade>
|
||||
<Fade bottom delay={300}>
|
||||
<Fade delay={300}>
|
||||
<Text as="p" sx={{ lineHeight: '1.8em' }}>
|
||||
Jack Dorsey
|
||||
</Text>
|
||||
</Fade>
|
||||
<Fade bottom delay={320}>
|
||||
<Fade delay={330}>
|
||||
<Text as="p" sx={{ lineHeight: '1.8em' }}>
|
||||
Craig Newmark
|
||||
Vitalik Buterin
|
||||
</Text>
|
||||
</Fade>
|
||||
<Fade bottom delay={350}>
|
||||
<Text as="p" sx={{ lineHeight: '1.8em' }}>
|
||||
Ron Conway
|
||||
</Text>
|
||||
</Fade>
|
||||
<Fade bottom delay={380}>
|
||||
<Text as="p" sx={{ lineHeight: '1.8em' }}>
|
||||
Endless Network
|
||||
</Text>
|
||||
</Fade>
|
||||
<Fade bottom delay={410}>
|
||||
<Text as="p" sx={{ lineHeight: '1.8em' }}>
|
||||
Argosy Foundation
|
||||
</Text>
|
||||
</Fade>
|
||||
<Fade bottom delay={440}>
|
||||
<Fade delay={345}>
|
||||
<Text as="p" sx={{ lineHeight: '1.8em' }}>
|
||||
Ron Baron
|
||||
</Text>
|
||||
</Fade>
|
||||
</Box>
|
||||
<Box>
|
||||
<Fade bottom delay={470}>
|
||||
<Text as="h3">$100k- $200k</Text>
|
||||
</Fade>
|
||||
<Fade bottom delay={5000}>
|
||||
<Fade delay={360}>
|
||||
<Text as="p" sx={{ lineHeight: '1.8em' }}>
|
||||
Quinn Slack
|
||||
Ron Conway (4x)
|
||||
</Text>
|
||||
</Fade>
|
||||
<Fade bottom delay={530}>
|
||||
<Fade delay={410}>
|
||||
<Text as="p" sx={{ lineHeight: '1.8em' }}>
|
||||
Adam Ross
|
||||
Argosy Foundation (3x)
|
||||
</Text>
|
||||
</Fade>
|
||||
</Box>
|
||||
<Box>
|
||||
<Fade delay={470}>
|
||||
<Text as="h3" sx={{marginBottom: '8px'}}>$100k- $200k</Text>
|
||||
</Fade>
|
||||
<Fade delay={500}>
|
||||
<Text as="p" sx={{ lineHeight: '1.8em' }}>
|
||||
Quinn Slack (3x)
|
||||
</Text>
|
||||
</Fade>
|
||||
<Fade delay={530}>
|
||||
<Text as="p" sx={{ lineHeight: '1.8em' }}>
|
||||
Adam Ross (3x)
|
||||
</Text>
|
||||
</Fade>
|
||||
<Fade delay={560}>
|
||||
<Text as="p" sx={{ lineHeight: '1.8em' }}>
|
||||
Peter Levine
|
||||
</Text>
|
||||
</Fade>
|
||||
<Fade delay={590}>
|
||||
<Text as="p" sx={{ lineHeight: '1.8em' }}>
|
||||
FUTO
|
||||
</Text>
|
||||
</Fade>
|
||||
</Box>
|
||||
</Grid>
|
||||
<Fade delay={800}>
|
||||
<br />
|
||||
<Text sx={{ color: 'muted', fontSize: '90%' }}>
|
||||
* The numbers in bracket indicates repeated gifts
|
||||
</Text>
|
||||
</Fade>
|
||||
</Box>
|
||||
<Fade bottom>
|
||||
<Fade>
|
||||
<Text as="h2" mt={4} mb={2}>
|
||||
A few others who support Hack Club
|
||||
</Text>
|
||||
</Fade>
|
||||
<Box sx={{ display: 'flex', flexWrap: 'wrap', gap: 2 }} mb={5}>
|
||||
<Fade bottom delay={30}>
|
||||
<Fade delay={30}>
|
||||
<Pill
|
||||
logo="https://cloud-kwnsazl2x-hack-club-bot.vercel.app/0figma.png"
|
||||
name="Dylan Field, Founder, Figma"
|
||||
/>
|
||||
</Fade>
|
||||
<Fade bottom delay={60}>
|
||||
<Fade delay={60}>
|
||||
<Pill
|
||||
logo="https://cloud-kwnsazl2x-hack-club-bot.vercel.app/1vercel.png"
|
||||
name="Guillermo Rauch, Founder, Vercel"
|
||||
/>
|
||||
</Fade>
|
||||
<Fade bottom delay={90}>
|
||||
<Fade delay={90}>
|
||||
<Pill
|
||||
logo="https://cloud-kwnsazl2x-hack-club-bot.vercel.app/7laravel.png"
|
||||
name="Taylor Otwell, Creator of Laravel"
|
||||
/>
|
||||
</Fade>
|
||||
<Fade bottom delay={120}>
|
||||
<Fade delay={120}>
|
||||
<Pill
|
||||
logo="https://cloud-kwnsazl2x-hack-club-bot.vercel.app/5sequoia.png"
|
||||
name="Andrew Reed, Partner, Sequoia"
|
||||
/>
|
||||
</Fade>
|
||||
<Fade bottom delay={150}>
|
||||
<Fade delay={150}>
|
||||
<Pill
|
||||
logo="https://cloud-kwnsazl2x-hack-club-bot.vercel.app/6replit.png"
|
||||
name="Amjad Masad, Co-founder, Replit"
|
||||
/>
|
||||
</Fade>
|
||||
<Fade bottom delay={180}>
|
||||
<Fade delay={180}>
|
||||
<Pill
|
||||
logo="https://cloud-kwnsazl2x-hack-club-bot.vercel.app/2workflow.png"
|
||||
name="Conrad Kramer, Co-founder, Workflow"
|
||||
/>
|
||||
</Fade>
|
||||
<Fade bottom delay={210}>
|
||||
<Fade delay={210}>
|
||||
<Pill
|
||||
logo="https://cloud-kwnsazl2x-hack-club-bot.vercel.app/3github.png"
|
||||
name="Tim Clem, Senior Engineer, GitHub"
|
||||
/>
|
||||
</Fade>
|
||||
<Fade bottom delay={240}>
|
||||
<Fade delay={240}>
|
||||
<Pill
|
||||
logo="https://cloud-kwnsazl2x-hack-club-bot.vercel.app/4sentry.png"
|
||||
name="David Cramer, Co-founder, Sentry"
|
||||
/>
|
||||
</Fade>
|
||||
<Fade bottom delay={270}>
|
||||
<Fade delay={270}>
|
||||
<Pill
|
||||
logo="https://cloud-kwnsazl2x-hack-club-bot.vercel.app/8vgs.png"
|
||||
name="Mahmoud Abdelkader, CEO, Very Good Security"
|
||||
/>
|
||||
</Fade>
|
||||
<Fade bottom delay={270}>
|
||||
<Fade delay={270}>
|
||||
<Pill name="Blake Lieberman, Partner, Rief Ventures" />
|
||||
</Fade>
|
||||
<Fade bottom delay={300}>
|
||||
<Fade delay={300}>
|
||||
<Text
|
||||
as="a"
|
||||
href="/philanthropy/supporters"
|
||||
|
|
@ -1152,6 +1222,7 @@ const Philanthropy = ({ posts = [] }) => {
|
|||
display: 'flex',
|
||||
alignItems: 'center',
|
||||
transition: '0.5s ease',
|
||||
border: '1px solid #1f2d3d',
|
||||
':hover': {
|
||||
backgroundColor: '#e0e6ed'
|
||||
}
|
||||
|
|
@ -1161,14 +1232,14 @@ const Philanthropy = ({ posts = [] }) => {
|
|||
</Text>
|
||||
</Fade>
|
||||
</Box>
|
||||
<Fade bottom>
|
||||
<Fade>
|
||||
<Text as="h2" my={3}>
|
||||
Only through their support are we able to empower students like
|
||||
Obrey and Maggie
|
||||
</Text>
|
||||
</Fade>
|
||||
<Grid gap={3} columns={[1, 1, 1, 2]} mt={2} mb={4}>
|
||||
<Fade bottom delay={100}>
|
||||
<Fade delay={100}>
|
||||
<Q>
|
||||
<Heading mb={3} sx={{ fontWeight: 'normal', fontSize: '18px' }}>
|
||||
Obrey Muchena started a Hack Club in his senior year of high
|
||||
|
|
@ -1200,7 +1271,7 @@ const Philanthropy = ({ posts = [] }) => {
|
|||
</Flex>
|
||||
</Q>
|
||||
</Fade>
|
||||
<Fade bottom delay={200}>
|
||||
<Fade delay={200}>
|
||||
<Q>
|
||||
<Heading mb={3} sx={{ fontWeight: 'normal', fontSize: '18px' }}>
|
||||
In 2021, Maggie joined the Hack Club community; she has since
|
||||
|
|
@ -1235,7 +1306,7 @@ const Philanthropy = ({ posts = [] }) => {
|
|||
</Fade>
|
||||
</Grid>
|
||||
<Line />
|
||||
<Fade bottom>
|
||||
<Fade>
|
||||
<Text as="h1" sx={{ textAlign: 'center' }} mb={[4, 5]}>
|
||||
Hack Club invites the 21st century’s leading thinkers, builders
|
||||
and disrupters to join our small, core network of donors with a
|
||||
|
|
@ -1243,7 +1314,7 @@ const Philanthropy = ({ posts = [] }) => {
|
|||
</Text>
|
||||
</Fade>
|
||||
<Grid columns={['1fr', '1fr', '1fr', '0.8fr 1.2fr']}>
|
||||
<Fade bottom>
|
||||
<Fade>
|
||||
<Box>
|
||||
<Text as="p">
|
||||
We envision thousands of diverse Hack Club leaders in towns
|
||||
|
|
@ -1262,66 +1333,66 @@ const Philanthropy = ({ posts = [] }) => {
|
|||
</Fade>
|
||||
<Map />
|
||||
</Grid>
|
||||
<Fade bottom>
|
||||
<Fade>
|
||||
<Text as="p" mt={4}>
|
||||
Your gift will:
|
||||
</Text>
|
||||
</Fade>
|
||||
<ul>
|
||||
<Fade bottom>
|
||||
<Fade>
|
||||
<li>
|
||||
Increase support to serve thousands more teenagers, with a
|
||||
strong focus on serving those who face additional barriers to
|
||||
contributing their talents to the world
|
||||
</li>
|
||||
</Fade>
|
||||
<Fade bottom delay={30}>
|
||||
<Fade delay={30}>
|
||||
<li>
|
||||
Create hundreds more Hack Clubs in high schools and communities
|
||||
across the country and world
|
||||
</li>
|
||||
</Fade>
|
||||
<Fade bottom delay={60}>
|
||||
<Fade delay={60}>
|
||||
<li>
|
||||
Inspire a problem-solving mindset and a hacker identity, where
|
||||
teenagers are empowered to build what they want to see in the
|
||||
world
|
||||
</li>
|
||||
</Fade>
|
||||
<Fade bottom delay={90}>
|
||||
<Fade delay={90}>
|
||||
<li>
|
||||
Make Hack Club the best place to be a teenager on the internet,
|
||||
incentivizing a shift among teenagers from consumers to creators
|
||||
of technology
|
||||
</li>
|
||||
</Fade>
|
||||
<Fade bottom delay={120}>
|
||||
<Fade delay={120}>
|
||||
<li>
|
||||
Launch special projects, in which Hack Clubbers collaborate with
|
||||
SpaceX, Vercel, Cloudflare, Replit, Dogecoin and others
|
||||
</li>
|
||||
</Fade>
|
||||
<Fade bottom delay={150}>
|
||||
<Fade delay={150}>
|
||||
<li>
|
||||
Popularize transparent accounting, open source building, and
|
||||
high-integrity leadership
|
||||
</li>
|
||||
</Fade>
|
||||
<Fade bottom delay={180}>
|
||||
<Fade delay={180}>
|
||||
<li>Grow the team, mostly engineers</li>
|
||||
</Fade>
|
||||
<Fade bottom delay={210}>
|
||||
<Fade delay={210}>
|
||||
<li>
|
||||
Host dozens of in-person events, including our summer adventure
|
||||
</li>
|
||||
</Fade>
|
||||
<Fade bottom delay={240}>
|
||||
<Fade delay={240}>
|
||||
<li>
|
||||
Extend mini-grants of hardware and internet access to hundreds
|
||||
of teenagers
|
||||
</li>
|
||||
</Fade>
|
||||
<Fade bottom delay={270}>
|
||||
<Fade delay={270}>
|
||||
<li>
|
||||
Bring computer science and engineering skills to thousands more
|
||||
teenagers
|
||||
|
|
@ -1329,18 +1400,18 @@ const Philanthropy = ({ posts = [] }) => {
|
|||
</Fade>
|
||||
</ul>
|
||||
<Box my={4}>
|
||||
<Fade bottom delay={350}>
|
||||
<Fade delay={350}>
|
||||
<Text as="h2" sx={{ mb: 0, pb: 0, mt: 2 }}>
|
||||
Thank you for your consideration!
|
||||
</Text>
|
||||
</Fade>
|
||||
<Fade bottom delay={380}>
|
||||
<Fade delay={380}>
|
||||
<Text as="h2" sx={{ mt: 0 }}>
|
||||
Sincerely,
|
||||
</Text>
|
||||
</Fade>
|
||||
<Flex mb={4}>
|
||||
<Fade bottom delay={410}>
|
||||
<Fade delay={410}>
|
||||
<Box sx={{ marginRight: 3 }}>
|
||||
<Image
|
||||
src="/philanthropy/christina-s.png"
|
||||
|
|
@ -1351,7 +1422,7 @@ const Philanthropy = ({ posts = [] }) => {
|
|||
<Text as="p">Christina Asquith, Co-founder and COO</Text>
|
||||
</Box>
|
||||
</Fade>
|
||||
<Fade bottom delay={440}>
|
||||
<Fade delay={440}>
|
||||
<Box>
|
||||
<Image
|
||||
src="/philanthropy/zach-s.png"
|
||||
|
|
@ -1364,7 +1435,7 @@ const Philanthropy = ({ posts = [] }) => {
|
|||
</Fade>
|
||||
</Flex>
|
||||
</Box>
|
||||
<Fade bottom delay={200}>
|
||||
<Fade delay={200}>
|
||||
<Grid
|
||||
gap={4}
|
||||
columns={[1, '2fr 1fr', '2fr 1fr']}
|
||||
|
|
@ -1398,7 +1469,7 @@ const Philanthropy = ({ posts = [] }) => {
|
|||
</Box>
|
||||
</Grid>
|
||||
</Fade>
|
||||
<Fade bottom>
|
||||
<Fade>
|
||||
<Button
|
||||
as="a"
|
||||
href="/philanthropy/hackclub_philanthropy.pdf"
|
||||
|
|
@ -1409,7 +1480,7 @@ const Philanthropy = ({ posts = [] }) => {
|
|||
Download as PDF
|
||||
</Button>
|
||||
</Fade>
|
||||
<Fade bottom>
|
||||
<Fade>
|
||||
<Text
|
||||
as="p"
|
||||
sx={{ fontSize: '90% !important', color: 'muted', pb: 2 }}
|
||||
|
|
|
|||
|
|
@ -61,7 +61,7 @@ const Page = () => (
|
|||
</Box>
|
||||
<Button
|
||||
as="a"
|
||||
href="https://drive.google.com/open?id=1FgPJv68QzLVvCdFFTls0Exu0JO2npIhC"
|
||||
href="https://drive.google.com/drive/folders/1t57tU00j6OZbDCpWsyRYsaQGShQqK9Zh?usp=sharing"
|
||||
variant="outline"
|
||||
mt={4}
|
||||
mb={4}
|
||||
|
|
|
|||
|
|
@ -25,7 +25,7 @@ export default function Team() {
|
|||
backgroundImage:
|
||||
'radial-gradient(ellipse farthest-corner at top left,rgb(36 181 165 / 70%),rgb(30 151 137 / 70%)), url(https://cloud-6b7atvvf8-hack-club-bot.vercel.app/0hack_club_team_-_july_2023.jpg)',
|
||||
backgroundSize: 'cover',
|
||||
backgroundPosition: '75%'
|
||||
backgroundPosition: '25% 15%'
|
||||
}}
|
||||
>
|
||||
<Container>
|
||||
|
|
@ -256,6 +256,15 @@ export default function Team() {
|
|||
... .... . .----. ... / .- .-.. ... --- / ..-. .-.. ..- . -. - / .. -. / -- --- .-. ... . / -.-. --- -.. . -.-.--"
|
||||
pronouns="she/her"
|
||||
/>
|
||||
<Bio
|
||||
img="https://assets.devlucas.page/images/profile.jpg"
|
||||
name="Lucas Honda"
|
||||
teamRole="Engineering"
|
||||
text="Lucas is a 14 year old Hack Clubber from Sao Paulo, Brazil. Since joining the Hack Club, he has been fascinated by Sprig and is currently leading Sprig App Review Team, and working to make it the best it possibly can be. He loves all aspects of aviation, and scours the internet/skies looking for and investigating flying machines. He spends a good portion of his time with his dog, a happy and playful dog."
|
||||
pronouns="he/him"
|
||||
href="https://page.devlucas.page"
|
||||
video="https://www.youtube.com/embed/vuLtlzMMW6o?si=v-Dbn2fSGvTyXlbY"
|
||||
/>
|
||||
</Grid>
|
||||
</Box>
|
||||
</Box>
|
||||
|
|
|
|||
Loading…
Add table
Reference in a new issue