kopia lustrzana https://gitlab.com/soapbox-pub/soapbox
40 wiersze
1.3 KiB
TypeScript
40 wiersze
1.3 KiB
TypeScript
import React from 'react';
|
|
import { FormattedMessage } from 'react-intl';
|
|
|
|
import { Button, Card, CardBody, Icon, Stack, Text } from 'soapbox/components/ui';
|
|
|
|
const CompletedStep = ({ onComplete }: { onComplete: () => void }) => (
|
|
<Card variant='rounded' size='xl'>
|
|
<CardBody>
|
|
<Stack space={2}>
|
|
<Icon strokeWidth={1} src={require('@tabler/icons/confetti.svg')} className='w-16 h-16 mx-auto text-primary-600 dark:text-primary-400' />
|
|
|
|
<Text size='2xl' align='center' weight='bold'>
|
|
<FormattedMessage id='onboarding.finished.title' defaultMessage='Onboarding complete' />
|
|
</Text>
|
|
|
|
<Text theme='muted' align='center'>
|
|
<FormattedMessage
|
|
id='onboarding.finished.message'
|
|
defaultMessage='We are very excited to welcome you to our community! Tap the button below to get started.'
|
|
/>
|
|
</Text>
|
|
</Stack>
|
|
|
|
<div className='pt-10 sm:w-2/3 md:w-1/2 mx-auto'>
|
|
<Stack justifyContent='center' space={2}>
|
|
<Button
|
|
block
|
|
theme='primary'
|
|
onClick={onComplete}
|
|
>
|
|
<FormattedMessage id='onboarding.view_feed' defaultMessage='View Feed' />
|
|
</Button>
|
|
</Stack>
|
|
</div>
|
|
</CardBody>
|
|
</Card>
|
|
);
|
|
|
|
export default CompletedStep;
|