cronapp-framework-js/components/templates/accordion.template.html

Javascript library for CronApp's projects

<div class="panel-group" id="accordion-${RANDOM}" role="tablist" aria-multiselectable="true">
    <div class="panel panel-default">
        <div class="panel-heading" role="tab" id="headingOne" data-toggle="collapse" data-parent="#accordion-${RANDOM}" href="#collapseOne-${RANDOM}" aria-expanded="true" aria-controls="collapseOne-${RANDOM}">
            <div class="lead text-center" data-component="crn-title" xattr-position="text-center">
                <h1 class="text-center title component-holder h3" xattr-position="h1 text-center" xattr-type="h3" data-component="crn-text-component">Ungroup and change the component</h1>
            </div>
        </div>
        <div id="collapseOne-${RANDOM}" class="panel-collapse collapse in" role="tabpanel" aria-labelledby="headingOne">
            <div class="panel-body" data-container="true">
                <div class="lead text-center" data-component="crn-subtitle" xattr-position="text-center">
                    <h1 class="text-center title component-holder h3" xattr-position="h3 text-center" xattr-type="h3" data-component="crn-text-component">Ungroup and insert component</h1>
                </div>
            </div>
        </div>
    </div>
    <div class="panel panel-default">
        <div class="panel-heading collapsed" role="tab" id="headingTwo" data-toggle="collapse" data-parent="#accordion-${RANDOM}" href="#collapseTwo-${RANDOM}" aria-expanded="false" aria-controls="collapseTwo-${RANDOM}">
            <div class="lead text-center" data-component="crn-title" xattr-position="text-center">
                <h1 class="text-center title component-holder h3" xattr-position="h1 text-center" xattr-type="h3" data-component="crn-text-component">Ungroup and change the component</h1>
            </div>
        </div>
        <div id="collapseTwo-${RANDOM}" class="panel-collapse collapse" role="tabpanel" aria-labelledby="headingTwo">
            <div class="panel-body" data-container="true">
                <div class="lead text-center" data-component="crn-subtitle" xattr-position="text-center">
                    <h1 class="text-center title component-holder h3" xattr-position="h3 text-center" xattr-type="h3" data-component="crn-text-component">Ungroup and insert component</h1>
                </div>
            </div>
        </div>
    </div>
    <div class="panel panel-default">
        <div class="panel-heading collapsed" role="tab" id="headingThree" data-toggle="collapse" data-parent="#accordion-${RANDOM}" href="#collapseThree-${RANDOM}" aria-expanded="false" aria-controls="collapseThree-${RANDOM}">
            <div class="lead text-center" data-component="crn-title" xattr-position="text-center">
                <h1 class="text-center title component-holder h3" xattr-position="h1 text-center" xattr-type="h3" data-component="crn-text-component">Ungroup and change the component</h1>
            </div>
        </div>
        <div id="collapseThree-${RANDOM}" class="panel-collapse collapse" role="tabpanel" aria-labelledby="headingThree">
            <div class="panel-body" data-container="true">
                <div class="lead text-center" data-component="crn-subtitle" xattr-position="text-center">
                    <h1 class="text-center title component-holder h3" xattr-position="h3 text-center" xattr-type="h3" data-component="crn-text-component">Ungroup and insert component</h1>
                </div>
            </div>
        </div>
    </div>
</div>