Fixing default color on Text component

MetaMask · Jun 12, 2023 · f99f22f · f99f22f
1 parent e658cd9
commit f99f22f
Show file tree

Hide file tree

Showing 3 changed files with 7 additions and 10 deletions.
diff --git a/ui/components/component-library/text/README.mdx b/ui/components/component-library/text/README.mdx
@@ -14,7 +14,7 @@ Good typography improves readability, legibility and hierarchy of information.
 
 ## Props
 
-The `Text` accepts all props below as well as all [Box](/docs/components-ui-box--default-story#props) component props
+The `Text` accepts all props below as well as all [Box](/docs/components-componentlibrary-box--docs#props) component props
 
 <ArgsTable of={Text} />
 
@@ -354,10 +354,6 @@ import { Text } from '../../component-library';
 </Text>
 ```
 
-### Box Props
-
-Use any valid box props [Box](/?path=/story/components-ui-box--default-story) component props to the Text component.
-
 ### Class Name
 
 Adds an additional class to the `Text` component
@@ -569,7 +565,7 @@ Values using the `TextAlign` object from `./ui/helpers/constants/design-system.j
 
 ### Box Props
 
-Box props are now integrated with the `Text` component. Valid box props: [Box](/?path=/story/components-ui-box--default-story)
+Box props are now integrated with the `Text` component. Valid Box props: [Box](/docs/components-componentlibrary-box--docs#props)
 
 You no longer need to pass these props as an object through `boxProps`
 

diff --git a/ui/components/component-library/text/text.scss b/ui/components/component-library/text/text.scss
@@ -26,11 +26,8 @@ $text-variants: (
   }
 }
 
-
-
 .mm-text {
   // Set default styles
-  color: var(--color-text-default);
   font-family: var(--font-family-sans);
 
   &:is(strong),

diff --git a/ui/components/component-library/text/text.tsx b/ui/components/component-library/text/text.tsx
@@ -1,7 +1,10 @@
 import React from 'react';
 import classnames from 'classnames';
 
-import { TextVariant } from '../../../helpers/constants/design-system';
+import {
+  TextVariant,
+  TextColor,
+} from '../../../helpers/constants/design-system';
 
 import { Box } from '..';
 
@@ -66,6 +69,7 @@ export const Text: TextComponent = React.forwardRef(
         as={tag}
         dir={textDirection}
         ref={ref}
+        color={TextColor.textDefault}
         {...props} // TODO: Need to fix Box types to allow for spreading props
       >
         {children}