css actus
This commit is contained in:
		
										
											
												File diff suppressed because one or more lines are too long
											
										
									
								
							@@ -1594,9 +1594,6 @@ footer {
 | 
			
		||||
  padding-right: 0.3rem;
 | 
			
		||||
  padding-bottom: 0.2rem;
 | 
			
		||||
}
 | 
			
		||||
#actus-caroussel .content-actus .views-row article.node-type-actualite .infos-actu {
 | 
			
		||||
  order: 2;
 | 
			
		||||
}
 | 
			
		||||
#actus-caroussel .content-actus .views-row article.node-type-actualite .field_field_date {
 | 
			
		||||
  color: red;
 | 
			
		||||
  display: inline-flex;
 | 
			
		||||
@@ -1609,7 +1606,6 @@ footer {
 | 
			
		||||
  padding-right: 0.3rem;
 | 
			
		||||
}
 | 
			
		||||
#actus-caroussel .content-actus .views-row article.node-type-actualite .field_title {
 | 
			
		||||
  order: 3;
 | 
			
		||||
  padding-top: 0.2rem;
 | 
			
		||||
}
 | 
			
		||||
#actus-caroussel .content-actus .views-row article.node-type-actualite .field_title h2 {
 | 
			
		||||
@@ -1622,7 +1618,6 @@ footer {
 | 
			
		||||
  color: rgb(7, 50, 194);
 | 
			
		||||
}
 | 
			
		||||
#actus-caroussel .content-actus .views-row article.node-type-actualite .field_body {
 | 
			
		||||
  order: 4;
 | 
			
		||||
  opacity: 1 !important;
 | 
			
		||||
  transform: none !important;
 | 
			
		||||
  font-family: "gilroy-regular";
 | 
			
		||||
@@ -1632,9 +1627,6 @@ footer {
 | 
			
		||||
  margin-bottom: 1rem;
 | 
			
		||||
  font-size: 0.7rem;
 | 
			
		||||
}
 | 
			
		||||
#actus-caroussel .content-actus .views-row article.node-type-actualite .field_field_liens {
 | 
			
		||||
  order: 5;
 | 
			
		||||
}
 | 
			
		||||
#actus-caroussel .content-actus .views-row:nth-child(odd) {
 | 
			
		||||
  position: relative;
 | 
			
		||||
  top: 60px;
 | 
			
		||||
@@ -1912,9 +1904,6 @@ body {
 | 
			
		||||
    transform: scale(1.3);
 | 
			
		||||
  }
 | 
			
		||||
}
 | 
			
		||||
#home .content_container #block-quartiers-de-demain-titredepage {
 | 
			
		||||
  display: none;
 | 
			
		||||
}
 | 
			
		||||
#home .paragraph--type--static-parts {
 | 
			
		||||
  padding-top: 4rem;
 | 
			
		||||
  padding-bottom: 2rem;
 | 
			
		||||
 
 | 
			
		||||
@@ -232,7 +232,6 @@
 | 
			
		||||
      chapeau :  document.querySelectorAll('.field_body'),
 | 
			
		||||
      paragraph: document.querySelectorAll('.field_field_textes .paragraph--type--static-parts'),
 | 
			
		||||
      enjeux : document.querySelectorAll('.field_field_textes .paragraph--type--static-parts .enjeux'),
 | 
			
		||||
      live : document.querySelectorAll('#live-youtube'),
 | 
			
		||||
      // mapHome : document.querySelectorAll('.field_field_map_block #block-sitesmapblock'),
 | 
			
		||||
      // mapSite : document.querySelectorAll('#sites-map-container'),
 | 
			
		||||
      lienDoc : document.querySelectorAll('.field_field_documents'),
 | 
			
		||||
@@ -386,7 +385,6 @@
 | 
			
		||||
    });
 | 
			
		||||
  });
 | 
			
		||||
 | 
			
		||||
 | 
			
		||||
  
 | 
			
		||||
 | 
			
		||||
 //////////// start slideshow home  ////////////////////////// 
 | 
			
		||||
@@ -703,6 +701,91 @@ document.addEventListener("DOMContentLoaded", function () {
 | 
			
		||||
});
 | 
			
		||||
 | 
			
		||||
 | 
			
		||||
//////////////////////////////////////////
 | 
			
		||||
 | 
			
		||||
 | 
			
		||||
/////////// Start script ressources ////////////////////////////////
 | 
			
		||||
 | 
			
		||||
document.addEventListener("DOMContentLoaded", () => {
 | 
			
		||||
    const view = document.querySelector(".view");
 | 
			
		||||
    const elements = Array.from(view.children);
 | 
			
		||||
 | 
			
		||||
    let newView = document.createElement("div");
 | 
			
		||||
    newView.classList.add("view");
 | 
			
		||||
 | 
			
		||||
    let group = null;
 | 
			
		||||
    let groupContent = null;
 | 
			
		||||
 | 
			
		||||
    elements.forEach((el) => {
 | 
			
		||||
        if (el.tagName === "H3") {
 | 
			
		||||
            if (group) {
 | 
			
		||||
                newView.appendChild(group);
 | 
			
		||||
            }
 | 
			
		||||
 | 
			
		||||
            group = document.createElement("div");
 | 
			
		||||
            group.classList.add("group");
 | 
			
		||||
 | 
			
		||||
            groupContent = document.createElement("div");
 | 
			
		||||
            groupContent.classList.add("group-content");
 | 
			
		||||
 | 
			
		||||
            groupContent.appendChild(el);
 | 
			
		||||
            group.appendChild(groupContent);
 | 
			
		||||
        } else if (el.classList.contains("views-row")) {
 | 
			
		||||
            groupContent.appendChild(el);
 | 
			
		||||
        }
 | 
			
		||||
    });
 | 
			
		||||
 | 
			
		||||
    if (group) {
 | 
			
		||||
        newView.appendChild(group);
 | 
			
		||||
    }
 | 
			
		||||
 | 
			
		||||
    view.replaceWith(newView);
 | 
			
		||||
 | 
			
		||||
    // Ajouter un bouton "Voir plus" dans chaque groupe
 | 
			
		||||
    document.querySelectorAll(".group").forEach((group) => {
 | 
			
		||||
        const rows = group.querySelectorAll(".views-row");
 | 
			
		||||
        const button = document.createElement("button");
 | 
			
		||||
        button.classList.add("toggle-btn");
 | 
			
		||||
        button.textContent = "Voir plus de";
 | 
			
		||||
 | 
			
		||||
        rows.forEach((row, index) => {
 | 
			
		||||
            if (index >= 3) {
 | 
			
		||||
                row.classList.add("hidden");
 | 
			
		||||
                row.style.maxHeight = "0";
 | 
			
		||||
                row.style.opacity = "0";
 | 
			
		||||
            }
 | 
			
		||||
        });
 | 
			
		||||
 | 
			
		||||
        button.addEventListener("click", () => {
 | 
			
		||||
            const isExpanded = button.textContent === "Voir moins de";
 | 
			
		||||
            const hiddenRows = group.querySelectorAll(".views-row.hidden");
 | 
			
		||||
 | 
			
		||||
            if (isExpanded) {
 | 
			
		||||
                // Cacher les lignes avec un délai pour l'effet de transition
 | 
			
		||||
                hiddenRows.forEach((row) => {
 | 
			
		||||
                    row.style.maxHeight = "0";
 | 
			
		||||
                    row.style.opacity = "0";
 | 
			
		||||
                    setTimeout(() => row.classList.add("hidden"), 500); // Délai pour la transition
 | 
			
		||||
                });
 | 
			
		||||
            } else {
 | 
			
		||||
                // Afficher les lignes
 | 
			
		||||
                hiddenRows.forEach((row) => {
 | 
			
		||||
                    row.classList.remove("hidden");
 | 
			
		||||
                    row.style.maxHeight = row.scrollHeight + "px";
 | 
			
		||||
                    row.style.opacity = "1";
 | 
			
		||||
                });
 | 
			
		||||
            }
 | 
			
		||||
 | 
			
		||||
            button.textContent = isExpanded ? "Voir plus de" : "Voir moins de";
 | 
			
		||||
        });
 | 
			
		||||
 | 
			
		||||
        group.appendChild(button);
 | 
			
		||||
    });
 | 
			
		||||
});
 | 
			
		||||
 | 
			
		||||
 | 
			
		||||
/////////// end script ressources ////////////////////////////////
 | 
			
		||||
 | 
			
		||||
})(jQuery, window);
 | 
			
		||||
 | 
			
		||||
 | 
			
		||||
 
 | 
			
		||||
@@ -52,7 +52,7 @@
 | 
			
		||||
    }
 | 
			
		||||
    .content_container{
 | 
			
		||||
        #block-quartiers-de-demain-titredepage{
 | 
			
		||||
            display: none;
 | 
			
		||||
            // display: none;
 | 
			
		||||
        }
 | 
			
		||||
    }
 | 
			
		||||
    .paragraph--type--static-parts{
 | 
			
		||||
 
 | 
			
		||||
@@ -99,7 +99,7 @@
 | 
			
		||||
                    }
 | 
			
		||||
                }
 | 
			
		||||
                .infos-actu{
 | 
			
		||||
                    order: 2;
 | 
			
		||||
                    // order: 2;
 | 
			
		||||
                }
 | 
			
		||||
                .field_field_date{
 | 
			
		||||
                    
 | 
			
		||||
@@ -117,7 +117,7 @@
 | 
			
		||||
            
 | 
			
		||||
 | 
			
		||||
                .field_title{
 | 
			
		||||
                    order: 3;
 | 
			
		||||
                    // order: 3;
 | 
			
		||||
                    padding-top: 0.2rem;
 | 
			
		||||
                    h2{
 | 
			
		||||
                        margin: 0;
 | 
			
		||||
@@ -130,7 +130,7 @@
 | 
			
		||||
                    } 
 | 
			
		||||
                }
 | 
			
		||||
                .field_body{
 | 
			
		||||
                    order: 4;
 | 
			
		||||
                    // order: 4;
 | 
			
		||||
                    // visibility: visible;
 | 
			
		||||
                    opacity: 1 !important;
 | 
			
		||||
                    transform: none !important;
 | 
			
		||||
@@ -142,7 +142,7 @@
 | 
			
		||||
                    }
 | 
			
		||||
                }
 | 
			
		||||
                .field_field_liens{
 | 
			
		||||
                    order: 5;
 | 
			
		||||
                    // order: 5;
 | 
			
		||||
                }
 | 
			
		||||
            }
 | 
			
		||||
 | 
			
		||||
 
 | 
			
		||||
		Reference in New Issue
	
	Block a user