<Grid
  container
  columns={{ xs: 1, lg: 2 }}
  spacing={4}
  alignItems="center"
  justifyContent="center"
>
  <Grid item>
    <DateCalendar defaultValue={today} disableFuture />
  </Grid>
  <Grid item>
    <TimeClock defaultValue={twoPM} maxTime={threePM} />
  </Grid>
</Grid>