Ensure text in Table components use colors from the theme (#1917)

Author: jhardy

packages/components/src/Table/Table.tsx

@@ -52,6 +52,6 @@ export const Table = styled.table
   ${space}
   ${layout}
   ${border}
-
   border-collapse: collapse;
+  color: ${({ theme: { colors } }) => colors.text5};
 `

packages/components/src/Table/TableCell/TableHeaderCell.tsx

@@ -35,7 +35,7 @@ export interface TableHeaderCellProps
 export const TableHeaderCell = styled.th
   .withConfig({ shouldForwardProp })
   .attrs<TableHeaderCellProps>(
-    ({ color = 'ui4', fontSize = 'xsmall', fontWeight = 'semiBold' }) => ({
+    ({ color = 'text2', fontSize = 'xsmall', fontWeight = 'semiBold' }) => ({
       color,
       fontSize,
       fontWeight,

packages/components/src/Table/TableCell/__snapshots__/TableHeaderCell.test.tsx.snap

@@ -4,7 +4,7 @@ exports[`A <TableHeaderCell> should render 1`] = `
 .c0 {
   font-family: Roboto,'Noto Sans JP','Noto Sans CJK KR','Noto Sans Arabic UI','Noto Sans Devanagari UI','Noto Sans Hebrew','Noto Sans Thai UI',Helvetica,Arial,sans-serif;
   padding: 0.5rem 0;
-  color: #939BA5;
+  color: #707781;
   font-size: 0.75rem;
   font-weight: 600;
 }

packages/components/src/Table/__snapshots__/Table.test.tsx.snap

@@ -5,6 +5,7 @@ exports[`A Table should render 1`] = `
   font-family: Roboto,'Noto Sans JP','Noto Sans CJK KR','Noto Sans Arabic UI','Noto Sans Devanagari UI','Noto Sans Hebrew','Noto Sans Thai UI',Helvetica,Arial,sans-serif;
   width: 100%;
   border-collapse: collapse;
+  color: #262D33;
 }
 
 <table