25 lines
No EOL
877 B
PHP
25 lines
No EOL
877 B
PHP
<?php
|
|
$open = $open ?? false;
|
|
?>
|
|
<section class="collapsable" x-data="{
|
|
open: <?= var_export($open) ?>,
|
|
openSection(event) {
|
|
const section = event.target.closest('.collapsable')
|
|
section.querySelectorAll('[tabindex]').forEach(item => {
|
|
if (item.getAttribute('tabindex') == -1) {
|
|
item.setAttribute('tabindex', 0)
|
|
} else {
|
|
item.setAttribute('tabindex', -1)
|
|
}
|
|
})
|
|
this.open = !this.open
|
|
}
|
|
}">
|
|
<button class="toggle" :class="open ? 'open' : ''" @click="openSection($event)" :title="open ? 'fermer': 'ouvrir'" :aria-expanded="open ? true : false">
|
|
<h4><?= $title ?></h4>
|
|
<span class="arrow-right" :class="open ? 'open' : ''">→</span>
|
|
</button>
|
|
<div class="collapsable__content<?php e(isset($padding) && !$padding, ' no-padding') ?>" :class="open ? 'open' : ''">
|
|
<?= $slots->content() ?>
|
|
</div>
|
|
</section>
|