react-garden/src/pages/ui/cards/gamification/index.js

React + TypeScript + ThreeJS app using Material UI on NextJS, Apollo Client, GraphQL + WordPress REST APIs, for ThreeD web development.. a part of the threed.ai code family.

// ** MUI Imports
import Grid from '@mui/material/Grid'

// ** Demo Components Imports
import CardAward from '~/views/ui/cards/gamification/CardAward'
import CardWelcomeBack from '~/views/ui/cards/gamification/CardWelcomeBack'
import CardUpgradeAccount from '~/views/ui/cards/gamification/CardUpgradeAccount'
import CardCongratulations from '~/views/ui/cards/gamification/CardCongratulations'

const CardGamification = () => {
  return (
    <Grid container spacing={6}>
      <Grid item xs={12} md={4}>
        <CardAward />
      </Grid>
      <Grid item xs={12} md={8} sx={{ alignSelf: 'flex-end' }}>
        <CardCongratulations />
      </Grid>
      <Grid item xs={12} md={8} sx={{ alignSelf: 'flex-end' }}>
        <CardWelcomeBack />
      </Grid>
      <Grid item xs={12} md={4}>
        <CardUpgradeAccount />
      </Grid>
    </Grid>
  )
}

export default CardGamification