CODEWITHSUNDEEP
reactjsmaterial-uiaccordion
Aswath
Aswath

Reputation: 986

MUI Accordion at the bottom of the window

I'm looking for an material react expandable that stays on footer and opens when clicked from bottom to top.

All the material accordions / collapsible expand from top to bottom which make the page grow. Example : https://materializecss.com/collapsible.html

I was able to find something similar using HTML and JS, but looking for out of box react / material components.

Upvotes: 2

Views: 4819

Answers (1)

NearHuscarl
NearHuscarl

Reputation: 81370

Looks like you want the Accordion component. To make it stick at the bottom, set the position to fixed and bottom to 0.

<Accordion
  sx={{
    position: 'fixed',
    bottom: 0,
  }}
>
  <AccordionSummary>
    {...}
  </AccordionSummary>
  <AccordionDetails>
    {...}
  </AccordionDetails>
</Accordion>

Codesandbox Demo

Upvotes: 1

Related Questions