Tailwind CSS Accordion - Taco Vue

The Accordion allows the user to show and hide sections of related content on a page. There are many ways to use this component, like displaying a list of FAQs, showing various menus and submenus, displaying the locations of a particular company, and more. Below we are presenting an example of the Accordion component that you can use in your Taco project. 


<AccordionContainer :multiple="radioElements[0].vueModel">
  <Accordion 
    :disabled="false"
    :animation="false"
  >
    <AccordionHeader
    >
        As we live, our hearts turn colder
    </AccordionHeader>

    <AccordionBody>
        Cause pain is what we go through as we become older. We get insulted by others, lose trust for those others. We get back stabbed by friends. It becomes harder for us to give others a hand. We get our heart broken by people we love, even that we give them all we have. Then we lose family over time. What else could rust the heart more over time? Blackgold.
    </AccordionBody>
  </Accordion>
  <Accordion 
    :disabled="false"
    :animation="false"
  >
    <AccordionHeader
    >
        As we live, our hearts turn colder
    </AccordionHeader>

    <AccordionBody>
        Cause pain is what we go through as we become older. We get insulted by others, lose trust for those others. We get back stabbed by friends. It becomes harder for us to give others a hand. We get our heart broken by people we love, even that we give them all we have. Then we lose family over time. What else could rust the heart more over time? Blackgold.
    </AccordionBody>
  </Accordion>
</AccordionContainer>