1
0
mirror of https://github.com/kremalicious/metamask-extension.git synced 2024-12-23 09:52:26 +01:00

Changed all Typography to Text component in welcome.js and edit-gas-display.component.js (#18116)

Co-authored-by: George Marshall <george.marshall@consensys.net>
This commit is contained in:
Suryansh Anand 2023-03-21 23:47:59 +05:30 committed by GitHub
parent be63190b97
commit b9f00ba536
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 34 additions and 29 deletions

View File

@ -5,14 +5,14 @@ import BigNumber from 'bignumber.js';
import { EditGasModes } from '../../../../shared/constants/gas'; import { EditGasModes } from '../../../../shared/constants/gas';
import Button from '../../ui/button'; import Button from '../../ui/button';
import Typography from '../../ui/typography/typography';
import { import {
TEXT_ALIGN, TEXT_ALIGN,
TypographyVariant,
FONT_WEIGHT, FONT_WEIGHT,
TextColor, TextColor,
TextVariant,
} from '../../../helpers/constants/design-system'; } from '../../../helpers/constants/design-system';
import { Text } from '../../component-library';
import { areDappSuggestedAndTxParamGasFeesTheSame } from '../../../helpers/utils/confirm-tx.util'; import { areDappSuggestedAndTxParamGasFeesTheSame } from '../../../helpers/utils/confirm-tx.util';
import InfoTooltip from '../../ui/info-tooltip'; import InfoTooltip from '../../ui/info-tooltip';
@ -97,9 +97,10 @@ export default function EditGasDisplay({
)} )}
{mode === EditGasModes.speedUp && ( {mode === EditGasModes.speedUp && (
<div className="edit-gas-display__top-tooltip"> <div className="edit-gas-display__top-tooltip">
<Typography <Text
color={TextColor.textDefault} color={TextColor.textDefault}
variant={TypographyVariant.H8} variant={TextVariant.bodySm}
as="h6"
fontWeight={FONT_WEIGHT.BOLD} fontWeight={FONT_WEIGHT.BOLD}
> >
{t('speedUpTooltipText')}{' '} {t('speedUpTooltipText')}{' '}
@ -107,16 +108,17 @@ export default function EditGasDisplay({
position="top" position="top"
contentText={t('speedUpExplanation')} contentText={t('speedUpExplanation')}
/> />
</Typography> </Text>
</div> </div>
)} )}
<Typography <Text
color={TextColor.textDefault} color={TextColor.textDefault}
variant={TypographyVariant.H1} variant={TextVariant.displayMd}
align={TEXT_ALIGN.CENTER} as="h1"
textAlign={TEXT_ALIGN.CENTER}
> >
{estimatedMinimumNative} {estimatedMinimumNative}
</Typography> </Text>
{requireDappAcknowledgement && ( {requireDappAcknowledgement && (
<Button <Button
className="edit-gas-display__dapp-acknowledgement-button" className="edit-gas-display__dapp-acknowledgement-button"

View File

@ -5,11 +5,11 @@ import { useHistory } from 'react-router-dom';
import { Carousel } from 'react-responsive-carousel'; import { Carousel } from 'react-responsive-carousel';
import Mascot from '../../../components/ui/mascot'; import Mascot from '../../../components/ui/mascot';
import Button from '../../../components/ui/button'; import Button from '../../../components/ui/button';
import Typography from '../../../components/ui/typography/typography'; import { Text } from '../../../components/component-library';
import { import {
TypographyVariant,
FONT_WEIGHT, FONT_WEIGHT,
TEXT_ALIGN, TEXT_ALIGN,
TextVariant,
} from '../../../helpers/constants/design-system'; } from '../../../helpers/constants/design-system';
import { useI18nContext } from '../../../hooks/useI18nContext'; import { useI18nContext } from '../../../hooks/useI18nContext';
import { MetaMetricsContext } from '../../../contexts/metametrics'; import { MetaMetricsContext } from '../../../contexts/metametrics';
@ -81,16 +81,17 @@ export default function OnboardingWelcome() {
<div className="onboarding-welcome" data-testid="onboarding-welcome"> <div className="onboarding-welcome" data-testid="onboarding-welcome">
<Carousel showThumbs={false} showStatus={false} showArrows> <Carousel showThumbs={false} showStatus={false} showArrows>
<div> <div>
<Typography <Text
variant={TypographyVariant.H2} variant={TextVariant.headingLg}
align={TEXT_ALIGN.CENTER} as="h2"
textAlign={TEXT_ALIGN.CENTER}
fontWeight={FONT_WEIGHT.BOLD} fontWeight={FONT_WEIGHT.BOLD}
> >
{t('welcomeToMetaMask')} {t('welcomeToMetaMask')}
</Typography> </Text>
<Typography align={TEXT_ALIGN.CENTER} marginLeft={6} marginRight={6}> <Text textAlign={TEXT_ALIGN.CENTER} marginLeft={6} marginRight={6}>
{t('welcomeToMetaMaskIntro')} {t('welcomeToMetaMaskIntro')}
</Typography> </Text>
<div className="onboarding-welcome__mascot"> <div className="onboarding-welcome__mascot">
<Mascot <Mascot
animationEventEmitter={eventEmitter} animationEventEmitter={eventEmitter}
@ -100,16 +101,17 @@ export default function OnboardingWelcome() {
</div> </div>
</div> </div>
<div> <div>
<Typography <Text
variant={TypographyVariant.H2} variant={TextVariant.headingLg}
align={TEXT_ALIGN.CENTER} as="h2"
textAlign={TEXT_ALIGN.CENTER}
fontWeight={FONT_WEIGHT.BOLD} fontWeight={FONT_WEIGHT.BOLD}
> >
{t('welcomeExploreTitle')} {t('welcomeExploreTitle')}
</Typography> </Text>
<Typography align={TEXT_ALIGN.CENTER}> <Text textAlign={TEXT_ALIGN.CENTER}>
{t('welcomeExploreDescription')} {t('welcomeExploreDescription')}
</Typography> </Text>
<div className="onboarding-welcome__image"> <div className="onboarding-welcome__image">
<img <img
src="/images/onboarding-welcome-say-hello.svg" src="/images/onboarding-welcome-say-hello.svg"
@ -120,16 +122,17 @@ export default function OnboardingWelcome() {
</div> </div>
</div> </div>
<div> <div>
<Typography <Text
variant={TypographyVariant.H2} variant={TextVariant.headingLg}
align={TEXT_ALIGN.CENTER} as="h2"
textAlign={TEXT_ALIGN.CENTER}
fontWeight={FONT_WEIGHT.BOLD} fontWeight={FONT_WEIGHT.BOLD}
> >
{t('welcomeLoginTitle')} {t('welcomeLoginTitle')}
</Typography> </Text>
<Typography align={TEXT_ALIGN.CENTER}> <Text textAlign={TEXT_ALIGN.CENTER}>
{t('welcomeLoginDescription')} {t('welcomeLoginDescription')}
</Typography> </Text>
<div className="onboarding-welcome__image"> <div className="onboarding-welcome__image">
<img <img
src="/images/onboarding-welcome-decentralised-apps.svg" src="/images/onboarding-welcome-decentralised-apps.svg"