PNSPS-frontend-MaterialUI/src/pages/iAmSmart/SuccessCallback/index.js

// material-ui
import {
    Grid,
    Typography,
    Stack,
} from '@mui/material';
import * as React from "react";

import Loadable from 'components/Loadable';
const LoadingComponent = Loadable(React.lazy(() => import('pages/extra-pages/LoadingComponent')));

import titleBackgroundImg from 'assets/images/dashboard/gazette-bar.png'
const BackgroundHead = {
    backgroundImage: `url(${titleBackgroundImg})`,
    width: '100%',
    height: '100%',
    backgroundSize: 'contain',
    backgroundRepeat: 'no-repeat',
    backgroundColor: '#0C489E',
    backgroundPosition: 'right'
}

// ==============================|| DASHBOARD - DEFAULT ||============================== //

const Index = () => {

    const [onReady, setOnReady] = React.useState(false);

    React.useEffect(() => {
        setOnReady(true);
    }, []);

    return (
        !onReady ?
            <LoadingComponent />
            :
            <Grid container sx={{ minHeight: '110vh', backgroundColor: '#fff' }} direction="column" justifyContent="flex-start" alignItems="center" >
                <Grid item xs={12} width="100%">
                    <div style={BackgroundHead} width="100%">
                        <Stack direction="row" height='70px'>
                            <Typography ml={15} color='#FFF' variant="h4" sx={{ pt: 2 }}>iAM Smart 成功登入</Typography>
                        </Stack>
                    </div>
                </Grid>
                {/*row 1*/}
                <Grid item xs={12} md={12} >
                    <Grid container justifyContent="flex-start" alignItems="center" >
                        <center>
                            <Grid item xs={12} md={12} >

                                <Typography variant="h3" sx={{ ml: 8, mt: 4, mr: 8, textAlign: "center" }}>
                                    iAM Smart 成功登入
                                </Typography>

                            </Grid>
                        </center>
                    </Grid>
                </Grid>
                {/*row 2*/}
            </Grid >
                

    );
};

export default Index;