Remix migration

2023-10-19 16:49:09 -04:00
parent 5d2774fb2e
commit 04dcbb4181
33 changed files with 16545 additions and 1813 deletions
--- a/app/routes/team.tsx
+++ b/app/routes/team.tsx
@ -0,0 +1,54 @@
+import {
+  Card,
+  CardFooter,
+  Code,
+  Container,
+  Divider,
+  Heading,
+  Image,
+  Stack,
+  Text,
+} from "@chakra-ui/react";
+import team from "../../data/team.json";
+
+export default function () {
+  return (
+    <Container maxW="container.xl" pt="4vh">
+      <Heading textAlign="start">Our Team</Heading>
+      <br />
+      <Text textAlign="start">
+        Please respect our staff, and <u>do not send direct messages</u> or
+        friend requests in place of official channels.
+      </Text>
+      <br />
+      <div
+        style={{
+          display: "grid",
+          gap: "1rem",
+          gridTemplateColumns: "repeat(auto-fill, minmax(16rem, 1fr))",
+          width: "100%",
+        }}
+      >
+        {team.map((member) => (
+          <Card key={member.id} maxW="xs" p="12px">
+            <Image
+              alt={member.tag + "'s avatar"}
+              borderRadius="50%"
+              src={`/files/avatars/${member.id}.webp`}
+            />
+            <Stack mb="8" mt="6" spacing="3">
+              <b>
+                <Heading size="md">{member.tag}</Heading>
+              </b>
+              <Text>{member.position}</Text>
+            </Stack>
+            <Divider />
+            <CardFooter justifyContent="center">
+              <Code>ID: {member.id}</Code>
+            </CardFooter>
+          </Card>
+        ))}
+      </div>
+    </Container>
+  );
+}