mirror of
https://github.com/System-End/site.git
synced 2026-04-19 20:55:09 +00:00
71 lines
2.1 KiB
JavaScript
71 lines
2.1 KiB
JavaScript
import CardModel from './card-model'
|
|
import { Box, Flex, Grid, Text } from 'theme-ui'
|
|
import Buttons from './button'
|
|
|
|
/** @jsxImportSource theme-ui */
|
|
|
|
export default function Haxidraw({ stars }) {
|
|
return (
|
|
<CardModel
|
|
github_link="https://github.com/hackclub/blot/"
|
|
color="white"
|
|
sx={{
|
|
backgroundSize: 'cover',
|
|
backgroundColor: '#95C9E5',
|
|
backgroundImage: `linear-gradient(120deg, rgba(0, 0, 0, 1), rgba(0, 0, 0, 0.9) 30%, rgba(0, 0, 0, 0.4) 70%), url('https://cloud-1tnl6uqvw-hack-club-bot.vercel.app/0image.png')`
|
|
}}
|
|
position={[null, 'bottom', 'bottom']}
|
|
highlight="#2b27f8d9"
|
|
filter="brightness(0.8)"
|
|
stars={stars}
|
|
>
|
|
<Text variant="title" as="h3" sx={{ fontSize: ['36px', 4, 5] }}>
|
|
Blot
|
|
</Text>
|
|
<Grid columns={[1, 2]}>
|
|
<Box>
|
|
<Text
|
|
as="p"
|
|
variant="subtitle"
|
|
sx={{ zIndex: 2, position: 'relative' }}
|
|
>
|
|
Blot is an open source drawing machine and online editor, designed
|
|
to be a fun and beginner friendly introduction to digital
|
|
fabrication and generative art.
|
|
</Text>
|
|
</Box>
|
|
<Box>
|
|
<Flex sx={{ flexDirection: 'column', mt: [3, 3, 4] }}>
|
|
<Buttons
|
|
id="51"
|
|
icon="align-left"
|
|
link="https://blot.hackclub.dev"
|
|
primary="rgba(255, 255, 255, 0.9)"
|
|
sx={{ color: 'black' }}
|
|
>
|
|
Learn more
|
|
</Buttons>
|
|
<Buttons
|
|
id="52"
|
|
icon="code"
|
|
link="https://blot.hackclub.dev/editor"
|
|
primary="rgba(255, 255, 255, 0.9)"
|
|
sx={{ color: 'black' }}
|
|
>
|
|
Create something in the editor
|
|
</Buttons>
|
|
<Buttons
|
|
id="54"
|
|
icon="slack"
|
|
link="/slack"
|
|
overrideColor="rgba(255, 255, 255, 0.7)"
|
|
sx={{ color: 'black' }}
|
|
>
|
|
Share your creations and chat on Slack
|
|
</Buttons>
|
|
</Flex>
|
|
</Box>
|
|
</Grid>
|
|
</CardModel>
|
|
)
|
|
}
|