38 lines
1.2 KiB
TypeScript
38 lines
1.2 KiB
TypeScript
import { CardContent, Typography, Divider, List, ListItem, ListItemText, Paper, Box, IconButton } from "@mui/material";
|
|
|
|
|
|
import MoreVertIcon from '@mui/icons-material/MoreVert';
|
|
|
|
export const SectionCard = ({ title, icon, items }) => (
|
|
<Paper elevation={3} sx={{ padding: 2, margin: 2, display: 'flex', flexDirection: 'column' }}>
|
|
<CardContent>
|
|
<Box sx={{ display: 'flex', justifyContent: 'space-between', mb: 2 }}>
|
|
<Box sx={{ display: 'flex' }}>
|
|
{icon}
|
|
<Typography variant="subtitle1" fontWeight="bold">{title}</Typography>
|
|
</Box>
|
|
<Box sx={{ display: 'flex', alignItems: 'center', gap: 1 }}>
|
|
<IconButton size="small">
|
|
<MoreVertIcon fontSize="small" />
|
|
</IconButton>
|
|
</Box>
|
|
</Box >
|
|
<Divider />
|
|
<List dense disablePadding>
|
|
{items.map((item, index) => (
|
|
<ListItem key={index} disableGutters>
|
|
<ListItemText
|
|
primary={item.title}
|
|
secondary={item.date}
|
|
primaryTypographyProps={{ fontSize: 14 }}
|
|
secondaryTypographyProps={{ fontSize: 12 }}
|
|
/>
|
|
</ListItem>
|
|
))}
|
|
</List>
|
|
</CardContent>
|
|
</Paper>
|
|
);
|
|
|
|
|