diff --git a/packages/status-react/src/system/heading/heading.tsx b/packages/status-react/src/system/heading/heading.tsx index 1c754259..3b6ba88f 100644 --- a/packages/status-react/src/system/heading/heading.tsx +++ b/packages/status-react/src/system/heading/heading.tsx @@ -4,11 +4,21 @@ import type React from 'react' const Heading = styled('div', { fontFamily: theme.fonts.sans, - fontSize: '17px', variants: { - size: {}, - color: {}, + size: { + 15: { + fontSize: '15px', + }, + 17: { + fontSize: '17px', + }, + }, + color: { + accent: { + color: '$accent-1', + }, + }, weight: { '400': { fontWeight: theme.fontWeights[400], @@ -55,6 +65,9 @@ const Heading = styled('div', { defaultVariants: { align: 'left', + color: 'accent', + weight: '500', + size: '17', }, // compoundVariants: {}, diff --git a/packages/status-react/src/system/text/text.tsx b/packages/status-react/src/system/text/text.tsx index e78d19f2..40925af6 100644 --- a/packages/status-react/src/system/text/text.tsx +++ b/packages/status-react/src/system/text/text.tsx @@ -13,13 +13,25 @@ const Text = styled('div', { '12': { fontSize: '12px', }, + '13': { + fontSize: '13px', + }, '14': { fontSize: '14px', }, + '15': { + fontSize: '15px', + }, }, color: { + accent: { + color: '$accent-1', + }, + primary: { + color: '$primary-1', + }, gray: { - color: '#939BA1', + color: '$gray-1', }, }, weight: { @@ -70,6 +82,7 @@ const Text = styled('div', { defaultVariants: { align: 'left', weight: '400', + color: 'accent', }, // compoundVariants: {},