Permalink
Newer
100644
62 lines (60 sloc)
1.45 KB
1
import {
2
Card,
3
CardFooter,
4
Code,
5
Container,
6
Divider,
7
Heading,
8
Image,
9
Stack,
10
Text,
11
} from "@chakra-ui/react";
23
return (
24
<Container maxW="container.xl" pt="4vh">
25
<Heading textAlign="start">Our Team</Heading>
26
<br />
27
<Text textAlign="start">
28
Please respect our staff, and <u>do not send direct messages</u> or
29
friend requests in place of official channels.
30
</Text>
31
<br />
32
<div
33
style={{
34
display: "grid",
35
gap: "1rem",
36
gridTemplateColumns: "repeat(auto-fill, minmax(16rem, 1fr))",
37
width: "100%",
38
}}
39
>
40
{team.map((member) => (
42
<Image
43
alt={member.tag + "'s avatar"}
44
borderRadius="50%"
45
src={`/files/avatars/${member.id}.webp`}
46
/>
47
<Stack mb="8" mt="6" spacing="3">
48
<b>
49
<Heading size="md">{member.tag}</Heading>
50
</b>
51
<Text>{member.position}</Text>
52
</Stack>
53
<Divider />
54
<CardFooter justifyContent="center">
55
<Code>ID: {member.id}</Code>
56
</CardFooter>
57
</Card>
58
))}
59
</div>
60
</Container>
61
);
62
}