System-End/site
1
0
Fork 0
mirror of https://github.com/System-End/site.git synced 2026-04-19 15:18:18 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

🎨 Format

Browse source
This commit is contained in:
Malted 2023-08-31 21:49:37 +01:00
parent 3c06c2fce5
commit a28be424be
No known key found for this signature in database
34 changed files with 584 additions and 394 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

4
components/donate/sprigForm.js
View file

@ -6,9 +6,7 @@ const pricePerSprig = 100
const SprigForm = () => {
const [count, setCount] = useState(1)
function url() {
const u = new URL(
'https://hcb.hackclub.com/donations/start/game-lab-fund/'
)
const u = new URL('https://hcb.hackclub.com/donations/start/game-lab-fund/')
u.searchParams.set(
'amount',
pricePerSprig * count * 100 /* convert to cents */

4
components/elon.mdx
View file

@ -27,12 +27,12 @@ a lot of what we’ve already been doing (and [what I wrote about at the beginni
of the year](https://zachinto2020.wordpress.com/2019/12/31/as-midnight-approaches/)):
we’ll spend as little money as possible at all times, and we’ll hire a small
number of diverse staff from video game engineers to media producers to make
Hack Club better. We are pushing hard now to expand users of [HCB](https://hackclub.com/hcb/),
Hack Club better. We are pushing hard now to expand users of [HCB](https://hackclub.com/hcb/),
and continuing to try and make the Hack Club Slack the best place to be a teenager on the intenet.
We’ll have a proper announcement in a few weeks, but one thing we’re doing after
winning the [Frank Grant](https://grant.frank.ly/) and now receiving Elon’s
gift, is open sourcing our finances. Hack Club HQ has been running on HCB
gift, is open sourcing our finances. Hack Club HQ has been running on HCB
since February and starting today, you can see our account publicly at
https://hcb.hackclub.com/hq. You can track how we spend every single dollar of
Elon’s gift. Soon, we will also launch https://frank.ly/ on Hack Club’s

81
components/hcb/apply/address-input.js
View file

@ -6,29 +6,28 @@ import { geocode, search } from '../../../lib/hcb/apply/address-validation'
import Icon from '../../icon'
const approvedCountries = [
"AT",
"FI",
"FR",
"DE",
"GR",
"ES",
"IT",
"SE",
"TR",
"GB",
"NO",
"UA",
"BR",
"CO",
"US",
"CA",
"MX",
"JP",
"PH",
"MY",
"SG",
];
'AT',
'FI',
'FR',
'DE',
'GR',
'ES',
'IT',
'SE',
'TR',
'GB',
'NO',
'UA',
'BR',
'CO',
'US',
'CA',
'MX',
'JP',
'PH',
'MY',
'SG'
]
export default function AutoComplete({ name, isPersonalAddressInput }) {
const input = useRef()
@ -38,8 +37,8 @@ export default function AutoComplete({ name, isPersonalAddressInput }) {
const optionClicked = async prediction => {
input.current.value = prediction.name
await onInput(prediction.name)
setPredictions(null)
await onInput(prediction.name)
setPredictions(null)
}
const clickOutside = e => {
if (input.current && !input.current.contains(e.target)) {
@ -47,26 +46,26 @@ export default function AutoComplete({ name, isPersonalAddressInput }) {
}
}
const onInput = async value => {
setPredictions(value ? (await search(value)).results : null);
const onInput = async value => {
setPredictions(value ? (await search(value)).results : null)
if (isPersonalAddressInput) return
geocode(value)
.then(res => {
const country = res?.results[0]?.country
const countryCode = res?.results[0]?.countryCode
if (isPersonalAddressInput) return
geocode(value)
.then(res => {
const country = res?.results[0]?.country
const countryCode = res?.results[0]?.countryCode
setCountryCode(countryCode)
setCountryCode(countryCode)
sessionStorage.setItem('bank-signup-eventCountry', country)
sessionStorage.setItem('bank-signup-eventCountryCode', countryCode)
})
.catch(err => console.error(err));
}
sessionStorage.setItem('bank-signup-eventCountry', country)
sessionStorage.setItem('bank-signup-eventCountryCode', countryCode)
})
.catch(err => console.error(err))
}
const onInputWrapper = async e => {
if (e.target.value) await onInput(e.target.value)
}
const onInputWrapper = async e => {
if (e.target.value) await onInput(e.target.value)
}
//TODO: Close suggestions view when focus is lost via tabbing.
//TODO: Navigate suggestions with arrow keys.

26
components/hcb/apply/personal-form.js
View file

@ -161,19 +161,19 @@ export default function PersonalInfoForm({
</div>
) : null}
</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"
requiredFields={requiredFields}
>
<Input
name="accommodations"
id="accommodations"
placeholder="I need a screen reader"
sx={{ ...AutofillColourFix }}
/>
</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"
requiredFields={requiredFields}
>
<Input
name="accommodations"
id="accommodations"
placeholder="I need a screen reader"
sx={{ ...AutofillColourFix }}
/>
</Field>
</>
)
}

4
components/hcb/everything.js
View file

@ -31,8 +31,8 @@ export default function Everything({ fee, partner = false }) {
'Transaction data export': 'download',
'Record shared notes on transactions': 'docs',
'24-hour response support': 'clock',
'Reimbursement process': 'enter',
// 'Instant deposits': 'bolt'
'Reimbursement process': 'enter'
// 'Instant deposits': 'bolt'
}).map(([item, icon = 'enter']) => (
<ListItem key={item} icon={icon}>
{item}

5
components/hcb/features.js
View file

@ -26,10 +26,7 @@ export default function Features({ partner = false }) {
icon="bank-account"
name="Fund"
body={
<>
A fund under the hood with a custom, beautiful
dashboard.
</>
<>A fund under the hood with a custom, beautiful dashboard.</>
}
/>
<ModuleDetails>

4
components/hcb/first/testimonials.js
View file

@ -27,8 +27,8 @@ export default function Testimonials() {
<i>FIRST</i> teams all over the country run on HCB.
</Heading>
<Text variant="lead" color="muted">
Everywhere from San Jose to Boston to New York,
HCB powers teams of all sizes.
Everywhere from San Jose to Boston to New York, HCB powers teams of
all sizes.
</Text>
</Container>
<Container>

57
components/hcb/landing.js
View file

@ -1,4 +1,13 @@
import { Box, Button, Heading, Link, Flex, Text, Container, Badge } from 'theme-ui'
import {
Box,
Button,
Heading,
Link,
Flex,
Text,
Container,
Badge
} from 'theme-ui'
import Fade from 'react-reveal/Fade'
import ScrollHint from '../scroll-hint'
import Image from 'next/image'
@ -36,7 +45,6 @@ export default function Landing({ showButton = true, eventsCount }) {
textAlign: 'center'
}}
>
<Heading
variant="ultratitle"
sx={{
@ -54,22 +62,31 @@ export default function Landing({ showButton = true, eventsCount }) {
>
<Underline>Become a nonprofit</Underline> with HCB
</Heading>
<Flex sx={{ gap: 3, alignItems: 'center', justifyContent: 'center', marginBottom: 4 }}>
<img
src="/hcb/hcb-icon-icon-dark.png"
alt="HCB Icon"
height={64}
sx={{
margin: "auto"
}}
/>
<Text as="h2" sx={{ fontSize: 4 }}>HCB by</Text>
<img
src="https://assets.hackclub.com/flag-standalone.svg"
alt="hack club flag"
height={48}
/>
</Flex>
<Flex
sx={{
gap: 3,
alignItems: 'center',
justifyContent: 'center',
marginBottom: 4
}}
>
<img
src="/hcb/hcb-icon-icon-dark.png"
alt="HCB Icon"
height={64}
sx={{
margin: 'auto'
}}
/>
<Text as="h2" sx={{ fontSize: 4 }}>
HCB by
</Text>
<img
src="https://assets.hackclub.com/flag-standalone.svg"
alt="hack club flag"
height={48}
/>
</Flex>
<Container variant="copy">
<Text
variant="lead"
@ -91,8 +108,8 @@ export default function Landing({ showButton = true, eventsCount }) {
Innovation Circuit
</Link>{' '}
is one of {Math.round((eventsCount - 50) / 100) * 100}+
teams who use <strong>HCB</strong> to
run world-class organizations, hackathons, and clubs.
teams who use <strong>HCB</strong> to run world-class
organizations, hackathons, and clubs.
</Text>
</Container>
</Container>

5
components/hcb/nonprofits.js
View file

@ -68,9 +68,8 @@ export default function Nonprofits() {
>
<Heading variant="title">Nonprofit? No problem.</Heading>
<Text variant="lead" color="muted">
HCB is a powerful, safe, and easy-to-use money thing,
whether you're receiving your first donation or spending
$100,000 a year.
HCB is a powerful, safe, and easy-to-use money thing, whether you're
receiving your first donation or spending $100,000 a year.
</Text>
</Container>

4
components/hcb/run.js
View file

@ -26,8 +26,8 @@ export default function Run() {
</Text>
<br />
<Text variant="lead" sx={{ color: 'muted', fontSize: 28 }}>
Receiving and managing money is just the start. HCB helps
you handle ongoing obligations while you’re organizing.
Receiving and managing money is just the start. HCB helps you handle
ongoing obligations while you’re organizing.
</Text>
</Container>
<List>

8
components/hcb/testimonials.js
View file

@ -72,8 +72,8 @@ export default function Testimonials() {
The best events across the country run on HCB.
</Heading>
<Text variant="lead" color="muted">
Everywhere from Philadelphia to Phoenix to Portland,
HCB powers events of all sizes.
Everywhere from Philadelphia to Phoenix to Portland, HCB powers
events of all sizes.
</Text>
</Container>
<Container
@ -94,9 +94,7 @@ export default function Testimonials() {
>
{events.map(event => {
const id = kebabCase(event.name)
return (
<Event {...event} img={`/hcb/events/${id}.jpg`} key={id} />
)
return <Event {...event} img={`/hcb/events/${id}.jpg`} key={id} />
})}
</Grid>
</Container>

52
components/hcb/tooltip.js
View file

@ -1,41 +1,47 @@
import React from "react";
import React from 'react'
const addClassNameToChildren = (children, className) => React.Children.map(children, child => React.cloneElement(child, { className: `${child.props.className || ''} ${className}` }));
const addClassNameToChildren = (children, className) =>
React.Children.map(children, child =>
React.cloneElement(child, {
className: `${child.props.className || ''} ${className}`
})
)
const tooltip = (direction) => function Tooltip ({ children, text }) {
const escapedText = text.replace(/'/g, "\\'");
const tooltip = direction =>
function Tooltip({ children, text }) {
const escapedText = text.replace(/'/g, "\\'")
const directionalStyles = ({
e: `
const directionalStyles = {
e: `
left: 100%;
bottom: 50%;
right: 0;
margin-left: 0.5rem;
transform: translateY(50%);
`,
w: `
w: `
right: 100%;
bottom: 50%;
margin-right: 0.5rem;
transform: translateY(50%);
`,
n: `
n: `
right: 50%;
bottom: 100%;
margin-bottom: 0.5rem;
transform: translateX(50%);
`,
s: `
s: `
right: 50%;
top: 100%;
margin-top: 0.5rem;
transform: translateX(50%);
`
})[direction || 'e'];
}[direction || 'e']
return (
<>
<style>{`.tooltipped {
<>
<style>{`.tooltipped {
position: relative;
}
@ -81,16 +87,16 @@ const tooltip = (direction) => function Tooltip ({ children, text }) {
}
}`}</style>
{children}
</>
);
}
{children}
</>
)
}
const Tooltip = tooltip();
Tooltip.N = tooltip('n');
Tooltip.S = tooltip('s');
Tooltip.E = tooltip('e');
Tooltip.W = tooltip('w');
const Tooltip = tooltip()
Tooltip.N = tooltip('n')
Tooltip.S = tooltip('s')
Tooltip.E = tooltip('e')
Tooltip.W = tooltip('w')
export { Tooltip };
export default Tooltip;
export { Tooltip }
export default Tooltip

4
components/index/cards/hcb.js
View file

@ -31,8 +31,8 @@ export default function Bank({ data }) {
<Grid columns={[1, '1.3fr 1fr', 2]}>
<Box>
<Text as="p" variant="subtitle">
Become a 501(c)3 nonprofit and join 700+ teams using
HCB to run world-class events.
Become a 501(c)3 nonprofit and join 700+ teams using HCB to run
world-class events.
</Text>
<Text as="p" variant="subtitle">
This platform is built and maintained by the Hack&nbsp;Club team.

7
components/index/cards/outernet.js
View file

@ -39,7 +39,12 @@ export default function Outernet() {
28th to 31st July, 2023!
</Text>
<Flex
sx={{ flexDirection: 'column', mt: [3, 3, 4], alignItems: 'end', justifyContent: 'flex-end' }}
sx={{
flexDirection: 'column',
mt: [3, 3, 4],
alignItems: 'end',
justifyContent: 'flex-end'
}}
>
<Buttons
icon="event-add"

6
components/slack/join-form.js
View file

@ -12,16 +12,16 @@ import {
import { useRouter } from 'next/router'
import useForm from '../../lib/use-form'
import Submit from '../submit'
import { getCookie, hasCookie } from 'cookies-next';
import { getCookie, hasCookie } from 'cookies-next'
const JoinForm = ({ sx = {} }) => {
const router = useRouter()
const { status, formProps, useField } = useForm('/api/join/', null, {
clearOnSubmit: 5000,
method: 'POST',
initData: hasCookie("continent")
initData: hasCookie('continent')
? {
continent: getCookie("continent"),
continent: getCookie('continent'),
reason: router.query.reason,
event: router.query.event
}

4
components/winter/recap.js
View file

@ -62,8 +62,8 @@ function Recap() {
</Text>
<Text variant="caption">
While you wait for your hardware, explore and get familiar with
HCB with limited access to features until you get
fully activated.
HCB with limited access to features until you get fully
activated.
</Text>
<Signup />
</Card>

14
lib/carousel.json
View file

@ -9,13 +9,13 @@
"link": "https://jams.hackclub.com"
},
{
"background": "#212529",
"titleColor": "white",
"descriptionColor": "white",
"title": "cpu.land",
"description": "Curious exactly what happens when you run a program on your computer? Read this.",
"img": "https://cloud-eg2ex8nol-hack-club-bot.vercel.app/0favicon-on-light-removebg-preview.png",
"link": "https://cpu.land"
"background": "#212529",
"titleColor": "white",
"descriptionColor": "white",
"title": "cpu.land",
"description": "Curious exactly what happens when you run a program on your computer? Read this.",
"img": "https://cloud-eg2ex8nol-hack-club-bot.vercel.app/0favicon-on-light-removebg-preview.png",
"link": "https://cpu.land"
},
{
"background": "#000",

6
middleware.js
View file

@ -8,8 +8,8 @@ export function middleware(request) {
if (continent === 'Oceania') {
continent = 'Australia'
}
const response = NextResponse.next();
response.cookies.set("continent", continent || "");
return response;
const response = NextResponse.next()
response.cookies.set('continent', continent || '')
return response
}
}

4
next.config.js
View file

@ -28,10 +28,10 @@ const nextConfig = {
},
async redirects() {
return [
{
{
source: '/bank/:path*',
destination: '/hcb/:path*',
permanent: true,
permanent: true
},
{ source: '/grant/', destination: '/hackathons/grant', permanent: false },
{

23
pages/api/github.js
View file

@ -1,20 +1,23 @@
const isRelevantEventType = (type) => ['PushEvent', 'PullRequestEvent', 'WatchEvent'].includes(type);
const isRelevantEventType = type =>
['PushEvent', 'PullRequestEvent', 'WatchEvent'].includes(type)
const getMessage = (type, payload, repo) => {
switch (type) {
case 'PushEvent':
return payload.commits?.[0]?.message || 'No commit message';
return payload.commits?.[0]?.message || 'No commit message'
case 'PullRequestEvent':
return payload.pull_request.title;
return payload.pull_request.title
case 'WatchEvent':
return `starred ${repo.name}`;
return `starred ${repo.name}`
default:
return null;
return null
}
}
export async function fetchGitHub() {
const initialGitHubData = await fetch('https://api.github.com/orgs/hackclub/events').then(r => r.json());
const initialGitHubData = await fetch(
'https://api.github.com/orgs/hackclub/events'
).then(r => r.json())
const gitHubData = initialGitHubData
.filter(({ type }) => isRelevantEventType(type))
@ -24,12 +27,12 @@ export async function fetchGitHub() {
userImage: actor.avatar_url,
message: getMessage(type, payload, repo),
time: created_at
}));
}))
return gitHubData;
return gitHubData
}
export default async function github(req, res) {
const git = await fetchGitHub(req, res);
res.json(git);
const git = await fetchGitHub(req, res)
res.json(git)
}

2
pages/api/hcb/apply.js
View file

@ -51,7 +51,7 @@ export default async function handler(req, res) {
'HCB account URL': `https://hcb.hackclub.com/${r.slug}`,
'Contact Option': data.contactOption,
'Slack Username': data.slackUsername,
'Accommodations': data.accommodations,
Accommodations: data.accommodations
})
res.writeHead(302, { Location: '/hcb/apply/success' }).end()
})

12
pages/api/slack.js
View file

@ -10,16 +10,16 @@ export async function Slack() {
formData.append('date_range', '30d')
let slackData = await fetch(
"https://hackclub.slack.com/api/team.stats.timeSeries",
'https://hackclub.slack.com/api/team.stats.timeSeries',
{
method: "POST",
method: 'POST',
body: `--orpheus\r\nContent-Disposition: form-data; name="token"\r\n\r\n${process.env.SLACK_API_TOKEN}\r\n--orpheus\r\nContent-Disposition: form-data; name="date_range"\r\n\r\n30d\r\n--orpheus\r\nContent-Disposition: form-data;`,
headers: {
"content-type": "multipart/form-data; boundary=orpheus",
cookie: process.env.SLACK_API_COOKIE,
},
'content-type': 'multipart/form-data; boundary=orpheus',
cookie: process.env.SLACK_API_COOKIE
}
}
).then((r) => r.json());
).then(r => r.json())
if (!slackData || !slackData.stats) {
console.warn(`No slack data: ${JSON.stringify(slackData)}`)

2
pages/brand.js
View file

@ -35,7 +35,7 @@ export const Logo = ({ name }) => (
{startCase(name)
.replace('Flag Orpheus', 'Orpheus Flag –')
.replace('Bw', ' (B/W)')
.replace('Hcb', 'HCB')}
.replace('Hcb', 'HCB')}
</Text>
<Grid
columns="repeat(3, 1fr)"

4
pages/clubs.js
View file

@ -520,8 +520,8 @@ const Page = () => (
desc={
<>
Use our 501(c)(3) status and a restricted fund with{' '}
<Link href="/hcb">HCB</Link> to fundraise, accept
donations, and buy things!
<Link href="/hcb">HCB</Link> to fundraise, accept donations, and
buy things!
</>
}
/>

181
pages/events.js
View file

@ -1,4 +1,16 @@
import { Box, Button, Container, Heading, Card, Text, Grid, Flex, Image as Img, Link, Divider } from 'theme-ui'
import {
Box,
Button,
Container,
Heading,
Card,
Text,
Grid,
Flex,
Image as Img,
Link,
Divider
} from 'theme-ui'
import Head from 'next/head'
import Meta from '@hackclub/meta'
import ForceTheme from '../components/force-theme'
@ -10,7 +22,6 @@ import OuternetPic from '../public/outernet/hack.jpg'
import { compact } from 'lodash'
import theme from '@hackclub/theme'
const events = [
{
name: 'Outernet',
@ -20,7 +31,8 @@ const events = [
season: 'Summer',
year: '2023',
repo: 'outernet',
image: 'https://github.com/hackclub/outernet/assets/39828164/368eac86-3c39-4842-be2c-1436a6db6f07',
image:
'https://github.com/hackclub/outernet/assets/39828164/368eac86-3c39-4842-be2c-1436a6db6f07',
link: 'https://github.com/hackclub/outernet'
},
{
@ -32,46 +44,52 @@ const events = [
year: '2022/23',
video: 'https://www.youtube.com/embed/KLx4NZZPzMc',
repo: 'epoch'
},
},
{
name: 'Assemble',
logo: 'https://emoji.slack-edge.com/T0266FRGM/assemble/4f9465eb00175463.png',
description: 'The first high school hackathon since the pandemic! Hosted by a team of Hack Clubbers to kick off a hackathon renaissance.',
description:
'The first high school hackathon since the pandemic! Hosted by a team of Hack Clubbers to kick off a hackathon renaissance.',
location: 'San Francisco, California',
season: 'Summer',
year: '2022',
video: 'https://youtube.com/embed/PnK4gzO6S3Q',
repo: 'assemble'
},
},
{
name: 'The Hacker Zephyr',
logo: 'https://hackclub.com/stickers/zephyr.svg',
description: 'A cross-country hacker adventure on a train and the longest hackathon (by miles) on land.',
description:
'A cross-country hacker adventure on a train and the longest hackathon (by miles) on land.',
location: 'Burlington (VT) to Los Angeles (CA)',
season: 'Summer',
year: '2021',
video: 'https://youtube.com/embed/2BID8_pGuqA',
repo: 'the-hacker-zephyr'
},
},
{
name: 'Summer of Making',
logo: 'https://hackclub.com/stickers/summer_of_making.svg',
description: '$50k in hardware donations to teen hackers around the world and the creation of Scrapbook:',
description:
'$50k in hardware donations to teen hackers around the world and the creation of Scrapbook:',
location: 'Online (thanks COVID-19!)',
season: 'Summer',
year: '2020',
image: 'https://cdn.sanity.io/images/2ejqxsnu/production/ed144128afb78a7095d6c77945efdd2c38078ecf-1637x990.png?w=3840&q=75&fit=clip&auto=format',
image:
'https://cdn.sanity.io/images/2ejqxsnu/production/ed144128afb78a7095d6c77945efdd2c38078ecf-1637x990.png?w=3840&q=75&fit=clip&auto=format',
link: 'https://scrapbook.hackclub.com/r/summer-of-making',
ghTag: 'summer-of-making'
},
},
{
name: 'Flagship',
logo: 'https://hackclub.com/stickers/ship.png',
description: 'An IRL meetup of high school hackathon organizers and coding club leaders. Our first "flagship" event.',
description:
'An IRL meetup of high school hackathon organizers and coding club leaders. Our first "flagship" event.',
location: 'San Francisco, California',
season: 'Summer',
year: '2019',
image: 'https://github.com/hackclub/www-assemble/blob/main/public/hackers-assemble.jpg?raw=true',
image:
'https://github.com/hackclub/www-assemble/blob/main/public/hackers-assemble.jpg?raw=true',
link: 'https://hack.af/flagship-album'
}
]
@ -89,30 +107,63 @@ const Event = ({
image,
link
}) => (
<Card variant="sunken">
<Flex sx={{alignItems: 'center', mb: 2}}>
<Img src={logo} sx={{ height: '24px', mr: 2}} />
<Heading as="h2">{name}</Heading>
</Flex>
<Box>
{description}
</Box>
{video ?
<Box as="iframe" src={video} frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" allowfullscreen width='100%' height="250px" border="none" sx={{borderRadius: '8px', mt: 2}} />
: <a href={link}><Img src={image} sx={{borderRadius: '8px', mt: 2, height: '250px', objectFit: 'cover', width: '100%', objectPosition: 'top'}} /></a>
}
<Box sx={{color: 'darkless'}}>
<b>{season}, {year} - {location}</b> </Box><Box> {repo && <Link href={`https://github.com/hackclub/${repo}`}>
<>github.com/hackclub/{repo}</>
</Link>}
{ghTag && <Link href={`https://github.com/topics/${ghTag}`}>
<Card variant="sunken">
<Flex sx={{ alignItems: 'center', mb: 2 }}>
<Img src={logo} sx={{ height: '24px', mr: 2 }} />
<Heading as="h2">{name}</Heading>
</Flex>
<Box>{description}</Box>
{video ? (
<Box
as="iframe"
src={video}
frameborder="0"
allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share"
allowfullscreen
width="100%"
height="250px"
border="none"
sx={{ borderRadius: '8px', mt: 2 }}
/>
) : (
<a href={link}>
<Img
src={image}
sx={{
borderRadius: '8px',
mt: 2,
height: '250px',
objectFit: 'cover',
width: '100%',
objectPosition: 'top'
}}
/>
</a>
)}
<Box sx={{ color: 'darkless' }}>
<b>
{season}, {year} - {location}
</b>{' '}
</Box>
<Box>
{' '}
{repo && (
<Link href={`https://github.com/hackclub/${repo}`}>
<>github.com/hackclub/{repo}</>
</Link>
)}
{ghTag && (
<Link href={`https://github.com/topics/${ghTag}`}>
<>github.com/topics/{ghTag}</>
</Link>}
{link && !repo && !ghTag && <Link href={link}>
<>{link.replace("https://", "")}</>
</Link>}
</Box>
</Card>
</Link>
)}
{link && !repo && !ghTag && (
<Link href={link}>
<>{link.replace('https://', '')}</>
</Link>
)}
</Box>
</Card>
)
const Page = ({ jobs }) => (
@ -183,7 +234,8 @@ const Page = ({ jobs }) => (
textShadow: 'small'
}}
>
Every summer and now every winter, Hack Club does something special to bring the community together. Let's take a trip down memory lane.
Every summer and now every winter, Hack Club does something special
to bring the community together. Let's take a trip down memory lane.
</Heading>
<Button
as="a"
@ -206,17 +258,50 @@ const Page = ({ jobs }) => (
align="left"
columns={['1fr', '1fr 1fr']}
>
{
events.map((event, i) => (
<Event key={`event-${i}`} {...event}/>
))
}
{events.map((event, i) => (
<Event key={`event-${i}`} {...event} />
))}
</Grid>
<Card variant="sunken" sx={{textAlign: 'center', background: theme.util.gx('cyan', 'blue'), color: 'white', width: '100%', maxWidth: '64rem', mx: 'auto', mt: 3, fontSize: 2}}>
<Box sx={{maxWidth: '600px', mx: 'auto'}}>
Looking for more? Hack Clubbers often organise their own hackathons!
Check them out at <Link href="https://hackathons.hackclub.com" sx={{color: 'white'}} target="_blank">hackathons.hackclub.com</Link>. Hack Club is also behind a series of <Link href="https://daysofservice.hackclub.com/" sx={{color: 'white'}} target="_blank">Day of Service</Link> events and <Link href="https://events.hackclub.com/" sx={{color: 'white'}} target="_blank">frequent virtual events</Link>.
<Card
variant="sunken"
sx={{
textAlign: 'center',
background: theme.util.gx('cyan', 'blue'),
color: 'white',
width: '100%',
maxWidth: '64rem',
mx: 'auto',
mt: 3,
fontSize: 2
}}
>
<Box sx={{ maxWidth: '600px', mx: 'auto' }}>
Looking for more? Hack Clubbers often organise their own hackathons!
Check them out at{' '}
<Link
href="https://hackathons.hackclub.com"
sx={{ color: 'white' }}
target="_blank"
>
hackathons.hackclub.com
</Link>
. Hack Club is also behind a series of{' '}
<Link
href="https://daysofservice.hackclub.com/"
sx={{ color: 'white' }}
target="_blank"
>
Day of Service
</Link>{' '}
events and{' '}
<Link
href="https://events.hackclub.com/"
sx={{ color: 'white' }}
target="_blank"
>
frequent virtual events
</Link>
.
</Box>
</Card>
</Container>
@ -226,4 +311,4 @@ const Page = ({ jobs }) => (
</>
)
export default Page
export default Page

11
pages/hackathons/grant.js
View file

@ -144,7 +144,8 @@ const HackathonGrant = () => {
HCB
</Link>{' '}
fees) to <a sx={{ whiteSpace: 'nowrap' }}>in-person</a>{' '}
<a sx={{ whiteSpace: 'nowrap' }}>high school</a> hackathons until December 31st, 2023.
<a sx={{ whiteSpace: 'nowrap' }}>high school</a> hackathons until
December 31st, 2023.
</Box>
<Button variant="ctaLg" as="a" href="#apply" sx={{ mt: 2 }}>
{open ? 'Apply Now' : 'Coming Soon'}
@ -334,8 +335,8 @@ const HackathonGrant = () => {
background="https://icons.hackclub.com/api/icons/0x212025/glyph:bank-account.svg"
size="28"
>
You'll receive your grant through HCB, our financial
platform for hackathons, and spend it in the open with{' '}
You'll receive your grant through HCB, our financial platform for
hackathons, and spend it in the open with{' '}
<Link
href="https://changelog.hcb.hackclub.com/transparent-finances-(optional-feature)-151427"
target="_blank"
@ -355,8 +356,8 @@ const HackathonGrant = () => {
color: 'muted'
}}
>
If you're unable to use HCB, we're unfortunately
unable to support you through this grant program.
If you're unable to use HCB, we're unfortunately unable to
support you through this grant program.
</Text>
</Requirement>
</Grid>

232
pages/hcb/climate/index.js
View file

@ -16,9 +16,7 @@ import Footer from '../../../components/footer'
import MSparkles from '../../../components/sparkles/money'
import { Text, Button, Card } from 'theme-ui'
import Icon from '@hackclub/icons'
import OrganizationCard, {
Badge
} from '../../../components/hcb/directory/card'
import OrganizationCard, { Badge } from '../../../components/hcb/directory/card'
import Zoom from 'react-reveal/Zoom'
import fuzzysort from 'fuzzysort'
import ScrollHint from '../../../components/scroll-hint'
@ -87,27 +85,26 @@ tags.__proto__.forOrg = function (org) {
return this.filter(tag => tag.match?.(org))
}
export const regions = [
{
label: 'North America',
color: 'secondary',
iconColor: 'red',
icon: 'photo',
image: 'https://cloud-cberabu5z-hack-club-bot.vercel.app/3north_america.png',
ogImage: 'https://cloud-p9tu92fwx-hack-club-bot.vercel.app/3northamerica.png'
image:
'https://cloud-cberabu5z-hack-club-bot.vercel.app/3north_america.png',
ogImage:
'https://cloud-p9tu92fwx-hack-club-bot.vercel.app/3northamerica.png'
},
{
label: 'South America',
color: 'secondary',
iconColor: 'orange',
icon: 'photo',
image: 'https://cloud-cberabu5z-hack-club-bot.vercel.app/4south_america.png',
ogImage: 'https://cloud-p9tu92fwx-hack-club-bot.vercel.app/4southamerica.png'
image:
'https://cloud-cberabu5z-hack-club-bot.vercel.app/4south_america.png',
ogImage:
'https://cloud-p9tu92fwx-hack-club-bot.vercel.app/4southamerica.png'
},
{
label: 'Africa',
@ -132,7 +129,8 @@ export const regions = [
icon: 'explore',
image:
'https://cloud-oax3m4v0t-hack-club-bot.vercel.app/0asia___oceania.png',
ogImage: 'https://cloud-p9tu92fwx-hack-club-bot.vercel.app/1asia_oceania.png'
ogImage:
'https://cloud-p9tu92fwx-hack-club-bot.vercel.app/1asia_oceania.png'
}
]
@ -496,7 +494,7 @@ export default function ClimatePage({ rawOrganizations, pageRegion }) {
if (e.key === 'Escape') {
closeModal()
}
};
}
window.addEventListener('keydown', handle)
return () => window.removeEventListener('keydown', handle)
@ -536,7 +534,10 @@ export default function ClimatePage({ rawOrganizations, pageRegion }) {
(region ? ` in ${region.label}` : '') +
" with HCB's fiscal sponsorship and financial tools. Explore the climate efforts running on HCB."
}
image={region?.ogImage ?? "https://cloud-gv8bzwz6z-hack-club-bot.vercel.app/0frame_14__1_.png"}
image={
region?.ogImage ??
'https://cloud-gv8bzwz6z-hack-club-bot.vercel.app/0frame_14__1_.png'
}
/>
<style>{styles}</style>
{modalOrganization && (
@ -568,18 +569,20 @@ export default function ClimatePage({ rawOrganizations, pageRegion }) {
e.stopPropagation()
}}
>
<Flex sx={{
position: 'absolute',
top: '10px',
right: '10px',
width: '40px',
height: '40px',
bg: 'smoke',
borderRadius: '50%',
justifyContent: 'center',
alignItems: 'center',
cursor: 'pointer'
}}>
<Flex
sx={{
position: 'absolute',
top: '10px',
right: '10px',
width: '40px',
height: '40px',
bg: 'smoke',
borderRadius: '50%',
justifyContent: 'center',
alignItems: 'center',
cursor: 'pointer'
}}
>
<Icon glyph="view-close" size={32} onClick={closeModal} />
</Flex>
<Flex sx={{ flexDirection: 'column', alignItems: 'start', gap: 3 }}>
@ -738,50 +741,54 @@ export default function ClimatePage({ rawOrganizations, pageRegion }) {
gap: 1
}}
>
{modalOrganization.links.website && <Flex
as="a"
target="_blank"
href={modalOrganization.links.website}
sx={{
flexDirection: 'row',
justifyContent: 'start',
alignItems: 'center',
color: 'slate',
textDecoration: 'none'
}}
>
<Icon glyph="web" size={38} />
<Text style={{ fontSize: '20px', marginLeft: '6px' }}>
Website
</Text>
<Icon
glyph="external"
size={20}
style={{ marginLeft: '2px', marginBottom: '6px' }}
/>
</Flex>}
{modalOrganization.links.financials && <Flex
as="a"
target="_blank"
href={modalOrganization.links.financials}
sx={{
flexDirection: 'row',
justifyContent: 'start',
alignItems: 'center',
color: 'slate',
textDecoration: 'none'
}}
>
<Icon glyph="explore" size={38} />
<Text style={{ fontSize: '20px', marginLeft: '6px' }}>
Transparent Finances
</Text>
<Icon
glyph="external"
size={20}
style={{ marginLeft: '2px', marginBottom: '6px' }}
/>
</Flex>}
{modalOrganization.links.website && (
<Flex
as="a"
target="_blank"
href={modalOrganization.links.website}
sx={{
flexDirection: 'row',
justifyContent: 'start',
alignItems: 'center',
color: 'slate',
textDecoration: 'none'
}}
>
<Icon glyph="web" size={38} />
<Text style={{ fontSize: '20px', marginLeft: '6px' }}>
Website
</Text>
<Icon
glyph="external"
size={20}
style={{ marginLeft: '2px', marginBottom: '6px' }}
/>
</Flex>
)}
{modalOrganization.links.financials && (
<Flex
as="a"
target="_blank"
href={modalOrganization.links.financials}
sx={{
flexDirection: 'row',
justifyContent: 'start',
alignItems: 'center',
color: 'slate',
textDecoration: 'none'
}}
>
<Icon glyph="explore" size={38} />
<Text style={{ fontSize: '20px', marginLeft: '6px' }}>
Transparent Finances
</Text>
<Icon
glyph="external"
size={20}
style={{ marginLeft: '2px', marginBottom: '6px' }}
/>
</Flex>
)}
</Flex>
</Flex>
{/* desktop stats */}
@ -959,16 +966,39 @@ export default function ClimatePage({ rawOrganizations, pageRegion }) {
</Flex>
Climate-focused nonprofits on{' '}
<span sx={{ whiteSpace: 'nowrap' }}>HCB</span>
{region ? <>
{' '}in
<span sx={{ display: ['none', 'inline'], whiteSpace: 'nowrap', bg: region.iconColor, pl: 3, pr: 18, mx: -1, borderRadius: 8, textShadow: 'none', ml: 2 }}>
<img src={region.image} alt="" sx={{ mr: 3, height: [30, 42, 42, 64] }} />
{region.label}
</span>
<span sx={{ display: ['inline', 'none'], whiteSpace: 'nowrap' }}>
{' ' + region.label}
</span>
</> : ''}
{region ? (
<>
{' '}
in
<span
sx={{
display: ['none', 'inline'],
whiteSpace: 'nowrap',
bg: region.iconColor,
pl: 3,
pr: 18,
mx: -1,
borderRadius: 8,
textShadow: 'none',
ml: 2
}}
>
<img
src={region.image}
alt=""
sx={{ mr: 3, height: [30, 42, 42, 64] }}
/>
{region.label}
</span>
<span
sx={{ display: ['inline', 'none'], whiteSpace: 'nowrap' }}
>
{' ' + region.label}
</span>
</>
) : (
''
)}
</Heading>
<Box
sx={{
@ -979,8 +1009,9 @@ export default function ClimatePage({ rawOrganizations, pageRegion }) {
mx: 'auto'
}}
>
Nonprofits are making real environmental impact with HCB's fiscal sponsorship and financial tools.
Explore the climate efforts running on HCB.
Nonprofits are making real environmental impact with HCB's fiscal
sponsorship and financial tools. Explore the climate efforts
running on HCB.
</Box>
<Button
variant="ctaLg"
@ -1083,16 +1114,23 @@ export default function ClimatePage({ rawOrganizations, pageRegion }) {
/>
</Box>
{organizations.length === 0 && (
<Box sx={{
textAlign: 'center',
p: 5
}}>
<Box
sx={{
textAlign: 'center',
p: 5
}}
>
<Box>
<Text variant="headline" sx={{
textTransform: 'unset',
display: 'block',
mb: 0
}}>No results</Text>
<Text
variant="headline"
sx={{
textTransform: 'unset',
display: 'block',
mb: 0
}}
>
No results
</Text>
</Box>
</Box>
)}
@ -1167,8 +1205,8 @@ export default function ClimatePage({ rawOrganizations, pageRegion }) {
}}
>
Let your money work for change by donating to all climate-focused
nonprofits on HCB. Donate to 128 Collective’s curated
list of recommended organizations.
nonprofits on HCB. Donate to 128 Collective’s curated list of
recommended organizations.
</Box>
<Button
variant="ctaLg"
@ -1181,11 +1219,7 @@ export default function ClimatePage({ rawOrganizations, pageRegion }) {
backgroundImage: t => t.util.gx('green', 'blue')
}}
>
<Text>
Donate to{' '}
the{' '}
climate&nbsp;fund
</Text>
<Text>Donate to the climate&nbsp;fund</Text>
</Button>
</Box>
</Box>

6
pages/hcb/first.js
View file

@ -143,9 +143,9 @@ export default function First() {
}}
variant="copy"
>
Built by <i>FIRST</i> alumni for <i>FIRST</i> teams, HCB
is a comprehensive financial platform used by hundreds of
clubs, teams and hackathons.
Built by <i>FIRST</i> alumni for <i>FIRST</i> teams, HCB is a
comprehensive financial platform used by hundreds of clubs, teams
and hackathons.
</Container>
<Box

19
pages/hcb/fiscal-sponsorship.js
View file

@ -413,9 +413,7 @@ export default function FiscalSponsorship() {
</Section>
<Section id="partner">
<Text variant="title">
HCB, the #1 fiscal sponsor
</Text>
<Text variant="title">HCB, the #1 fiscal sponsor</Text>
<Text variant="lead">
While many fiscal sponsors require that their partners relate to
their mission in similar ways, at HCB, we’ve built our
@ -437,8 +435,8 @@ export default function FiscalSponsorship() {
A customizable and embeddable donations URL
</Bullet>
<Bullet icon="card-add">
A fun and routing number to connect to external
platforms, like Shopify and GoFundMe
A fun and routing number to connect to external platforms, like
Shopify and GoFundMe
</Bullet>
<Bullet icon="purse">
Perks like PVSA certification, newsletter software, and
@ -450,17 +448,16 @@ export default function FiscalSponsorship() {
organization? We’d love to meet you and chat about working
together. Feel free to apply
<Link href="https://hackclub.com/hcb/#apply"> here </Link>or
<Link href="mailto:hcb@hackclub.com"> email our team </Link>if
you have more questions about fiscal sponsorship!
<Link href="mailto:hcb@hackclub.com"> email our team </Link>if you
have more questions about fiscal sponsorship!
</Text>
</Section>
<Text variant="lead">
At its core, Hack Club is a nonprofit encouraging students to learn
how to code by building and making cool things.
HCB was built out by teenagers at
Hack&nbsp;Club and continues to be a real-world space that high
schoolers can contribute to every day.
how to code by building and making cool things. HCB was built out by
teenagers at Hack&nbsp;Club and continues to be a real-world space
that high schoolers can contribute to every day.
</Text>
</FlexCol>
</Container>

6
pages/hcb/success.js
View file

@ -111,11 +111,7 @@ export default function ApplicationSuccess() {
>
#hcb
</Option>
<Option
icon="help"
label="FAQ"
link="https://hcb.hackclub.com/faq"
>
<Option icon="help" label="FAQ" link="https://hcb.hackclub.com/faq">
FAQ
</Option>
</Flex>

16
pages/jobs/lead-hacker.js
View file

@ -58,8 +58,8 @@ const Page = () => (
of joining HCB, organizations get 501(c)(3) nonprofit status, access to
a beautiful dashboard for managing their finances, and all financial and
legal matters - from tax filings to payroll - handled. 50% of high
school hackathons worldwide run on HCB, and Elon Musk has
tweeted that we're a{' '}
school hackathons worldwide run on HCB, and Elon Musk has tweeted that
we're a{' '}
<Link
href="https://twitter.com/elonmusk/status/1263275969743216640"
target="_blank"
@ -88,9 +88,9 @@ const Page = () => (
</Text>
<Text as="p">
With the right leadership, we hope to bring HCB to thousands
of organizations across the United States and process tens of millions
of dollars in transactions. We think do-gooders need the same tools that
With the right leadership, we hope to bring HCB to thousands of
organizations across the United States and process tens of millions of
dollars in transactions. We think do-gooders need the same tools that
software engineers do. For them, HCB is like GitHub: transformative.
Right now, HCB is the{' '}
<strong>
@ -306,9 +306,9 @@ const Page = () => (
>
jobs@hackclub.com
</Link>{' '}
with "HCB" in the subject line, 3 bullet points
demonstrating why you would be exceptional for the role, and your
resume / GitHub / GitLab / sourcehut.
with "HCB" in the subject line, 3 bullet points demonstrating why you
would be exceptional for the role, and your resume / GitHub / GitLab /
sourcehut.
</Box>
</Box>

148
pages/onboard.js
View file

@ -543,14 +543,49 @@ const ShipPage = () => {
</Flex>
</Box>
<Flex as="section" sx={{ px: 4, pt: 6, pb: 4, bg: dimBg, color: '#ffffff', justifyContent: 'center' }}>
<Flex sx={{ flexDirection: 'column', gap: 4, width: '100%', maxWidth: 'copyPlus' }}>
<Heading as="h2" sx={{ fontSize: 42, fontWeight: 500, borderTop: '4px solid', borderTopColor: 'red', pt: 4 }}>
<Balancer ratio={0.3}>Never made a circuit board before? No problem.</Balancer>
<Flex
as="section"
sx={{
px: 4,
pt: 6,
pb: 4,
bg: dimBg,
color: '#ffffff',
justifyContent: 'center'
}}
>
<Flex
sx={{
flexDirection: 'column',
gap: 4,
width: '100%',
maxWidth: 'copyPlus'
}}
>
<Heading
as="h2"
sx={{
fontSize: 42,
fontWeight: 500,
borderTop: '4px solid',
borderTopColor: 'red',
pt: 4
}}
>
<Balancer ratio={0.3}>
Never made a circuit board before? No problem.
</Balancer>
</Heading>
<Text sx={{ fontSize: 3 }}>
Learn how to design your own circuit boards from scratch with our <strong>official tutorials</strong> and jams, like Maggie’s <Link href="https://hack.af/pcb-jam" target="_blank">intro to PCB design jam</Link>. Ask in the{' '}
<Link href={slackLink} target="_blank">Hack Club Slack</Link>{' '}
Learn how to design your own circuit boards from scratch with our{' '}
<strong>official tutorials</strong> and jams, like Maggie’s{' '}
<Link href="https://hack.af/pcb-jam" target="_blank">
intro to PCB design jam
</Link>
. Ask in the{' '}
<Link href={slackLink} target="_blank">
Hack Club Slack
</Link>{' '}
if you have any questions!
</Text>
</Flex>
@ -654,7 +689,8 @@ const ShipPage = () => {
>
<Flex as="article">
<Text as="p" sx={{ pr: 100 }}>
A <strong>movement sensor</strong> add-on to an open source <strong>game console</strong>.
A <strong>movement sensor</strong> add-on to an open source{' '}
<strong>game console</strong>.
</Text>
<Text as="p" sx={{ pr: 140, color: 'gray' }}>
Read the source&nbsp;<span className="arrow">&rarr;</span>
@ -700,10 +736,14 @@ const ShipPage = () => {
</Flex>
</a>
<a href="https://github.com/hackclub/OnBoard/tree/main/projects/Karmanyaah_Longhorn_LEDs" target="_blank">
<a
href="https://github.com/hackclub/OnBoard/tree/main/projects/Karmanyaah_Longhorn_LEDs"
target="_blank"
>
<Flex as="article">
<Text as="p" sx={{ pr: 140 }}>
Karmanyaah's <strong>digital level</strong> in the shape of a longhorn.
Karmanyaah's <strong>digital level</strong> in the shape of a
longhorn.
</Text>
<Text as="p" sx={{ pr: 140, color: 'gray' }}>
See the designs&nbsp;<span className="arrow">&rarr;</span>
@ -904,7 +944,12 @@ const ShipPage = () => {
Collaborate, get help, and support others as you take the leap.
</Text>
<Box sx={{ mt: 1 }}>
<Button variant="outlineLg" as="a" href={slackLink} target="_blank">
<Button
variant="outlineLg"
as="a"
href={slackLink}
target="_blank"
>
Join Slack
</Button>
</Box>
@ -951,7 +996,7 @@ const ShipPage = () => {
<Grid
ref={lightsScrollTrigger}
gap={["2px", "3px", "4px"]}
gap={['2px', '3px', '4px']}
columns={recapWidth}
sx={{ width: '100%', maxWidth: 800 }}
>
@ -1003,11 +1048,17 @@ const ShipPage = () => {
</Button>
</Flex>
<Flex as="article" sx={{
transform: 'scale(1.1)'
}}>
<Flex
as="article"
sx={{
transform: 'scale(1.1)'
}}
>
<Text as="h3">Learn to PCB</Text>
<Text as="p">Read our Hacker Card tutorial to learn how to make a simple circuit board from start to end.</Text>
<Text as="p">
Read our Hacker Card tutorial to learn how to make a simple
circuit board from start to end.
</Text>
<Button as="a" href="https://hack.af/pcb-jam" target="_blank">
Start the Tutorial
</Button>
@ -1041,44 +1092,51 @@ const ShipPage = () => {
/>
<Flex
as="a"
href="https://airtable.com/shrOOU2ZZFYtffUVz"
target="_blank"
sx={{
bg: '#ff0000',
color: 'rgba(255, 255, 255, 0.7)',
textDecoration: 'none',
size: 160,
flexDirection: 'column',
textAlign: 'center',
justifyContent: 'center',
alignItems: 'center',
position: 'absolute',
top: -80,
right: '14vw',
fontSize: '24px',
lineHeight: 1.2,
fontWeight: 'bold',
fontFamily: `'${stickerButtonFont}', cursive`,
transform: 'rotate(-25deg)',
borderRadius: '50%',
as="a"
href="https://airtable.com/shrOOU2ZZFYtffUVz"
target="_blank"
sx={{
bg: '#ff0000',
color: 'rgba(255, 255, 255, 0.7)',
textDecoration: 'none',
size: 160,
flexDirection: 'column',
textAlign: 'center',
justifyContent: 'center',
alignItems: 'center',
position: 'absolute',
top: -80,
right: '14vw',
fontSize: '24px',
lineHeight: 1.2,
fontWeight: 'bold',
fontFamily: `'${stickerButtonFont}', cursive`,
transform: 'rotate(-25deg)',
borderRadius: '50%',
// Terrible buttons styles, doesn't even look good, but didn't want to waste more time:
backgroundImage: 'radial-gradient(75.96% 56.13% at 50.00% 50.00%, #FF6464 0%, #EF2222 32.29%, #B00 100%)',
boxShadow: '0px -14px 14px 0px #670000 inset, 14px 0px 14px 0px rgba(255, 255, 255, 0.25) inset, 0px 14px 14px 0px rgba(255, 255, 255, 0.25) inset, -14px 0px 14px 0px #670000 inset',
backgroundImage:
'radial-gradient(75.96% 56.13% at 50.00% 50.00%, #FF6464 0%, #EF2222 32.29%, #B00 100%)',
boxShadow:
'0px -14px 14px 0px #670000 inset, 14px 0px 14px 0px rgba(255, 255, 255, 0.25) inset, 0px 14px 14px 0px rgba(255, 255, 255, 0.25) inset, -14px 0px 14px 0px #670000 inset',
filter: 'drop-shadow(3px 3px 8px rgba(0, 0, 0, 0.50))',
textShadow: '0px 0px 2px rgba(255, 255, 255, 0.45)',
WebkitTapHighlightColor: 'transparent',
'transition': 'box-shadow 80ms linear, filter 80ms linear, font-size 80ms linear',
transition:
'box-shadow 80ms linear, filter 80ms linear, font-size 80ms linear',
':active': {
backgroundImage: 'radial-gradient(75.96% 56.13% at 50.00% 50.00%, #FF4747 0%, #E52121 32.29%, #B00 100%, #A30101 100%)',
boxShadow: '0px -14px 14px 0px #440303 inset, 14px 0px 14px 0px #860000 inset, 0px 14px 14px 0px #860000 inset, -14px 0px 14px 0px #440303 inset',
backgroundImage:
'radial-gradient(75.96% 56.13% at 50.00% 50.00%, #FF4747 0%, #E52121 32.29%, #B00 100%, #A30101 100%)',
boxShadow:
'0px -14px 14px 0px #440303 inset, 14px 0px 14px 0px #860000 inset, 0px 14px 14px 0px #860000 inset, -14px 0px 14px 0px #440303 inset',
filter: 'drop-shadow(0px 0px 8px rgba(0, 0, 0, 0.50))',
fontSize: '22px'
}
}}
>
{stickerButtonText.split(' ').map((line, i) => <div key={i}>{line}</div>)}
</Flex>
}}
>
{stickerButtonText.split(' ').map((line, i) => (
<div key={i}>{line}</div>
))}
</Flex>
</Box>
<Footer dark />

5
pages/opensource.js
View file

@ -152,10 +152,7 @@ const Page = ({ repos, transparentAccounts }) => (
Content
</Heading>
<Grid columns={3} gap={3} mt={2} mb={[4]}>
<BankProject
name="Jams"
url={`https://github.com/hackclub/jams`}
/>
<BankProject name="Jams" url={`https://github.com/hackclub/jams`} />
<BankProject
name="Workshops"
url={`https://github.com/hackclub/hackclub/tree/main/workshops`}

12
pages/team.js
View file

@ -333,12 +333,12 @@ export default function Team() {
pronouns="she/her"
/>
<Bio
name="Ben Dixon"
teamRole="Engineering"
text={`Coming all the way from drizzly England, Ben reconnected with his adoration for teaching people about programming through the computer graphics demoscene during lockdown; firmly believing “GLSL is basically pseudocode”. At Hack Club, Ben designs and implements snazzy new features at HCB, along with raiding their granola bars.`}
img="https://ca.slack-edge.com/T0266FRGM-U03DFNYGPCN-d76abb1ba329-512"
pronouns="he/him"
/>
name="Ben Dixon"
teamRole="Engineering"
text={`Coming all the way from drizzly England, Ben reconnected with his adoration for teaching people about programming through the computer graphics demoscene during lockdown; firmly believing “GLSL is basically pseudocode”. At Hack Club, Ben designs and implements snazzy new features at HCB, along with raiding their granola bars.`}
img="https://ca.slack-edge.com/T0266FRGM-U03DFNYGPCN-d76abb1ba329-512"
pronouns="he/him"
/>
</Grid>
</Box>