Amélioration des modaux

Fix #47
This commit is contained in:
Jean-Marie Favreau 2023-12-17 17:03:48 +01:00
parent 673f84af93
commit 817e360fba
4 changed files with 11 additions and 2 deletions

View File

@ -27,7 +27,6 @@ const selectAllFilterElementsFromCheckbox = (checkbox) => {
}; };
const setFilterClasses = (container) => { const setFilterClasses = (container) => {
console.log("set filter");
if (!underToggle) { if (!underToggle) {
underToggle = true; underToggle = true;
selectionButtom = document.getElementById(container.getAttribute("data-button")); selectionButtom = document.getElementById(container.getAttribute("data-button"));

View File

@ -20,6 +20,10 @@ const openModal = (modal) => {
document.documentElement.style.setProperty("--scrollbar-width", `${getScrollbarWidth()}px`); document.documentElement.style.setProperty("--scrollbar-width", `${getScrollbarWidth()}px`);
} }
modal.setAttribute("open", true); modal.setAttribute("open", true);
console.log("visible, " + modal);
setTimeout(function() {
visibleModal = modal;
}, 500);
}; };
// Close modal // Close modal
@ -32,6 +36,7 @@ const closeModal = (modal) => {
// Close with a click outside // Close with a click outside
document.addEventListener("click", (event) => { document.addEventListener("click", (event) => {
if (visibleModal != null) { if (visibleModal != null) {
console.log("bordel");
const modalContent = visibleModal.querySelector("article"); const modalContent = visibleModal.querySelector("article");
const isClickInside = modalContent.contains(event.target); const isClickInside = modalContent.contains(event.target);
!isClickInside && closeModal(visibleModal); !isClickInside && closeModal(visibleModal);

View File

@ -626,3 +626,8 @@ aside nav a.badge {
z-index: 1; z-index: 1;
margin-top: -2em; margin-top: -2em;
} }
.body-fixed {
max-height: 50vh;
overflow-y: scroll;
}

View File

@ -24,7 +24,7 @@
</p> </p>
</header> </header>
<p>{{ event.description |truncatewords:20 |linebreaks }}</p> <div class="body-fixed">{{ event.description |linebreaks }}</div>
<p> <p>