| 1 |
import Stack from '@elementor/ui/Stack'; |
| 2 |
import { Navigation } from '../navigation'; |
| 3 |
import Typography from '@elementor/ui/Typography'; |
| 4 |
import Alert from '@elementor/ui/Alert'; |
| 5 |
import Box from '@elementor/ui/Box'; |
| 6 |
import Button from '@elementor/ui/Button'; |
| 7 |
import Link from '@elementor/ui/Link'; |
| 8 |
import { __ } from '@wordpress/i18n'; |
| 9 |
|
| 10 |
export const GetStarted = ( { message, buttonText, onClick, severity } ) => { |
| 11 |
return ( |
| 12 |
<> |
| 13 |
<Stack direction="column" alignItems="center" justifyContent="center"> |
| 14 |
<Stack sx={ { maxWidth: 662 } } alignItems="center" justifyContent="center" gap={ 4 }> |
| 15 |
<Navigation /> |
| 16 |
<Stack alignItems="center" justifyContent="center" gap={ 4 }> |
| 17 |
<Typography variant="h4" align="center" px={ 2 } sx={ { color: 'text.primary' } }> |
| 18 |
{ __( 'Welcome! Let’s create your website.', 'hello-plus' ) } |
| 19 |
</Typography> |
| 20 |
<Typography variant="body1" align="center" px={ 2 } color="text.secondary"> |
| 21 |
{ |
| 22 |
__( |
| 23 |
'Thanks for installing the Hello Biz theme by Elementor. This setup wizard will help you create a website in moments.', |
| 24 |
'hello-plus', |
| 25 |
) |
| 26 |
} |
| 27 |
</Typography> |
| 28 |
{ message && <Alert severity={ severity }>{ message }</Alert> } |
| 29 |
<Box p={ 1 } mt={ 6 }> |
| 30 |
{ buttonText && <Button variant="contained" onClick={ onClick }>{ buttonText }</Button> } |
| 31 |
</Box> |
| 32 |
</Stack> |
| 33 |
</Stack> |
| 34 |
</Stack> |
| 35 |
<Stack direction="column" alignItems="center" justifyContent="center" sx={ { marginTop: 'auto', pb: 4 } }> |
| 36 |
<Stack direction="row" sx={ { maxWidth: 'fit-content' } } alignItems="center" justifyContent="center"> |
| 37 |
<Typography color="text.tertiary" variant="body2" align="center"> |
| 38 |
{ __( 'By clicking "Start building my website", I agree to install & activate the Elementor plugin. I accept the Elementor', 'hello-plus' ) } |
| 39 |
</Typography> |
| 40 |
<Link variant="body2" color="info.main" ml={ 1 } underline="hover" target="_blank" href="https://elementor.com/terms/"> |
| 41 |
{ __( 'Terms and Conditions', 'hello-plus' ) } |
| 42 |
</Link> |
| 43 |
</Stack> |
| 44 |
</Stack> |
| 45 |
</> |
| 46 |
|
| 47 |
); |
| 48 |
}; |
| 49 |
|
