Files
irma-website/_includes/block-irma-faq.html
2020-02-19 14:36:05 +01:00

42 lines
1.3 KiB
HTML

<section class="block block-faq-1">
<div class="container">
<div class="destination" id="{% t section.id %}"></div>
<div class="columns">
<div class="column">
<h2><span class="light center">{% t section.headline %}</span></h2>
{% for faq_item in section.faq_items %}
<button class="collapsible">{% t faq_item.question %}</button>
<div class="content faq-item">
<p>{% t faq_item.answer %}</p>
</div>
{% endfor %}
</div>
</div>
</div>
</section>
<script>
let coll = document.getElementsByClassName("collapsible");
let i;
for (i = 0; i < coll.length; i++) {
coll[i].addEventListener("click", function () {
this.classList.toggle("open");
let content = this.nextElementSibling;
if (content.style.maxHeight) {
content.style.maxHeight = null;
content.style.paddingTop = "0px";
content.style.paddingBottom = "0px";
content.style.marginTop = "0px";
content.style.marginBottom = "0px";
} else {
content.style.maxHeight = content.scrollHeight + 20 + "px";
content.style.paddingTop = "10px";
content.style.paddingBottom = "10px";
content.style.marginTop = "10px";
content.style.marginBottom = "10px";
}
});
}
</script>