mirror of
https://github.com/System-End/site.git
synced 2026-04-20 00:25:19 +00:00
103 lines
2.8 KiB
JavaScript
103 lines
2.8 KiB
JavaScript
import CardModel from './card-model'
|
||
import { Box, Flex, Grid, Image, Text } from 'theme-ui'
|
||
import Buttons from './button'
|
||
|
||
/** @jsxImportSource theme-ui */
|
||
|
||
export default function Apocalypse() {
|
||
return (
|
||
<CardModel
|
||
color="white"
|
||
sx={{
|
||
backgroundSize: 'cover',
|
||
backgroundColor: '#95C9E5'
|
||
}}
|
||
position={[null, 'bottom', 'bottom']}
|
||
image="https://cloud-1132qsbcy-hack-club-bot.vercel.app/0image__6_.png"
|
||
>
|
||
<Grid columns={[1, 1, 2]} sx={{ position: 'relative', zIndex: 2 }}>
|
||
<Flex
|
||
sx={{
|
||
flexDirection: 'column',
|
||
justifyContent: 'space-between'
|
||
}}
|
||
>
|
||
<Image
|
||
src="https://cloud-lvxa0tab7-hack-club-bot.vercel.app/0apotitle_cropped.png"
|
||
sx={{
|
||
width: ['200px', '250px', '300px'],
|
||
mt: ['-5px', '-5px', '-5px'],
|
||
mb: ['30px', '30px', '30px'],
|
||
position: 'relative',
|
||
zIndex: 2,
|
||
fontSize: ['36px', 4, 5],
|
||
color: 'white'
|
||
}}
|
||
alt="Apocalypse"
|
||
/>
|
||
|
||
<Flex
|
||
sx={{
|
||
flexDirection: ['row', 'row', 'column'],
|
||
justifyContent: 'space-between'
|
||
}}
|
||
>
|
||
<Text
|
||
as="p"
|
||
variant="subheadline"
|
||
sx={{
|
||
ml: ['0px', '0px', '10px'],
|
||
mt: ['0px', '0px', '-10px'],
|
||
mb: ['0px', '0px', '20px'],
|
||
zIndex: 2,
|
||
color: 'white',
|
||
fontSize: ['24px !important'],
|
||
|
||
textShadow: '0 0 20px #fbbae4'
|
||
}}
|
||
>
|
||
Downtown Toronto
|
||
<br />
|
||
May 17–19
|
||
</Text>
|
||
|
||
<Buttons
|
||
icon="flag-fill"
|
||
href="https://apocalypse.hackclub.com/"
|
||
target="_blank"
|
||
rel="noopener"
|
||
primary="#FE5CA8"
|
||
id="43"
|
||
sx={{ color: '#fff' }}
|
||
>
|
||
Join Us
|
||
</Buttons>
|
||
</Flex>
|
||
</Flex>
|
||
<Box>
|
||
<Text
|
||
as="p"
|
||
variant="subtitle"
|
||
sx={{
|
||
fontSize: ['22px', '20px', '18px']
|
||
}}
|
||
>
|
||
It's 2034, and zombies have taken over! But tech still operates.
|
||
What would you do?
|
||
</Text>
|
||
<Text
|
||
as="p"
|
||
variant="subtitle"
|
||
sx={{
|
||
fontSize: ['22px', '20px', '18px']
|
||
}}
|
||
>
|
||
Join 150 high schoolers for 44 hours at Apocalypse! Take yourself
|
||
out of the real world and build wacky projects to spark a new age of
|
||
humanity.
|
||
</Text>
|
||
</Box>
|
||
</Grid>
|
||
</CardModel>
|
||
)
|
||
}
|