diff --git a/index.html b/index.html index 678f600..b686293 100644 --- a/index.html +++ b/index.html @@ -117,6 +117,10 @@ +
diff --git a/public/css/style.css b/public/css/style.css index 3bcb64e..00d3333 100644 --- a/public/css/style.css +++ b/public/css/style.css @@ -932,6 +932,13 @@ GANTT background: var(--gantt-bg); border: 1px solid var(--border); border-radius: 8px; + transition: height 0.3s ease; +} + +.gantt-container.expanded { + height: auto; + max-height: none; + overflow-y: visible; } /* Ligne du temps (Header) */ diff --git a/public/js/script.js b/public/js/script.js index 82d3ae3..609db12 100644 --- a/public/js/script.js +++ b/public/js/script.js @@ -5,6 +5,7 @@ let customFieldsMap = []; let lastUsername = ''; let lastApiToken = ''; let currentGanttView = 'month'; +let isGanttExpanded = false; let currentSortCol = null; let isAsc = true; @@ -334,6 +335,38 @@ function setGanttView(view) { renderRoadmap(); } +function toggleGanttExpand() { + isGanttExpanded = !isGanttExpanded; + updateGanttExpandState(); +} + +function updateGanttExpandState() { + const container = document.querySelector('.gantt-container'); + const icon = document.getElementById('ganttExpandIcon'); + const label = document.getElementById('ganttExpandLabel'); + const btn = document.getElementById('ganttExpandBtn'); + + if (container) { + if (isGanttExpanded) { + container.classList.add('expanded'); + } else { + container.classList.remove('expanded'); + } + } + + if (icon && label) { + if (isGanttExpanded) { + icon.className = 'fa-solid fa-down-left-and-up-right-to-center'; + label.textContent = 'Replier'; + if (btn) btn.classList.add('active'); + } else { + icon.className = 'fa-solid fa-up-right-and-down-left-from-center'; + label.textContent = 'Déplier'; + if (btn) btn.classList.remove('active'); + } + } +} + // --- FONCTIONS UTILITAIRES POUR LE GANTT --- /** @@ -458,7 +491,7 @@ function renderRoadmap() { }, {}); // Début HTML - let html = `
`; + let html = `
`; // Ligne "Aujourd'hui" const todayX = getXPos(new Date());