css actus
This commit is contained in:
parent
08f405aaa5
commit
1c09ac0a55
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'),
|
||||
@ -388,7 +387,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;
|
||||
}
|
||||
}
|
||||
|
||||
|
Loading…
x
Reference in New Issue
Block a user