53 lines
1.2 KiB
React
53 lines
1.2 KiB
React
import React from 'react';
|
|
import {
|
|
Grid,
|
|
Accordion,
|
|
AccordionSummary,
|
|
AccordionDetails,
|
|
Typography,
|
|
} from '@mui/material';
|
|
import MainCard from 'components/main-card/MainCard';
|
|
import ExpandMoreIcon from '@mui/icons-material/ExpandMore';
|
|
|
|
const MainAccordion = ({items, title}) => {
|
|
return (
|
|
<Accordion
|
|
defaultExpanded
|
|
TransitionProps={{ unmountOnExit: true }}
|
|
sx={{ background: 'transparent' }}>
|
|
<AccordionSummary
|
|
expandIcon={<ExpandMoreIcon />}
|
|
aria-controls='panel1a-content'
|
|
id='panel1a-header'>
|
|
<Typography variant='h5'>{ title }</Typography>
|
|
</AccordionSummary>
|
|
<AccordionDetails>
|
|
<Grid
|
|
container
|
|
direction='row'
|
|
alignItems='flex-start'
|
|
justifyContent='baseline'
|
|
spacing={3}>
|
|
{items.map((project) => (
|
|
<Grid
|
|
item
|
|
xs={12}
|
|
sm={6}
|
|
md={4}
|
|
key={project.title}
|
|
sx={{ alignItems: 'center', justifyContent: 'center' }}>
|
|
<MainCard
|
|
imageURL={project.imageURL}
|
|
title={project.title}
|
|
description={project.description}
|
|
/>
|
|
</Grid>
|
|
))}
|
|
</Grid>
|
|
</AccordionDetails>
|
|
</Accordion>
|
|
);
|
|
};
|
|
|
|
export default MainAccordion;
|