accordion.html.twig

Same filename in other branches
  1. 3.x modules/js_example/templates/accordion.html.twig

Template file for js_example module.

File

modules/js_example/templates/accordion.html.twig

View source
  1. {#
  2. /**
  3. * @file
  4. * Template file for js_example module.
  5. */
  6. #}
  7. <div class="accordionWrapper">
  8. <div class="accordionItem open">
  9. <h2 class="accordionItemHeading">About accordions</h2>
  10. <div class="accordionItemContent">
  11. <p>JavaScript accordions let you squeeze a lot of content into a small space in a Web page.</p>
  12. <p>This simple accordion degrades gracefully in browsers that don't support JavaScript or CSS.</p>
  13. </div>
  14. </div>
  15. <div class="accordionItem close">
  16. <h2 class="accordionItemHeading">Accordion items</h2>
  17. <div class="accordionItemContent">
  18. <p>A JavaScript accordion is made up of a number of expandable/collapsible items. Only one item is ever shown at a time.</p>
  19. <p>You can include any content you want inside an accordion item. Here's a bullet list:</p>
  20. <ul>
  21. <li>List item #1</li>
  22. <li>List item #2</li>
  23. <li>List item #3</li>
  24. </ul>
  25. </div>
  26. </div>
  27. <div class="accordionItem close">
  28. <h2 class="accordionItemHeading">How to use a JavaScript accordion</h2>
  29. <div class="accordionItemContent">
  30. <p>Click an accordion item's heading to expand it. To collapse the item, click it again, or click another item heading.</p>
  31. </div>
  32. </div>
  33. </div>