-
Notifications
You must be signed in to change notification settings - Fork 124
/
contact.js
36 lines (34 loc) 路 864 Bytes
/
contact.js
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
import Icon from '../icon'
import { Flex, Link, Text } from 'theme-ui'
const phoneNumber = '+1 (844) 237-2290'
const phoneNumberUri = '+1-844-237-2290'
const email = 'hcb@hackclub.com'
export default function ContactBanner({ sx }) {
return (
<Flex
sx={{
bg: 'sunken',
color: 'slate',
alignItems: 'center',
p: 3,
gap: [3, 2],
...sx
}}
>
<Icon
glyph="message"
sx={{ color: 'inherit', flexShrink: 0, my: -1 }}
aria-hidden
/>
<Text
sx={{
textWrap: 'balance',
a: { color: 'inherit', mx: '0.125em', whiteSpace: 'nowrap' }
}}
>
Questions? Email <Link href={`mailto:${email}`}>{email}</Link>{' '}
or call <Link href={`tel:${phoneNumberUri}`}>{phoneNumber}</Link>
</Text>
</Flex>
)
}