There are no notes for this item.

<div id="Page10" class="ContentBlock accordion Page10">
    <ul id="accordion-group" role="presentation" class="accordion-group" data-allow-toggle>
        <li id="Page1" class="accordion-item">
            <div role="heading" aria-level="2">
                <button aria-expanded="false" class="accordion-heading" aria-controls="panel-1" id="heading-1" type="button">
                        <div class="accordion-title">
                            Accordion 1
                        </div>
                        <div class="accordion-icon">
                            <svg xmlns="http://www.w3.org/2000/svg" width="12" height="8" viewBox="0 0 12 8">
                                <g fill="none" fill-rule="evenodd" transform="translate(-6 -8)">
                                    <path class="arrow" fill="#000" fill-rule="nonzero" d="m16.59 8.59-4.59 4.58-4.59-4.58-1.41 1.41 6 6 6-6z" />
                                    <path d="m0 0h24v24h-24z" />
                                </g>
                            </svg>
                        </div>
                    </button>
            </div>
            <div id="panel-1" role="region" aria-labelledby="heading-1" class="accordion-panel" hidden>
                <article class="ContentBlock Feature Horz Page10">
                    <h2>
                        <a href="https://www.missouristate.edu">
            <img src="https://placehold.it/700x394" alt="">
            <span class="FeatureHeading">Lorem ipsum dolor sit amet consectetur</span>
        </a>
                    </h2>
                    <p>
                        Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam quam lectus, pretium eget massa nunc.
                    </p>
                </article>
            </div>
        </li>
        <li id="Page2" class="accordion-item">
            <div role="heading" aria-level="2">
                <button aria-expanded="false" class="accordion-heading" aria-controls="panel-2" id="heading-2" type="button">
                        <div class="accordion-title">
                            Accordion 2
                        </div>
                        <div class="accordion-icon">
                            <svg xmlns="http://www.w3.org/2000/svg" width="12" height="8" viewBox="0 0 12 8">
                                <g fill="none" fill-rule="evenodd" transform="translate(-6 -8)">
                                    <path class="arrow" fill="#000" fill-rule="nonzero" d="m16.59 8.59-4.59 4.58-4.59-4.58-1.41 1.41 6 6 6-6z" />
                                    <path d="m0 0h24v24h-24z" />
                                </g>
                            </svg>
                        </div>
                    </button>
            </div>
            <div id="panel-2" role="region" aria-labelledby="heading-2" class="accordion-panel" hidden>
                Lorem ipsum dolor sit amet consectetur, adipisicing elit. Labore vitae dicta odio debitis sint, modi vel quasi veritatis? Fugit eum aspernatur dolor corporis maxime impedit perferendis aperiam odio deserunt. Ipsa?
            </div>
        </li>
        <li id="Page3" class="accordion-item">
            <div role="heading" aria-level="2">
                <button aria-expanded="false" class="accordion-heading" aria-controls="panel-3" id="heading-3" type="button">
                        <div class="accordion-title">
                            Accordion 3
                        </div>
                        <div class="accordion-icon">
                            <svg xmlns="http://www.w3.org/2000/svg" width="12" height="8" viewBox="0 0 12 8">
                                <g fill="none" fill-rule="evenodd" transform="translate(-6 -8)">
                                    <path class="arrow" fill="#000" fill-rule="nonzero" d="m16.59 8.59-4.59 4.58-4.59-4.58-1.41 1.41 6 6 6-6z" />
                                    <path d="m0 0h24v24h-24z" />
                                </g>
                            </svg>
                        </div>
                    </button>
            </div>
            <div id="panel-3" role="region" aria-labelledby="heading-3" class="accordion-panel" hidden>
                Lorem ipsum dolor sit amet consectetur, adipisicing elit. Labore vitae dicta odio debitis sint, modi vel quasi veritatis? Fugit eum aspernatur dolor corporis maxime impedit perferendis aperiam odio deserunt. Ipsa?
            </div>
        </li>
    </ul>
</div>

<script type="text/javascript">
    missouristate.requireScript("../../scripts/components/collapsible.js", false);
</script>
<div id="Page{{pageId}}" class="ContentBlock accordion Page{{pageId}}">
    <ul id="accordion-group" role="presentation" class="accordion-group" data-allow-toggle {{#if allowMultiple}} data-allow-multiple {{/if}}>
        {{#each item}}
            <li id="Page{{pageId}}" class="accordion-item">
                <div role="heading" aria-level="2">
                    <button aria-expanded="false" class="accordion-heading" aria-controls="panel-{{pageId}}" id="heading-{{pageId}}" type="button">
                        <div class="accordion-title">
                            {{heading}}
                        </div>
                        <div class="accordion-icon">
                            <svg xmlns="http://www.w3.org/2000/svg" width="12" height="8" viewBox="0 0 12 8">
                                <g fill="none" fill-rule="evenodd" transform="translate(-6 -8)">
                                    <path class="arrow" fill="#000" fill-rule="nonzero" d="m16.59 8.59-4.59 4.58-4.59-4.58-1.41 1.41 6 6 6-6z" />
                                    <path d="m0 0h24v24h-24z" />
                                </g>
                            </svg>
                        </div>
                    </button>
                </div>
                <div id="panel-{{pageId}}" role="region" aria-labelledby="heading-{{pageId}}" class="accordion-panel" hidden>
                    {{#> container}}{{{container}}}{{/container}}
                </div>
            </li>
        {{/each}}
    </ul>
</div>

<script type="text/javascript">
    missouristate.requireScript("{{path '/scripts/components/collapsible.js'}}", false);

</script>
{
  "pageId": 10,
  "allowMultiple": null,
  "item": [
    {
      "pageId": 1,
      "heading": "Accordion 1",
      "container": "<article class=\"ContentBlock Feature Horz Page10\">\n    <h2>\n        <a href=\"https://www.missouristate.edu\">\n            <img src=\"https://placehold.it/700x394\" alt=\"\">\n            <span class=\"FeatureHeading\">Lorem ipsum dolor sit amet consectetur</span>\n        </a>\n    </h2>\n    <p>\n        Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam quam lectus, pretium eget massa nunc.\n    </p>\n</article>"
    },
    {
      "pageId": 2,
      "heading": "Accordion 2",
      "container": "Lorem ipsum dolor sit amet consectetur, adipisicing elit. Labore vitae dicta odio debitis sint, modi vel quasi veritatis? Fugit eum aspernatur dolor corporis maxime impedit perferendis aperiam odio deserunt. Ipsa?"
    },
    {
      "pageId": 3,
      "heading": "Accordion 3",
      "container": "Lorem ipsum dolor sit amet consectetur, adipisicing elit. Labore vitae dicta odio debitis sint, modi vel quasi veritatis? Fugit eum aspernatur dolor corporis maxime impedit perferendis aperiam odio deserunt. Ipsa?"
    }
  ]
}