1
0
mirror of https://github.com/kremalicious/metamask-extension.git synced 2024-11-26 12:29:06 +01:00

Typography to text (#18382)

* Typography to text

* Update README.md

* Update README.md

* minor changes in custom file

* minor change

* Resolved Conflict issues

---------

Co-authored-by: Nidhi Kumari <nidhi.kumari@consensys.net>
This commit is contained in:
Aditya Patel 2023-04-06 16:40:14 +05:30 committed by GitHub
parent a816a6e592
commit 18ff108627
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23

View File

@ -6,16 +6,14 @@ import BigNumber from 'bignumber.js';
import { I18nContext } from '../../../contexts/i18n'; import { I18nContext } from '../../../contexts/i18n';
import Box from '../../ui/box'; import Box from '../../ui/box';
import FormField from '../../ui/form-field'; import FormField from '../../ui/form-field';
import Typography from '../../ui/typography'; import { Text, ButtonLink } from '../../component-library';
import { Icon, ICON_NAMES } from '../../component-library/icon/deprecated'; import { Icon, ICON_NAMES } from '../../component-library/icon/deprecated';
import { ButtonLink } from '../../component-library';
import { import {
AlignItems, AlignItems,
DISPLAY, DISPLAY,
FLEX_DIRECTION, FLEX_DIRECTION,
TEXT_ALIGN, TEXT_ALIGN,
FONT_WEIGHT, TextVariant,
TypographyVariant,
JustifyContent, JustifyContent,
Size, Size,
BLOCK_SIZES, BLOCK_SIZES,
@ -72,14 +70,14 @@ export default function CustomSpendingCap({
return { return {
className: 'custom-spending-cap__lowerValue', className: 'custom-spending-cap__lowerValue',
description: t('inputLogicEqualOrSmallerNumber', [ description: t('inputLogicEqualOrSmallerNumber', [
<Typography <Text
key="custom-spending-cap" key="custom-spending-cap"
variant={TypographyVariant.H6} variant={TextVariant.bodySmBold}
fontWeight={FONT_WEIGHT.BOLD} as="h6"
className="custom-spending-cap__input-value-and-token-name" className="custom-spending-cap__input-value-and-token-name"
> >
{replaceCommaToDot(inputNumber)} {tokenName} {replaceCommaToDot(inputNumber)} {tokenName}
</Typography>, </Text>,
]), ]),
}; };
} else if (decConversionGreaterThan(inputNumber, currentTokenBalance)) { } else if (decConversionGreaterThan(inputNumber, currentTokenBalance)) {
@ -146,14 +144,14 @@ export default function CustomSpendingCap({
currentTokenBalance, currentTokenBalance,
) )
? t('warningTooltipText', [ ? t('warningTooltipText', [
<Typography <Text
key="tooltip-text" key="tooltip-text"
variant={TypographyVariant.H7} variant={TextVariant.bodySmBold}
fontWeight={FONT_WEIGHT.BOLD} as="h6"
color={TextColor.errorDefault} color={TextColor.errorDefault}
> >
<Icon name={ICON_NAMES.WARNING} /> {t('beCareful')} <Icon name={ICON_NAMES.WARNING} /> {t('beCareful')}
</Typography>, </Text>,
]) ])
: t('inputLogicEmptyState'); : t('inputLogicEmptyState');
@ -250,15 +248,17 @@ export default function CustomSpendingCap({
'custom-spending-cap__description--with-error-message': error, 'custom-spending-cap__description--with-error-message': error,
})} })}
> >
<Typography <Text
color={TextColor.textDefault} color={TextColor.textDefault}
variant={TypographyVariant.H7} variant={TextVariant.bodySm}
boxProps={{ paddingTop: 2, paddingBottom: 2 }} as="h6"
paddingTop={2}
paddingBottom={2}
> >
{replaceCommaToDot(value) {replaceCommaToDot(value)
? customSpendingCapText ? customSpendingCapText
: inputLogicEmptyStateText} : inputLogicEmptyStateText}
</Typography> </Text>
</Box> </Box>
</label> </label>
</Box> </Box>