Merge pull request #8061 from ImMiguelP/chakra-markdowntable

Migrate MarkdownTable to Chakra

Author: pettinarip

src/components/MarkdownTable.tsx

@@ -1,24 +1,24 @@
 import React from "react"
-import styled from "@emotion/styled"
-
-const TableContainer = styled.div`
-  overflow-x: auto;
-  margin: 2rem 0;
-
-  th {
-    border-bottom: 1px solid ${(props) => props.theme.colors.border};
-    white-space: nowrap;
-  }
-`
+import { Box, Table } from "@chakra-ui/react"
 
 export interface IProps {
   children?: React.ReactNode
 }
 
 const MarkdownTable: React.FC<IProps> = ({ children }) => (
-  <TableContainer>
-    <table>{children}</table>
-  </TableContainer>
+  <Box my={8}>
+    <Table
+      sx={{
+        th: {
+          borderBottom: "1px solid",
+          borderColor: "border",
+          whiteSpace: "nowrap",
+        },
+      }}
+    >
+      {children}
+    </Table>
+  </Box>
 )
 
 export default MarkdownTable