alternating mui grid

gistfile1.txt

export default function Alternate({
  reverse,
}) {
  const classes = useStyles();
  return (
    <Grid container spacing={4} alignItems="center" className={classes.root}>
      <Box clone order={{ sm: 1, ...(reverse ? { md: 2 } : {}) }}>
        <Grid item sm={12} md={6} style={{ textAlign: "center" }}>
        </Grid>
      </Box>
      <Box clone order={{ sm: 2, ...(reverse ? { md: 1 } : {}) }}>
        <Grid item sm={12} md={6}>
        </Grid>
      </Box>
    </Grid>
  );
}