mirror of
https://github.com/System-End/site.git
synced 2026-04-19 23:22:49 +00:00
potential format?
This commit is contained in:
parent
6f2b36b221
commit
b70f06dc32
18 changed files with 667 additions and 161 deletions
|
|
@ -57,18 +57,18 @@ export default function Bank({ data }) {
|
|||
Run your event/organziation on Hack Club Bank
|
||||
</Buttons>
|
||||
</Flex>
|
||||
<Button variant="lg" as="a" href="/bank" mt={3}>
|
||||
<Button variant="primary" as="a" href="/bank" mt={3}>
|
||||
Start bankin!
|
||||
</Button>
|
||||
</Box>
|
||||
</Grid>
|
||||
</CardModel>
|
||||
<Box sx={{ position: 'absolute', right: '-200px', top: 5 }}>
|
||||
<Box sx={{ position: 'absolute', right: '-100px', top: 5 }}>
|
||||
{' '}
|
||||
<Box
|
||||
sx={{
|
||||
width: ['300px', '600px'],
|
||||
height: ['200px','400px'],
|
||||
width: ['250px', '500px'],
|
||||
height: ['180px','360px'],
|
||||
position: 'relative',
|
||||
display: 'block',
|
||||
textAlign: 'center',
|
||||
|
|
|
|||
|
|
@ -29,7 +29,7 @@ export default function Buttons({ children, icon, id, content, link }) {
|
|||
// }
|
||||
// }}
|
||||
>
|
||||
<Button
|
||||
<Box
|
||||
// ref={ref => (fooRef = ref)}
|
||||
data-place="right"
|
||||
data-for={id}
|
||||
|
|
@ -43,27 +43,27 @@ export default function Buttons({ children, icon, id, content, link }) {
|
|||
display: 'flex',
|
||||
alignItems: 'start',
|
||||
color: 'inherit',
|
||||
pr: 3,
|
||||
px: 3,
|
||||
py: 1,
|
||||
width: 'fit-content',
|
||||
textTransform: 'none',
|
||||
fontWeight: '400',
|
||||
fontSize: [1, 2],
|
||||
fontSize: [1, '14px', '16px'],
|
||||
backdropFilter: 'blur(2px)'
|
||||
}}
|
||||
as="a"
|
||||
href={link || '/'}
|
||||
target="_blank"
|
||||
rel="noreferrer"
|
||||
// as="a"
|
||||
// href={link || '/'}
|
||||
// target="_blank"
|
||||
// rel="noreferrer"
|
||||
>
|
||||
<Icon
|
||||
glyph={icon || 'plus-fill'}
|
||||
sx={{ color: 'inherit', marginRight: 2 }}
|
||||
size={32}
|
||||
size={24}
|
||||
mr={2}
|
||||
/>
|
||||
<Text sx={{ fontFamily: 'Phantom Sans' }}>{children}</Text>
|
||||
</Button>
|
||||
</Box>
|
||||
<ReactTooltip
|
||||
id={id}
|
||||
delayShow={150}
|
||||
|
|
|
|||
|
|
@ -38,7 +38,10 @@ const CardModel = ({
|
|||
backgroundSize: 'cover',
|
||||
backgroundImage: `url(${background})` || '',
|
||||
backgroundPosition: 'center bottom',
|
||||
backgroundRepeat: 'no-repeat'
|
||||
backgroundRepeat: 'no-repeat',
|
||||
p: {
|
||||
fontSize: [1, '16px', '20px']
|
||||
}
|
||||
}}
|
||||
{...props}
|
||||
>
|
||||
|
|
|
|||
|
|
@ -28,7 +28,9 @@ export default function Clubs() {
|
|||
sx={{
|
||||
backgroundColor: 'elevated',
|
||||
background:
|
||||
'linear-gradient(rgba(255, 140, 55, 0.9) 0%, rgba(236, 55, 80, 0.9) 100%)'
|
||||
'linear-gradient(to bottom,rgba(0, 0, 0, 0.3),rgba(0, 0, 0, 0.4) 25%,rgba(0, 0, 0, 0.5) 50%, rgba(0, 0, 0, 0.6) 100%), url("https://cloud-flzg18ipb-hack-club-bot.vercel.app/0screenshot_2022-12-05_at_9.44.11_pm.png")',
|
||||
backgroundPositon: 'center center',
|
||||
backgroundSize: '100% auto',
|
||||
}}
|
||||
>
|
||||
<Text
|
||||
|
|
@ -38,7 +40,7 @@ export default function Clubs() {
|
|||
px: 2,
|
||||
mx: [-2, 0],
|
||||
whiteSpace: 'nowrap',
|
||||
color: 'orange',
|
||||
color: 'red',
|
||||
bg: 'white',
|
||||
textShadow: 'none'
|
||||
}}
|
||||
|
|
@ -60,7 +62,7 @@ export default function Clubs() {
|
|||
<Buttons content="scan our clubs map and reach out to team@hackclub.com to be connected" id="1" icon="rep" link="/map">Join a Hack Club near you</Buttons>
|
||||
<Buttons content="we'll support you with meeting content, stickers, and more" id="2" icon="welcome" link="/clubs">Start a club</Buttons>
|
||||
</Flex>
|
||||
<Button variant="lg" sx={{mt: 3, backgroundColor: 'orange'}}>Learn more</Button>
|
||||
<Button variant="primary" sx={{mt: 3, backgroundColor: 'red'}}>Learn more</Button>
|
||||
</Box>
|
||||
</Grid>
|
||||
</CardModel>
|
||||
|
|
|
|||
|
|
@ -197,7 +197,7 @@ export default function Epoch() {
|
|||
</Buttons>
|
||||
</Flex>
|
||||
<Button
|
||||
variant="lg"
|
||||
variant="primary"
|
||||
as="a"
|
||||
href="https://epoch.hackclub.com/"
|
||||
sx={{ background: '#FF4794', color: 'white', mt: 3 }}
|
||||
|
|
|
|||
58
components/cards/events.js
Normal file
58
components/cards/events.js
Normal file
|
|
@ -0,0 +1,58 @@
|
|||
import CardModel from './card-model'
|
||||
import {
|
||||
Box,
|
||||
Button,
|
||||
Card,
|
||||
Container,
|
||||
Flex,
|
||||
Grid,
|
||||
Heading,
|
||||
Image,
|
||||
Badge,
|
||||
Link,
|
||||
Text
|
||||
} from 'theme-ui'
|
||||
import Buttons from './button'
|
||||
import Event from '../events'
|
||||
/** @jsxImportSource theme-ui */
|
||||
|
||||
export default function Events({ data, stars, events }) {
|
||||
return (
|
||||
<CardModel
|
||||
color="white"
|
||||
sx={{
|
||||
backgroundColor: 'elevated',
|
||||
background:
|
||||
'linear-gradient(to bottom,rgba(0, 0, 0, 0.4),rgba(0, 0, 0, 0.6) 25%,rgba(0, 0, 0, 0.7) 50%, rgba(0, 0, 0, 0.8) 100%), url("https://hackclub.com/_next/image/?url=https://cdn.glitch.com/a7605379-7582-4aac-8f44-45bbdfca0cfa%252F2020-05-16_screenshot.jpeg?v%3D1589633885855&w=2048&q=75")',
|
||||
backgroundPositon: 'center center',
|
||||
backgroundSize: '100% auto',
|
||||
}}
|
||||
>
|
||||
<Text variant="title">Events</Text>
|
||||
<Grid columns={[1, '0.6fr 1fr']}>
|
||||
<Box>
|
||||
<Text as="p" variant="subtitle">
|
||||
Hack Clubbers run events on Zoom that don’t suck. From live coding nights. Sometimes, we also invite someone we really want to speak to (like Sal Khan, George Hotz, and Lady Ada) and host an <Link href='/amas'>AMA</Link> with them.{' '}
|
||||
</Text>
|
||||
{/* <Text as="p" sx={{ fontSize: [2, 3], fontWeight: 'bold', mt: 2 }}>
|
||||
Get involved
|
||||
</Text>
|
||||
<Flex sx={{ flexDirection: 'column' }}>
|
||||
<Buttons id="31" icon="event-code" content="keep your eye out on our events page">
|
||||
Join an event
|
||||
</Buttons>
|
||||
<Buttons content="learn more about available resources" id="32" icon="bolt" link="/hackathons">
|
||||
Plan and host an event
|
||||
</Buttons>
|
||||
</Flex> */}
|
||||
<Button variant="primary" mt={3}>
|
||||
Find an event
|
||||
</Button>
|
||||
</Box>
|
||||
<Box>
|
||||
<Event events={events} />
|
||||
</Box>
|
||||
</Grid>
|
||||
</CardModel>
|
||||
)
|
||||
}
|
||||
|
|
@ -51,33 +51,13 @@ export default function Hackathons({ data, stars }) {
|
|||
Organize a hackthon in your community
|
||||
</Buttons>
|
||||
</Flex>
|
||||
<Button variant="lg" mt={3}>
|
||||
<Button variant="primary" mt={3}>
|
||||
Learn more
|
||||
</Button>
|
||||
</Box>
|
||||
<Box
|
||||
sx={{
|
||||
transform: 'translateY(25%)'
|
||||
// '&:before': {
|
||||
// background: 'linear-gradient(to right, rgba(0,0,0,0.5) 0%,rgba(0,0,0,0) 100%)',
|
||||
// content: '""',
|
||||
// height: '231.992px',
|
||||
// position: 'absolute',
|
||||
// width: '150px',
|
||||
// zIndex: 2,
|
||||
// left: 0,
|
||||
// top: 0
|
||||
// }, '&:after': {
|
||||
// background: 'linear-gradient(to right, rgba(0,0,0,0.5) 0%, rgba(0,0,0,0) 100%)',
|
||||
// content: '""',
|
||||
// height: '231.992px',
|
||||
// position: 'absolute',
|
||||
// width: '150px',
|
||||
// zIndex: 2,
|
||||
// right: 0,
|
||||
// top: 0,
|
||||
// transform: 'rotateZ(180deg)'
|
||||
// },
|
||||
}}
|
||||
>
|
||||
<ScrollingHackathons eventData={data} mode="await" />
|
||||
|
|
|
|||
141
components/cards/mailing-list.js
Normal file
141
components/cards/mailing-list.js
Normal file
|
|
@ -0,0 +1,141 @@
|
|||
import Icon from '@hackclub/icons'
|
||||
import { useRef, useState } from 'react'
|
||||
import {
|
||||
Box,
|
||||
Label,
|
||||
Input,
|
||||
Button,
|
||||
Text,
|
||||
Alert,
|
||||
Card,
|
||||
Heading,
|
||||
Grid
|
||||
} from 'theme-ui'
|
||||
import CardModel from './card-model'
|
||||
|
||||
const Loading = () => (
|
||||
<Box
|
||||
sx={{
|
||||
display: 'flex',
|
||||
justifyContent: 'center',
|
||||
alignItems: 'center',
|
||||
height: '100%',
|
||||
width: '100%',
|
||||
border: '2px solid #f3f3f3',
|
||||
borderTop: '2px solid #ec3750',
|
||||
borderRadius: '50%',
|
||||
width: '10px',
|
||||
height: '10px',
|
||||
animation: 'spin 2s linear infinite',
|
||||
'@keyframes spin': {
|
||||
'0%': { transform: 'rotate(0deg)' },
|
||||
'100%': { transform: 'rotate(360deg)' }
|
||||
}
|
||||
}}
|
||||
></Box>
|
||||
)
|
||||
|
||||
const MailingList = () => {
|
||||
const [submitting, setSubmitting] = useState(false)
|
||||
const [submitted, setSubmitted] = useState(false)
|
||||
const formRef = useRef(null)
|
||||
|
||||
// const handleSubmit = async e => {
|
||||
// e.preventDefault()
|
||||
// setSubmitting(true)
|
||||
|
||||
// await fetch('/api/winter-rsvp', {
|
||||
// method: 'POST',
|
||||
// headers: {
|
||||
// 'Content-Type': 'application/json'
|
||||
// },
|
||||
// body: JSON.stringify({
|
||||
// Name: e.target.name.value,
|
||||
// Email: e.target.email.value
|
||||
// })
|
||||
// })
|
||||
|
||||
// formRef.current.reset()
|
||||
// setSubmitting(false)
|
||||
|
||||
// setSubmitted(true)
|
||||
// }
|
||||
|
||||
return (
|
||||
<CardModel sx={{my: '0 !important', height: '100%'}}>
|
||||
{/* <Card
|
||||
sx={{
|
||||
maxWidth: 'narrowPlus',
|
||||
mx: 'auto',
|
||||
mt: [3, 4],
|
||||
background: 'rgb(255,255,255, 0.45)',
|
||||
backdropFilter: 'blur(8px)'
|
||||
}}
|
||||
> */}
|
||||
<Text variant="title" sx={{ fontSize: [3, 4, 5], zIndex: 2 }}>
|
||||
Hacker Newsletter
|
||||
</Text>
|
||||
<Text sx={{ color: 'muted' }} as="p">
|
||||
We'll send you an email whenever we launch a new project, so you can get
|
||||
involved if you're interested. We never spam or sell your data.
|
||||
</Text>
|
||||
<Grid
|
||||
as="form"
|
||||
ref={formRef}
|
||||
// onSubmit={handleSubmit}
|
||||
gap={[2, 3]}
|
||||
sx={{
|
||||
mt: [null, 3],
|
||||
gridTemplateColumns: [null, '1fr 1fr auto'],
|
||||
textAlign: 'left',
|
||||
alignItems: 'end',
|
||||
input: { bg: 'sunken' }
|
||||
}}
|
||||
>
|
||||
<div>
|
||||
<Label htmlFor="location">Name</Label>
|
||||
<Input
|
||||
autofillBackgroundColor="highlight"
|
||||
type="text"
|
||||
name="name"
|
||||
id="name"
|
||||
placeholder="Fiona Hackworth"
|
||||
required
|
||||
/>
|
||||
</div>
|
||||
<div>
|
||||
<Label htmlFor="email">Email</Label>
|
||||
<Input
|
||||
autofillBackgroundColor="highlight"
|
||||
type="email"
|
||||
name="email"
|
||||
id="email"
|
||||
placeholder="fiona@hackclub.com"
|
||||
required
|
||||
/>
|
||||
</div>
|
||||
|
||||
<Button type="submit" sx={{ mt: [2, 0] }}>
|
||||
{submitting ? (
|
||||
<>
|
||||
<Loading />
|
||||
Subscribe
|
||||
</>
|
||||
) : (
|
||||
'Subscribe'
|
||||
)}
|
||||
</Button>
|
||||
</Grid>
|
||||
|
||||
{submitted && (
|
||||
<Alert variant="primary" sx={{ bg: 'green', mt: [2, 3] }}>
|
||||
<Icon glyph="send" />
|
||||
<Text sx={{ ml: 2 }}>Signed up!</Text>
|
||||
</Alert>
|
||||
)}
|
||||
{/* </Card> */}
|
||||
</CardModel>
|
||||
)
|
||||
}
|
||||
|
||||
export default MailingList
|
||||
|
|
@ -52,7 +52,7 @@ export default function Sinerider({stars}) {
|
|||
<Buttons content="DM @cwalker in Slack to learn more" id="5" icon="view" href="/slack">Be a scene maker</Buttons>
|
||||
</Flex>
|
||||
<Button
|
||||
variant="lg"
|
||||
variant="primary"
|
||||
sx={{
|
||||
backgroundColor: '#CAB4D4',
|
||||
color: '#271932',
|
||||
|
|
|
|||
231
components/cards/slack.js
Normal file
231
components/cards/slack.js
Normal file
|
|
@ -0,0 +1,231 @@
|
|||
import CardModel from './card-model'
|
||||
import {
|
||||
Box,
|
||||
Button,
|
||||
Card,
|
||||
Container,
|
||||
Flex,
|
||||
Grid,
|
||||
Heading,
|
||||
Image,
|
||||
Badge,
|
||||
Link,
|
||||
Text
|
||||
} from 'theme-ui'
|
||||
import Buttons from './button'
|
||||
import usePrefersMotion from '../../lib/use-prefers-motion'
|
||||
import useHasMounted from '../../lib/use-has-mounted'
|
||||
import { keyframes } from '@emotion/react'
|
||||
import SlackEvents from '../slack/slack-events'
|
||||
|
||||
/** @jsxImportSource theme-ui */
|
||||
|
||||
// const Cover = () => (
|
||||
// <Box
|
||||
// sx={{
|
||||
// position: 'absolute',
|
||||
// bottom: 0,
|
||||
// top: 0,
|
||||
// left: 0,
|
||||
// right: 0,
|
||||
// backgroundImage: t => t.util.gx('cyan', 'purple'),
|
||||
// opacity: 0.825,
|
||||
// zIndex: 1
|
||||
// }}
|
||||
// />
|
||||
// )
|
||||
|
||||
// const Static = ({
|
||||
// img = 'https://cloud-nykwtt0z7.vercel.app/2020-07-25_a1tcva4ch6mmr6j2cfmcb4e9ync3yhar.png'
|
||||
// // img="https://cloud-re5hkabx0.vercel.app/2020-07-25_hn13qhejqrzu4n1jy9yacxxgrgp3wf5u.png"
|
||||
// }) => (
|
||||
// <Box
|
||||
// as="section"
|
||||
// id="slack"
|
||||
// sx={{
|
||||
// position: 'relative',
|
||||
// overflow: 'hidden',
|
||||
// backgroundImage: `url(https://cloud-nykwtt0z7.vercel.app/2020-07-25_a1tcva4ch6mmr6j2cfmcb4e9ync3yhar.png)`,
|
||||
// backgroundSize: 'cover'
|
||||
// }}
|
||||
// >
|
||||
// <Cover />
|
||||
// <Content />
|
||||
// </Box>
|
||||
// )
|
||||
|
||||
const rollin = keyframes`
|
||||
0% {
|
||||
transform: translateY(100%);
|
||||
},
|
||||
30% {
|
||||
transform: translateY(100%);
|
||||
},
|
||||
100% {
|
||||
transform: translateY(0);
|
||||
}
|
||||
`
|
||||
|
||||
const rollout = keyframes`
|
||||
0% {
|
||||
transform: translateY(0);
|
||||
},
|
||||
60% {
|
||||
transform: translateY(-100%);
|
||||
},
|
||||
100% {
|
||||
transform: translateY(-100%);
|
||||
}
|
||||
`
|
||||
|
||||
const Cover = () => (
|
||||
<Box
|
||||
sx={{
|
||||
position: 'absolute',
|
||||
bottom: 0,
|
||||
top: 0,
|
||||
left: 0,
|
||||
right: 0,
|
||||
backgroundImage: t => t.util.gx('cyan', 'purple'),
|
||||
opacity: 0.9,
|
||||
zIndex: 1
|
||||
}}
|
||||
/>
|
||||
)
|
||||
|
||||
export default function Slack({ slackNum, slackKey }) {
|
||||
const hasMounted = useHasMounted()
|
||||
const prefersMotion = usePrefersMotion()
|
||||
|
||||
return (
|
||||
<CardModel
|
||||
color="white"
|
||||
sx={{
|
||||
position: 'relative',
|
||||
overflow: 'hidden',
|
||||
my: '0 !important'
|
||||
// backgroundImage: `url(https://cloud-nykwtt0z7.vercel.app/2020-07-25_a1tcva4ch6mmr6j2cfmcb4e9ync3yhar.png)`,
|
||||
// backgroundSize: 'cover'
|
||||
}}
|
||||
>
|
||||
<Box
|
||||
as="video"
|
||||
autoPlay
|
||||
muted
|
||||
loop
|
||||
playsInline
|
||||
poster="https://cloud-nykwtt0z7.vercel.app/2020-07-25_a1tcva4ch6mmr6j2cfmcb4e9ync3yhar.png"
|
||||
duration={2000}
|
||||
sx={{
|
||||
position: 'absolute',
|
||||
bottom: 0,
|
||||
top: 0,
|
||||
left: 0,
|
||||
right: 0,
|
||||
height: '100%',
|
||||
zIndex: 0,
|
||||
width: '100vw',
|
||||
objectFit: 'cover'
|
||||
}}
|
||||
>
|
||||
<source
|
||||
src="https://cdn.glitch.com/2d637c98-ed35-417a-bf89-cecc165d7398%2Foutput-no-duplicate-frames.hecv.mp4?v=1590780967658"
|
||||
type="video/mp4; codecs=hevc"
|
||||
/>
|
||||
<source
|
||||
src="https://cdn.glitch.com/2d637c98-ed35-417a-bf89-cecc165d7398%2Foutput-no-duplicate-frames.webm?v=1590781698834"
|
||||
type="video/webm; codecs=vp9,opus"
|
||||
/>
|
||||
<source
|
||||
src="https://cdn.glitch.com/2d637c98-ed35-417a-bf89-cecc165d7398%2Foutput-no-duplicate-frames.mov?v=1590781491717"
|
||||
type="video/quicktime"
|
||||
/>
|
||||
</Box>
|
||||
<Cover />
|
||||
<Grid sx={{ zIndex: 2 }}>
|
||||
<Text variant="title" sx={{ fontSize: [3, 4, 5], zIndex: 2 }}>
|
||||
Our online community
|
||||
</Text>
|
||||
</Grid>
|
||||
<Grid columns={[1, 1]} sx={{ zIndex: 2 }}>
|
||||
<Box sx={{ zIndex: 2 }}>
|
||||
<Text
|
||||
variant="subtitle"
|
||||
as="p"
|
||||
sx={{ fontSize: [1, '16px', '20px'] }}
|
||||
>
|
||||
Coding doesn't have to be a solidary activity. At Hack Club, it's a team sport and in our
|
||||
Slack (Discord-style online groupchat), you'll find a
|
||||
group of{' '}
|
||||
<Box
|
||||
as="div"
|
||||
sx={{
|
||||
color: 'transparent',
|
||||
position: 'relative',
|
||||
overflow: 'hidden',
|
||||
display: 'inline-block',
|
||||
mb: '-8px',
|
||||
mr: '2px'
|
||||
}}
|
||||
key={slackKey}
|
||||
>
|
||||
{/* {slackNum[0]}{' '} */}
|
||||
<Text
|
||||
sx={{
|
||||
position: 'absolute',
|
||||
top: 0,
|
||||
left: 0,
|
||||
color: 'text',
|
||||
animation: `${rollout} 2s`,
|
||||
animationFillMode: 'forwards'
|
||||
}}
|
||||
>
|
||||
{/* {slackNum[0]} */}
|
||||
</Text>
|
||||
<Text
|
||||
sx={{
|
||||
position: 'absolute',
|
||||
top: 0,
|
||||
left: 0,
|
||||
color: 'white',
|
||||
animation: `${rollin} 2s`,
|
||||
animationFillMode: 'forwards'
|
||||
}}
|
||||
>
|
||||
{/* {slackNum[1]} */}
|
||||
</Text>
|
||||
</Box>
|
||||
fabulous people to talk to, active at all hours.
|
||||
</Text>
|
||||
<Button
|
||||
variant="primary"
|
||||
sx={{
|
||||
backgroundColor: 'white',
|
||||
color: 'purple',
|
||||
mt: 3
|
||||
}}
|
||||
as="a"
|
||||
href="/slack"
|
||||
>
|
||||
Join our community
|
||||
</Button>
|
||||
</Box>
|
||||
{/* <Box sx={{py: 3, px: 4, borderRadius: 4, float: 'right', backgroundColor: 'rgb(255,255,255, 0.2)', backdropFilter: 'blur(8px)', mt: '-40px'}}>
|
||||
<Heading
|
||||
as="h2"
|
||||
variant="subheadline"
|
||||
sx={{
|
||||
mt: 0,
|
||||
color: 'white',
|
||||
textTransform: 'uppercase',
|
||||
letterSpacing: 'headline'
|
||||
}}
|
||||
>
|
||||
Live from our Slack
|
||||
</Heading>
|
||||
<SlackEvents color="transparent" textColor="white" />
|
||||
</Box> */}
|
||||
</Grid>
|
||||
</CardModel>
|
||||
)
|
||||
}
|
||||
|
|
@ -72,7 +72,7 @@ export default function SprigConsole({ stars }) {
|
|||
</Buttons>
|
||||
</Flex>
|
||||
<Button
|
||||
variant="lg"
|
||||
variant="primary"
|
||||
sx={{
|
||||
backgroundColor: '#427A43',
|
||||
color: '#fff',
|
||||
|
|
|
|||
|
|
@ -216,7 +216,7 @@ export default function Sprig({
|
|||
</Buttons>
|
||||
</Flex>
|
||||
<Button
|
||||
variant="lg"
|
||||
variant="primary"
|
||||
sx={{
|
||||
backgroundColor: '#FFDE4D',
|
||||
color: '#000',
|
||||
|
|
@ -227,8 +227,8 @@ export default function Sprig({
|
|||
</Button>
|
||||
</Box>
|
||||
<Box>
|
||||
<Text as="p" sx={{fontStyle: 'italic'}}>New from <Link href="https://sprig.hackclub.com/gallery" sx={{textDecoration: 'none', color: 'inherit'}}>the gallery</Link>...</Text>
|
||||
<Flex sx={{height: '80%', gap: '20px', mt: 3}}>
|
||||
<Text sx={{fontStyle: 'italic', fontSize: [1, '14px', '16px']}}>New from <Link href="https://sprig.hackclub.com/gallery" sx={{textDecoration: 'none', color: 'inherit'}}>the gallery</Link>...</Text>
|
||||
<Flex sx={{height: '80%', gap: '20px', mt: 3, width: '90%'}}>
|
||||
<Game game={game[0]} gameImage={gameImage} />
|
||||
<Game game={game[1]} gameImage1={gameImage1} />
|
||||
</Flex>
|
||||
|
|
|
|||
|
|
@ -77,7 +77,7 @@ export default function Workshops({ data, stars }) {
|
|||
</Buttons>
|
||||
</Flex>
|
||||
<Button
|
||||
variant="lg"
|
||||
variant="primary"
|
||||
sx={{
|
||||
background: 'white',
|
||||
color: 'blue',
|
||||
|
|
|
|||
|
|
@ -44,10 +44,10 @@ export default function CarouselCards({
|
|||
backgroundColor: background,
|
||||
position: 'relative',
|
||||
color: 'white',
|
||||
width: '350px',
|
||||
width: '300px',
|
||||
}}
|
||||
>
|
||||
<Text as="h2" sx={{ color: titleColor }}>
|
||||
<Text as="h2" sx={{ color: titleColor, fontSize: ['12px', '16px', '18px'], }}>
|
||||
{title}
|
||||
</Text>
|
||||
<Text as="p" sx={{ color: descriptionColor }}>
|
||||
|
|
|
|||
|
|
@ -51,7 +51,6 @@ export default function Carousel() {
|
|||
// >
|
||||
<PageVisibility onChange={handleVisibilityChange}>
|
||||
{pageIsVisible && (
|
||||
<Fade>
|
||||
<Ticker speed={speed} sx={{ overflowX: 'hidden' }}>
|
||||
{() => (
|
||||
<Box
|
||||
|
|
@ -126,7 +125,6 @@ export default function Carousel() {
|
|||
</Box>
|
||||
)}
|
||||
</Ticker>
|
||||
</Fade>
|
||||
)}
|
||||
</PageVisibility>
|
||||
// </Box>
|
||||
|
|
|
|||
|
|
@ -2,6 +2,7 @@ import { Card, Box, Text, Grid, Flex, Avatar, Heading } from 'theme-ui'
|
|||
import tt from 'tinytime'
|
||||
import Link from 'next/link'
|
||||
import Sparkles from './sparkles'
|
||||
import { keyframes } from '@emotion/react'
|
||||
|
||||
const past = dt => new Date(dt) < new Date()
|
||||
const now = (start, end) =>
|
||||
|
|
@ -61,7 +62,7 @@ const Event = ({ id, slug, title, desc, leader, avatar, start, end, cal }) => (
|
|||
)}
|
||||
<Text as="span">{leader}</Text>
|
||||
</Flex>
|
||||
{now(start, end) && (
|
||||
{/* {now(start, end) && (
|
||||
<Sparkles
|
||||
aria-hidden
|
||||
style={{
|
||||
|
|
@ -73,39 +74,70 @@ const Event = ({ id, slug, title, desc, leader, avatar, start, end, cal }) => (
|
|||
bottom: 0
|
||||
}}
|
||||
/>
|
||||
)}
|
||||
)} */}
|
||||
</Box>
|
||||
</Link>
|
||||
)
|
||||
|
||||
const flashing = keyframes({
|
||||
from: { opacity: 0 },
|
||||
'50%': { opacity: 1 },
|
||||
to: { opacity: 0 }
|
||||
})
|
||||
|
||||
function Dot() {
|
||||
return (
|
||||
<Text
|
||||
sx={{
|
||||
bg: 'green',
|
||||
color: 'white',
|
||||
borderRadius: 'circle',
|
||||
display: 'inline-block',
|
||||
lineHeight: 0,
|
||||
width: '.5em',
|
||||
height: '.5em',
|
||||
marginRight: '.4em',
|
||||
marginBottom: '.12em',
|
||||
animationName: `${flashing}`,
|
||||
animationDuration: '3s',
|
||||
animationTimingFunction: 'ease-in-out',
|
||||
animationIterationCount: 'infinite'
|
||||
}}
|
||||
/>
|
||||
)
|
||||
}
|
||||
|
||||
export default function Events({ events }) {
|
||||
return (
|
||||
<Box mb={3}>
|
||||
<Heading>
|
||||
{/* <Heading>
|
||||
Come hangout, talk to cool people*, and hack together at one of our {' '}
|
||||
<Link href="https://events.hackclub.com" target="_blank">
|
||||
upcoming events
|
||||
</Link>
|
||||
</Heading>
|
||||
</Heading> */}
|
||||
<Text>
|
||||
Events happening this month <Dot />
|
||||
</Text>
|
||||
<Grid
|
||||
mt={3}
|
||||
mb={2}
|
||||
columns={[2, 3, 4]}
|
||||
columns={[2, 3]}
|
||||
gap="1px"
|
||||
sx={{
|
||||
bg: 'sunken',
|
||||
borderRadius: 'extra',
|
||||
overflow: 'hidden',
|
||||
boxShadow: 'elevated',
|
||||
boxShadow: 'elevated'
|
||||
}}
|
||||
>
|
||||
{events.map(event => (
|
||||
<Event {...event} key={event.id} />
|
||||
))}
|
||||
</Grid>
|
||||
<Link href="/amas" target="_blank">
|
||||
{/* <Link href="/amas" target="_blank">
|
||||
*like George Hotz, Dylan Field, Sal Khan, and more
|
||||
</Link>
|
||||
</Link> */}
|
||||
</Box>
|
||||
)
|
||||
}
|
||||
|
|
|
|||
|
|
@ -43,7 +43,7 @@ const generateEvent = () => ({
|
|||
|
||||
|
||||
|
||||
const SlackEvents = ({ sx, ...props }) => {
|
||||
const SlackEvents = ({ sx, color, textColor, ...props }) => {
|
||||
const didUnmount = useRef(false)
|
||||
const [events, setEvents] = useState([])
|
||||
function createMockEvents(){
|
||||
|
|
@ -104,7 +104,7 @@ const SlackEvents = ({ sx, ...props }) => {
|
|||
listStyle: 'none',
|
||||
lineHeight: 'heading',
|
||||
pl: 0,
|
||||
color: 'black',
|
||||
color: textColor || 'black',
|
||||
fontSize: 2,
|
||||
overflowY: 'hidden',
|
||||
position: 'relative',
|
||||
|
|
@ -117,7 +117,7 @@ const SlackEvents = ({ sx, ...props }) => {
|
|||
display: 'block',
|
||||
height: '2em',
|
||||
backgroundImage: theme =>
|
||||
`linear-gradient(rgba(255,255,255,0), ${theme.colors.white})`
|
||||
`linear-gradient(rgba(255,255,255,0), ${color || theme.colors.white})`
|
||||
},
|
||||
div: { mb: [1, 2] },
|
||||
'circle:last-of-type': { animationDuration: '1s' },
|
||||
|
|
@ -152,3 +152,15 @@ const SlackEvents = ({ sx, ...props }) => {
|
|||
}
|
||||
|
||||
export default SlackEvents
|
||||
|
||||
|
||||
// `
|
||||
// 10-days-in-public amas assemble all-hands apple art bank books ib
|
||||
// challenges code college-apps confessions cooking community coronavirus counttoamillion deals
|
||||
// debate design the-democratic-republic-of-yishun dogs ethical-hacking epoch epoch-bts flutter film food
|
||||
// gamedev gh go go-bears hack-night hackathons hardware
|
||||
// homelab hours hq india javascript languages late-night-hw-club leaders lgbtq linux lounge
|
||||
// mayhaps memes minecraft music neuroscience photography python orpheus-podcast
|
||||
// rust scrapbook ship sink-my-ship sleep social studycorner support swift swim
|
||||
// politics newsletter surroundings sprig hackathon-organizers hq hq-surroundings
|
||||
// `
|
||||
251
pages/index.js
251
pages/index.js
|
|
@ -42,28 +42,10 @@ import { get } from 'lodash'
|
|||
import useSWR from 'swr'
|
||||
import Konami from 'react-konami-code'
|
||||
import Secret from '../components/secret'
|
||||
import Events from '../components/events'
|
||||
import MailingList from '../components/cards/mailing-list'
|
||||
import Slack from '../components/cards/slack'
|
||||
import Events from '../components/cards/events'
|
||||
|
||||
let Highlight = styled(Text)`
|
||||
color: inherit;
|
||||
border-radius: 1em 0 1em 0;
|
||||
background: linear-gradient(
|
||||
-100deg,
|
||||
rgba(250, 247, 133, 0.33),
|
||||
rgba(250, 247, 133, 0.66) 95%,
|
||||
rgba(250, 247, 133, 0.1)
|
||||
);
|
||||
`
|
||||
Highlight = Highlight.withComponent('mark')
|
||||
|
||||
const rollout = keyframes`
|
||||
0% {
|
||||
transform: translateY(-100px);
|
||||
}
|
||||
100% {
|
||||
transform: translateY(0);
|
||||
}
|
||||
`
|
||||
// function SlackNum({slackData}) {
|
||||
// let [key, setKey] = useState()
|
||||
// useEffect(() => {
|
||||
|
|
@ -84,7 +66,7 @@ const rollout = keyframes`
|
|||
function Page({
|
||||
hackathonsData,
|
||||
bankData,
|
||||
slackData,
|
||||
// slackData,
|
||||
stars,
|
||||
githubData2,
|
||||
dataPieces,
|
||||
|
|
@ -96,11 +78,25 @@ function Page({
|
|||
let [gameImage1, setGameImage1] = useState('')
|
||||
let [reveal, setReveal] = useState(false)
|
||||
const [hover, setHover] = useState(true)
|
||||
let [slackNum, setSlackNum] = useState([])
|
||||
|
||||
let [key, setKey] = useState(0)
|
||||
let [key1, setKey1] = useState(0)
|
||||
let [slackKey, setSlackKey] = useState(0)
|
||||
|
||||
const withCommas = x => x.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ',')
|
||||
// console.log(slackData)
|
||||
// useEffect(() => {
|
||||
// let array = slackNum
|
||||
// let newNum = withCommas(
|
||||
// slackData.stats.sort((a, b) => a.ds - b.ds).reverse()[0]
|
||||
// .total_members_count
|
||||
// )
|
||||
// array.unshift(newNum)
|
||||
// array.splice(2)
|
||||
// setSlackNum(array)
|
||||
// setSlackKey(Math.random())
|
||||
// }, [slackData])
|
||||
|
||||
useEffect(() => {
|
||||
if (typeof window !== 'undefined') {
|
||||
|
|
@ -120,10 +116,10 @@ function Page({
|
|||
}
|
||||
})
|
||||
|
||||
useEffect(() => {
|
||||
setKey(Math.random())
|
||||
setKey1(Math.random())
|
||||
}, slackData)
|
||||
// useEffect(() => {
|
||||
// setKey(Math.random())
|
||||
// setKey1(Math.random())
|
||||
// }, slackData)
|
||||
|
||||
// useEffect(() => {
|
||||
// if (typeof window !== 'undefined') {
|
||||
|
|
@ -180,16 +176,16 @@ function Page({
|
|||
// })
|
||||
|
||||
const easterEgg = () => {
|
||||
alert('Hey, you typed the Konami Code!');
|
||||
alert('Hey, you typed the Konami Code!')
|
||||
}
|
||||
|
||||
useEffect(() => {
|
||||
console.log('hi')
|
||||
if (reveal && !hover) {
|
||||
setTimeout(() => {
|
||||
console.log(reveal)
|
||||
console.log(hover)
|
||||
setReveal(false)
|
||||
console.log(reveal)
|
||||
console.log(hover)
|
||||
setReveal(false)
|
||||
}, 2000)
|
||||
}
|
||||
}, [hover])
|
||||
|
|
@ -206,7 +202,6 @@ function Page({
|
|||
bg="black"
|
||||
sx={{
|
||||
flexGrow: 1,
|
||||
fontSize: 2,
|
||||
color: 'white',
|
||||
fontWeight: '400 !important'
|
||||
}}
|
||||
|
|
@ -218,10 +213,11 @@ function Page({
|
|||
textDecoration: 'none',
|
||||
color: 'inherit',
|
||||
fontWeight: '400 !important',
|
||||
display: 'flex'
|
||||
display: 'flex',
|
||||
fontSize: '14px'
|
||||
}}
|
||||
>
|
||||
<Text as="span" sx={{ fontSize: 'smaller', color: 'sunken', mr: 2 }}>
|
||||
<Text as="span" sx={{ fontSize: 'small', color: 'sunken', mr: 2 }}>
|
||||
<RelativeTime value={time} titleformat="iso8601" />
|
||||
</Text>
|
||||
{text}{' '}
|
||||
|
|
@ -265,7 +261,7 @@ function Page({
|
|||
console.log('hover:', hover)
|
||||
}}
|
||||
/>
|
||||
<Konami action={easterEgg} code={[38,38,40,40]}>
|
||||
<Konami action={easterEgg} code={[38, 38, 40, 40]}>
|
||||
{"Hey, I'm an Easter Egg! Look at me!"}
|
||||
</Konami>
|
||||
<Box
|
||||
|
|
@ -288,7 +284,7 @@ function Page({
|
|||
{/* <SlideDown duration={768}> */}
|
||||
<Box
|
||||
sx={{
|
||||
maxWidth: [null, 'layoutPlus'],
|
||||
maxWidth: [null, 'layout'],
|
||||
position: 'relative',
|
||||
mx: 'auto'
|
||||
}}
|
||||
|
|
@ -306,20 +302,24 @@ function Page({
|
|||
}}
|
||||
/>
|
||||
<Fade>
|
||||
<Text variant="eyebrow" sx={{ color: 'sunken' }}>
|
||||
<Text
|
||||
variant="eyebrow"
|
||||
sx={{ color: 'sunken', fontSize: [1, 2, 3] }}
|
||||
>
|
||||
Welcome to Hack Club
|
||||
</Text>
|
||||
</Fade>
|
||||
<Fade bottom delay={200}>
|
||||
<Heading
|
||||
as="h1"
|
||||
variant="ultratitle"
|
||||
variant="title"
|
||||
sx={{
|
||||
color: 'white',
|
||||
my: [3, 4],
|
||||
mx: 'auto',
|
||||
zIndex: 1,
|
||||
textAlign: 'left'
|
||||
textAlign: 'left',
|
||||
fontSize: 'large'
|
||||
}}
|
||||
>
|
||||
<Text
|
||||
|
|
@ -331,7 +331,9 @@ function Page({
|
|||
}}
|
||||
>
|
||||
We inspire the hacker ethic in
|
||||
<Text sx={{ color: 'transparent', mx: 2 }}>
|
||||
<Text
|
||||
sx={{ color: 'transparent', mx: 2, whiteSpace: 'nowrap' }}
|
||||
>
|
||||
<Text
|
||||
sx={{
|
||||
lineHeight: 0.875,
|
||||
|
|
@ -348,7 +350,8 @@ function Page({
|
|||
}}
|
||||
as="a"
|
||||
onClick={() => {
|
||||
setHover(false); !reveal ? setReveal(true) : setReveal(false)
|
||||
setHover(false)
|
||||
!reveal ? setReveal(true) : setReveal(false)
|
||||
}}
|
||||
>
|
||||
teen makers
|
||||
|
|
@ -365,42 +368,48 @@ function Page({
|
|||
<Carousel />
|
||||
</Box>
|
||||
<Box as="section" sx={{ pt: [4, 5], color: 'black' }}>
|
||||
<Container
|
||||
<Box
|
||||
sx={{
|
||||
position: 'relative'
|
||||
position: 'relative',
|
||||
maxWidth: 'layout',
|
||||
margin: 'auto'
|
||||
}}
|
||||
pb={4}
|
||||
// pb={4}
|
||||
>
|
||||
<Text variant="eyebrow" as="p">
|
||||
<Text variant="eyebrow" as="p" sx={{ fontSize: [1, 2, 3] }}>
|
||||
A Hack Clubber is someone that
|
||||
</Text>
|
||||
<Text variant="title">
|
||||
<Text variant="title" sx={{ fontSize: [3, 4, 5] }}>
|
||||
Discovers technology by building things for the joy of it
|
||||
</Text>
|
||||
<Text
|
||||
variant="subtitle"
|
||||
as="p"
|
||||
sx={{ fontSize: [1, '16px', '20px'] }}
|
||||
>
|
||||
Here, teenagers don't wait for permission to code. Hack Clubbers
|
||||
come together to code because it's fun. Whether you’re a beginner
|
||||
programmer or have years of experience, there’s a place for you at
|
||||
Hack Club.
|
||||
</Text>
|
||||
{/* <Slack slackKey={slackKey} /> */}
|
||||
{/* <Events events={events} /> */}
|
||||
<Text variant="eyebrow" as="p" sx={{ fontSize: [1, 2, 3], mt: 4 }}>
|
||||
Hack Clubbers
|
||||
</Text>
|
||||
<Text variant="title" sx={{ fontSize: [3, 4, 5] }}>
|
||||
Hangout online
|
||||
</Text>
|
||||
<Grid columns={[1, 2]}>
|
||||
<Box
|
||||
{/* <Box
|
||||
pt={4}
|
||||
pb={5}
|
||||
sx={{
|
||||
position: 'relative',
|
||||
margin: 'auto'
|
||||
}}
|
||||
>
|
||||
<Text variant="subtitle" as="p">
|
||||
Here, teenagers don't wait for permission to code. Hack
|
||||
Clubbers come together to code because it's fun. Whether
|
||||
you’re a beginner programmer or have years of experience,
|
||||
there’s a place for you at Hack Club. Coding doesn't have to
|
||||
be a solidary activity. In the Hack Club Slack (Discord-style
|
||||
online groupchat), you'll find a group of{' '}
|
||||
{withCommas(
|
||||
slackData.stats.sort((a, b) => a.ds - b.ds).reverse()[0]
|
||||
.total_members_count
|
||||
)}{' '}
|
||||
fabulous people to talk to, active at all hours.
|
||||
</Text>
|
||||
<Link href="/slack" passHref sx={{ textDecoration: 'none' }}>
|
||||
<Button
|
||||
> */}
|
||||
{/* <Button
|
||||
as="a"
|
||||
variant="ctaLg"
|
||||
sx={{
|
||||
|
|
@ -410,10 +419,11 @@ function Page({
|
|||
my={3}
|
||||
>
|
||||
Join us →
|
||||
</Button>
|
||||
</Link>
|
||||
</Box>
|
||||
<Box
|
||||
</Button> */}
|
||||
<Slack slackKey={slackKey} />
|
||||
<MailingList />
|
||||
{/* </Box> */}
|
||||
{/* <Box
|
||||
sx={{
|
||||
position: 'relative',
|
||||
width: '100%',
|
||||
|
|
@ -441,11 +451,11 @@ function Page({
|
|||
allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture"
|
||||
allowfullscreen
|
||||
></Box>
|
||||
</Box>
|
||||
</Box> */}
|
||||
</Grid>
|
||||
<Events events={events}/>
|
||||
<Events events={events} />
|
||||
{/* <Inspect /> */}
|
||||
</Container>
|
||||
</Box>
|
||||
<Box
|
||||
py={4}
|
||||
sx={{
|
||||
|
|
@ -456,12 +466,23 @@ function Page({
|
|||
backgroundPosition: '10% 10%'
|
||||
}}
|
||||
>
|
||||
<Container>
|
||||
<Text variant="eyebrow" as="p">
|
||||
<Box
|
||||
sx={{
|
||||
maxWidth: 'layout',
|
||||
margin: 'auto'
|
||||
}}
|
||||
>
|
||||
<Text variant="eyebrow" as="p" sx={{ fontSize: [1, 2, 3] }}>
|
||||
Hack Clubbers
|
||||
</Text>
|
||||
<Text variant="title">Build open source tools</Text>
|
||||
<Text variant="subtitle" as="p">
|
||||
<Text variant="title" sx={{ fontSize: [3, 4, 5] }}>
|
||||
Build open source tools
|
||||
</Text>
|
||||
<Text
|
||||
variant="subtitle"
|
||||
as="p"
|
||||
sx={{ fontSize: [1, '16px', '20px'] }}
|
||||
>
|
||||
Led by engineers on the Hack Club team in collaboration with
|
||||
Hack Clubbers in the community, these learning tools are built
|
||||
with and for teenagers. Get involved with these projects by
|
||||
|
|
@ -481,14 +502,20 @@ function Page({
|
|||
stars={stars.sprigHardware.stargazerCount}
|
||||
/>
|
||||
<Workshops delay={400} stars={stars.hackclub.stargazerCount} />
|
||||
</Container>
|
||||
</Box>
|
||||
</Box>
|
||||
<Box>
|
||||
<Container py={3}>
|
||||
<Box
|
||||
py={3}
|
||||
sx={{
|
||||
maxWidth: 'layout',
|
||||
margin: 'auto'
|
||||
}}
|
||||
>
|
||||
<Text variant="eyebrow" as="p">
|
||||
Hack Clubbers
|
||||
</Text>
|
||||
<Text variant="title">
|
||||
<Text variant="title" sx={{ fontSize: [3, 4, 5] }}>
|
||||
Gather IRL to discover the{' '}
|
||||
<Text
|
||||
as="span"
|
||||
|
|
@ -504,7 +531,11 @@ function Page({
|
|||
joy of code
|
||||
</Text>
|
||||
</Text>
|
||||
<Text variant="subtitle" as="p">
|
||||
<Text
|
||||
variant="subtitle"
|
||||
as="p"
|
||||
sx={{ fontSize: [1, '16px', '20px'] }}
|
||||
>
|
||||
Meet other Hack Clubbers in your community to code and make
|
||||
things, be it once a week after school, a one-time 48 hour
|
||||
event, or anything in-between!
|
||||
|
|
@ -517,20 +548,21 @@ function Page({
|
|||
data={hackathonsData}
|
||||
stars={stars.hackathons.stargazerCount}
|
||||
/>
|
||||
</Container>
|
||||
</Box>
|
||||
</Box>
|
||||
</Box>
|
||||
<Box bg="snow" color="black" py={[3, 4]}>
|
||||
<Container
|
||||
<Box
|
||||
sx={{
|
||||
textAlign: 'left'
|
||||
maxWidth: 'layout',
|
||||
margin: 'auto'
|
||||
}}
|
||||
>
|
||||
<Text as="p" variant="eyebrow">
|
||||
Let's quickly review
|
||||
</Text>
|
||||
<Heading as="h2" variant="title">
|
||||
Find your second-home in{' '}
|
||||
<Heading as="h2" variant="title" sx={{ fontSize: [3, 4, 5] }}>
|
||||
Find your second-family with{' '}
|
||||
<Text
|
||||
as="span"
|
||||
sx={{
|
||||
|
|
@ -581,6 +613,11 @@ function Page({
|
|||
color="white"
|
||||
name="Join our online community"
|
||||
desc="Connect with other technical teenagers on Slack and hack on things together."
|
||||
sx={{
|
||||
p: {
|
||||
fontSize: [1, '16px', '20px']
|
||||
}
|
||||
}}
|
||||
/>
|
||||
</Card>
|
||||
<Card
|
||||
|
|
@ -600,6 +637,11 @@ function Page({
|
|||
color="white"
|
||||
name="Start a Club or Attend a Hackathon"
|
||||
desc="Build an in-person community of high school hackers, and we're here to help."
|
||||
sx={{
|
||||
p: {
|
||||
fontSize: [1, '16px', '20px']
|
||||
}
|
||||
}}
|
||||
/>
|
||||
</Card>
|
||||
<Card
|
||||
|
|
@ -619,10 +661,15 @@ function Page({
|
|||
color="white"
|
||||
name="Explore our open-sourced tools"
|
||||
desc="We're currently building a game engine, daily streak system, graphing game, and more!"
|
||||
sx={{
|
||||
p: {
|
||||
fontSize: [1, '16px', '20px']
|
||||
}
|
||||
}}
|
||||
/>
|
||||
</Card>
|
||||
</Grid>
|
||||
</Container>
|
||||
</Box>
|
||||
</Box>
|
||||
</Box>
|
||||
<Footer
|
||||
|
|
@ -686,7 +733,9 @@ export async function getStaticProps() {
|
|||
|
||||
// if(initialGitHubData != null) {
|
||||
let initialGitHubData1 = initialGitHubData.map(x =>
|
||||
(x.type == 'PushEvent' && x.actor.login != 'github-actions[bot]' && x.actor.login != 'dependabot[bot]') ||
|
||||
(x.type == 'PushEvent' &&
|
||||
x.actor.login != 'github-actions[bot]' &&
|
||||
x.actor.login != 'dependabot[bot]') ||
|
||||
x.type == 'WatchEvent' ||
|
||||
x.type == 'PullRequestEvent'
|
||||
? x.type == 'PushEvent'
|
||||
|
|
@ -727,21 +776,21 @@ export async function getStaticProps() {
|
|||
return el != null
|
||||
})
|
||||
|
||||
const formData = new FormData()
|
||||
// const formData = new FormData()
|
||||
|
||||
formData.append('token', process.env.SLACK_API_TOKEN)
|
||||
formData.append('date_range', '30d')
|
||||
// formData.append('token', process.env.SLACK_API_TOKEN)
|
||||
// formData.append('date_range', '30d')
|
||||
|
||||
const slackData = await fetch(
|
||||
'https://hackclub.slack.com/api/team.stats.timeSeries',
|
||||
{
|
||||
method: 'POST',
|
||||
body: formData,
|
||||
headers: {
|
||||
Cookie: process.env.SLACK_API_COOKIE
|
||||
}
|
||||
}
|
||||
).then(r => r.json())
|
||||
// const slackData = await fetch(
|
||||
// 'https://hackclub.slack.com/api/team.stats.timeSeries',
|
||||
// {
|
||||
// method: 'POST',
|
||||
// body: formData,
|
||||
// headers: {
|
||||
// Cookie: process.env.SLACK_API_COOKIE
|
||||
// }
|
||||
// }
|
||||
// ).then(r => r.json())
|
||||
|
||||
const res = await fetch('https://hackathons.hackclub.com/api/events/upcoming')
|
||||
const hackathonsData = await res.json()
|
||||
|
|
@ -763,9 +812,9 @@ export async function getStaticProps() {
|
|||
res => res.json()
|
||||
)
|
||||
|
||||
let events = await fetch('https://events.hackclub.com/api/events/upcoming/').then(
|
||||
res => res.json()
|
||||
)
|
||||
let events = await fetch(
|
||||
'https://events.hackclub.com/api/events/upcoming/'
|
||||
).then(res => res.json())
|
||||
|
||||
return {
|
||||
props: {
|
||||
|
|
@ -775,7 +824,7 @@ export async function getStaticProps() {
|
|||
githubData2,
|
||||
hackathonsData,
|
||||
bankData,
|
||||
slackData,
|
||||
// slackData,
|
||||
stars,
|
||||
events
|
||||
},
|
||||
|
|
|
|||
Loading…
Add table
Reference in a new issue