41 lines
No EOL
1.4 KiB
HTML
41 lines
No EOL
1.4 KiB
HTML
{{ define "main" }}
|
|
|
|
<h1>Blog</h1>
|
|
<div id="accordion" class="divide-y divide-gray-200">
|
|
{{ range $index, $page := .Data.Pages }}
|
|
<div class="accordion-item">
|
|
<h2 class="accordion-header mb-0" style="padding:0!important;">
|
|
<button class="accordion-button relative flex items-center w-full py-4 px-5 text-left text-gray-800 bg-gray-100 focus:outline-none" type="button">
|
|
<i class="verua-icon far text-primary fa-bullhorn"></i> {{ .Title }}
|
|
</button>
|
|
</h2>
|
|
<div class="accordion-collapse hidden">
|
|
<div class="accordion-body py-4 px-5">
|
|
{{ .Content }}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
{{ end }}
|
|
</div>
|
|
|
|
<script>
|
|
document.addEventListener('DOMContentLoaded', () => {
|
|
const accordionButtons = document.querySelectorAll('.accordion-button');
|
|
|
|
accordionButtons.forEach(button => {
|
|
button.addEventListener('click', () => {
|
|
const accordionCollapse = button.parentElement.nextElementSibling;
|
|
|
|
button.classList.toggle('active');
|
|
if (button.classList.contains('active')) {
|
|
button.parentElement.nextElementSibling.classList.remove('hidden');
|
|
accordionCollapse.style.maxHeight = accordionCollapse.scrollHeight + 'px';
|
|
} else {
|
|
accordionCollapse.style.maxHeight = null;
|
|
button.parentElement.nextElementSibling.classList.add('hidden');
|
|
}
|
|
});
|
|
});
|
|
});
|
|
</script>
|
|
{{ end}} |