-
Notifications
You must be signed in to change notification settings - Fork 0
/
Dashboard.jsx
53 lines (51 loc) · 1.93 KB
/
Dashboard.jsx
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
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
import { Box, Flex, Heading, HStack, VStack, Stack, Divider, Progress, Text } from '@chakra-ui/react'
import React from 'react'
function Dashboard() {
return (
<VStack >
<Flex>
<Box
color='white'
borderWidth='1px'
bg='white'
p='8'
pt='4'
borderRadius='lg'
m='8'
w='40rem'
>
<HStack>
<Stack p='8' pl='4'>
<Heading color='black'>
$89,914
</Heading>
<Heading size='sm' color='gray.500'>
of $100,000 backed
</Heading>
</Stack>
<Divider orientation="vertical" />
<Stack p='8'>
<Heading color='black'>
5,007
</Heading>
<Heading size='sm' color='gray.500'>
total backers
</Heading>
</Stack>
<Divider orientation="vertical" />
<Stack p='4'>
<Heading color='black'>
56
</Heading>
<Heading size='sm' color='gray.500'>
days left
</Heading>
</Stack>
</HStack>
<Progress value={80} borderRadius='lg' colorScheme='teal' bg='gray.100' />
</Box>
</Flex>
</VStack>
)
}
export default Dashboard