Use chakra provided list element

regalijan · Oct 19, 2023 · a062e9b · a062e9b
1 parent 02c16c7
commit a062e9b
Showing 1 changed file with 16 additions and 18 deletions.
diff --git a/app/routes/about.tsx b/app/routes/about.tsx
@@ -1,4 +1,4 @@
-import { Container, Heading, Link, Text } from "@chakra-ui/react";
+import { Container, Heading, Link, ListItem, Text, UnorderedList } from "@chakra-ui/react";
 
 export default function () {
   return (
@@ -18,23 +18,21 @@ export default function () {
       </Text>
       <br />
       <Heading pt="16px">Customer Support</Heading>
-      <Text>
-        <ul>
-          <li>
-            Discord:{" "}
-            <Link color="#646cff" href="https://discord.com/invite/carcrushers">
-              Join the server
-            </Link>{" "}
-            and open a ticket with ModMail.
-          </li>
-          <li>
-            Forum:{" "}
-            <Link color="#646cff" href="https://ccdiscussion.com/">
-              Make a post on our forum.
-            </Link>
-          </li>
-        </ul>
-      </Text>
+      <UnorderedList px="8px">
+        <ListItem>
+          Discord:{" "}
+          <Link color="#646cff" href="https://discord.com/invite/carcrushers">
+            Join the server
+          </Link>{" "}
+          and open a ticket with ModMail.
+        </ListItem>
+        <ListItem>
+          Forum:{" "}
+          <Link color="#646cff" href="https://ccdiscussion.com/">
+            Make a post on our forum.
+          </Link>
+        </ListItem>
+      </UnorderedList>
       <br />
       <Heading pt="16px">Company Information</Heading>
       <Text>