Estoy tratando de que el componente Accordion MUI NO se mueva y NO aplique los márgenes superior e inferior a los elementos de resumen mientras está en el modo expandido. Agrego este código al elemento de resumen pero eso no funciona. que me ofreces cabe mencionar que funciona en el primer acordeón pero no en los demás!!!!!!!!!!!
sx={{ "&.Mui-expanded": { minHeight: 0, margin: '12px 0', }, "& .MuiAccordionSummary-content.Mui-expanded": { margin: 0, } }}Usé el acordeón personalizado de MUI y le cambié la configuración: usé mi ícono. tiene un fondo blanco y sin borde y relleno o margen adicional :))))
export const Accordion = styled((props: AccordionProps) => ( <MuiAccordion disableGutters elevation={0} square {...props} /> ))(({ theme }) => ({ position: 'unset', border: 'none', boxShadow: 'none', maxWidth: 720, margin: '12 0', '&:before': { display: 'none', border: 'none' } })); export const AccordionSummary = styled((props: AccordionSummaryProps) => ( <MuiAccordionSummary expandIcon={<ExpandMoreIcon />} {...props} /> ))(({ theme }) => ({ backgroundColor: 'white', padding: 0, flexDirection: 'row', '& .MuiAccordionSummary-expandIconWrapper.Mui-expanded': { transform: 'rotate(180deg)' } })); export const AccordionDetails = styled(MuiAccordionDetails)(({ theme }) => ({ padding: 0, border: 'none' })); export const FAQText = styled(Typography)({ maxWidth: 628 });¿Está configurando este accesorio en Accordion o AccordionSummary ? Probé su código en StackBlitz configurándolo en el elemento Accordion y funcionó correctamente.