import React from 'react';
import { useTheme } from '@mui/material/styles';

import {
  Avatar,
  Chip,
  Grid,
  Link,
  Table,
  TableBody,
  TableCell,
  TableContainer,
  TableHead,
  TableRow,
  Typography,
  CardContent,
  Skeleton,
  Stack,
  CardActions,
  Button,
  List
} from '@mui/material';
const TitleCard = ({ title }) => {
  const theme = useTheme();
  return (
    <Grid container spacing={2}>
      <CardActions
        sx={{
          position: 'sticky',
          top: '60px',
          // top:0,
          bgcolor: theme.palette.background.default,
          zIndex: 1,
          // borderBottom: `1px solid ${theme.palette.divider}`,
          width: '100%'
        }}
      >
        <Grid item xs={12}>
          <Stack direction={'row'} justifyContent={'space-between'} sx={{ p: 1 }}>
            <Typography variant="h3">{title}</Typography>
          </Stack>
        </Grid>
      </CardActions>
    </Grid>
  );
};

export default TitleCard;