studio-variable/index-soutien
4
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Fix : inversion des onglets du pad de donation
All checks were successful
Deploy / Deploy to Production (push) Successful in 11s
Details

Browse source 
Les boutons d'onglets étaient associés aux containers par index,
mais l'ordre dans le DOM était inversé (one-off avant monthly).
Correction via data-tab sur les boutons pour un lien explicite.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
isUnknown 2026-04-15 07:30:59 +02:00
parent 4c4a96df1e
commit 25fe91ea93
3 changed files with 14 additions and 10 deletions
Download patch file Download diff file Expand all files Collapse all files

16
assets/js/donation.js
View file

@ -74,17 +74,21 @@
function initTabs() { function initTabs() {
const tabButtons = document.querySelectorAll('.nav--tabs__btn'); const tabButtons = document.querySelectorAll('.nav--tabs__btn');
const containers = document.querySelectorAll('.donation-grid');
tabButtons.forEach((button, index) => { tabButtons.forEach((button) => {
button.addEventListener('click', () => { button.addEventListener('click', () => {
tabButtons.forEach((btn) => btn.classList.remove('is-selected')); const target = button.dataset.tab;
containers.forEach((container) => const container = document.querySelector(
container.classList.remove('is-selected') `.donation-grid[data-donation="${target}"]`
); );
tabButtons.forEach((btn) => btn.classList.remove('is-selected'));
document
.querySelectorAll('.donation-grid')
.forEach((c) => c.classList.remove('is-selected'));
button.classList.add('is-selected'); button.classList.add('is-selected');
containers[index].classList.add('is-selected'); container.classList.add('is-selected');
}); });
}); });
} }

4
en/index.php
View file

@ -131,8 +131,8 @@ $data = getContent('en');
<div class="col-right"> <div class="col-right">
<section id="section__donation"> <section id="section__donation">
<nav class="nav--tabs"> <nav class="nav--tabs">
<button class="nav--tabs__btn is-selected">Monthly donation</button> <button class="nav--tabs__btn is-selected" data-tab="monthly">Monthly donation</button>
<button class="nav--tabs__btn">One-time donation</button> <button class="nav--tabs__btn" data-tab="one-off">One-time donation</button>
</nav> </nav>
<div data-donation="one-off" class="donation-grid"> <div data-donation="one-off" class="donation-grid">

4
index.php
View file

@ -131,8 +131,8 @@ $data = getContent('fr');
<div class="col-right"> <div class="col-right">
<section id="section__donation"> <section id="section__donation">
<nav class="nav--tabs"> <nav class="nav--tabs">
<button class="nav--tabs__btn is-selected">Je donne tous les mois</button> <button class="nav--tabs__btn is-selected" data-tab="monthly">Je donne tous les mois</button>
<button class="nav--tabs__btn">Je donne une fois</button> <button class="nav--tabs__btn" data-tab="one-off">Je donne une fois</button>
</nav> </nav>
<div data-donation="one-off" class="donation-grid"> <div data-donation="one-off" class="donation-grid">