Home node actu cliquable pur toggle

web/themes/custom/quartiers_de_demain/dist/assets/bundle.js

@@ -485,61 +485,79 @@ $(document).ready(function () {
 
 /////////////////// start voir plus...  actualite dans /actualites & /home ////////////////////
 
-  if ($("#actualites" ).length > 0 || $("#home").length > 0)  {
-    $(".node-type-actualite").each(function () {
-      let article = $(this);
+if ($("#actualites").length > 0 || $("#home").length > 0)  {
+  $(".node-type-actualite").each(function () {
+    let article = $(this);
 
-      let body = article.find(".field_body");
-      let links = article.find(".field_field_liens");
+    let body = article.find(".field_body");
+    let links = article.find(".field_field_liens");
 
-      body.hide();
-      links.hide();
+    body.hide();
+    links.hide();
 
-      let toggleButton = $("<button>")
-          .addClass("toggle-actualite")
-          .insertAfter(article);
+    let toggleButton = $("<button>")
+      .addClass("toggle-actualite")
+      .insertAfter(article);
 
-      toggleButton.on("click", function () {
-          body.slideToggle();
-          links.slideToggle();
-          $(this).toggleClass("open");
-      });
+    // Fonction commune
+    function toggleActu () {
+      body.slideToggle();
+      links.slideToggle();
+      toggleButton.toggleClass("open");
+    }
+
+    // Clic sur la flèche
+    toggleButton.on("click", function (e) {
+      e.stopPropagation();
+      toggleActu();
     });
-    // slimselect
-    // duplicated due to embeded view (archives)
-    let actu_type_select = new SlimSelect({
-      select: '#edit-field-type-d-actualite-target-id--2',
-      settings:{
-        placeholderText: 'choisir',
-        searchPlaceholder: 'choisir'
+
+    // Clic n'importe où sur le node
+    article.on("click", function (e) {
+      // Ne rien faire si clic sur un lien
+      if ($(e.target).closest("a").length) {
+        return;
       }
-    })
-    let actu_type_select2 = new SlimSelect({
-      select: '#edit-field-type-d-actualite-target-id--3',
-      settings:{
-        placeholderText: 'choisir',
-        searchPlaceholder: 'choisir'
-      }
-    })
-    let actu_site_select = new SlimSelect({
-      select: '#edit-field-site-target-id-verf--2',
-      settings:{
-        placeholderText: 'choisir',
-        searchPlaceholder: 'choisir'
-      }
-    })
-    let actu_site_select2 = new SlimSelect({
-      select: '#edit-field-site-target-id-verf--3',
-      settings:{
-        placeholderText: 'choisir',
-        searchPlaceholder: 'choisir'
-      }
-    })
-  }
+      toggleActu();
+    });
+  });
+
+  // slimselect
+  // duplicated due to embeded view (archives)
+  let actu_type_select = new SlimSelect({
+    select: '#edit-field-type-d-actualite-target-id--2',
+    settings:{
+      placeholderText: 'choisir',
+      searchPlaceholder: 'choisir'
+    }
+  })
+  let actu_type_select2 = new SlimSelect({
+    select: '#edit-field-type-d-actualite-target-id--3',
+    settings:{
+      placeholderText: 'choisir',
+      searchPlaceholder: 'choisir'
+    }
+  })
+  let actu_site_select = new SlimSelect({
+    select: '#edit-field-site-target-id-verf--2',
+    settings:{
+      placeholderText: 'choisir',
+      searchPlaceholder: 'choisir'
+    }
+  })
+  let actu_site_select2 = new SlimSelect({
+    select: '#edit-field-site-target-id-verf--3',
+    settings:{
+      placeholderText: 'choisir',
+      searchPlaceholder: 'choisir'
+    }
+  })
+}
 
 ///////////////////  end voir plus...  actualite dans /actualites & /home ////////////////////
 
 
+
 /////////////// start class à view-rows-ressources ////////
 
   $(".view-rows-wrapper").each(function () {

web/themes/custom/quartiers_de_demain/dist/assets/css/bundle.css

@@ -1670,6 +1670,8 @@ footer {
   text-transform: uppercase;
   font-size: 0.6rem;
   margin: auto;
+  padding-top: 0.1rem;
+  padding-bottom: 0.1rem;
 }
 @media (max-width: 810px) {
   #home .__container-deroulement .config_pages--type--deroulement .field_field_calendrier .file--application-pdf {
@@ -1758,6 +1760,7 @@ footer {
 }
 #actus-caroussel .content-actus .view-rows-wrapper .views-row .node-type-actualite {
   width: 85%;
+  cursor: pointer;
 }
 #actus-caroussel .content-actus .view-rows-wrapper .views-row .node-type-actualite .content-wrapper-actu {
   display: grid;
@@ -1936,18 +1939,28 @@ footer {
   align-items: center;
 }
 #actus-caroussel .content-actus .view-rows-wrapper .views-row .node-type-actualite .content-wrapper-actu .links.inline a {
-  width: 5em;
-  display: block;
+  display: inline-flex;
   overflow: hidden;
   white-space: nowrap;
+  font-size: 0px;
+  align-items: baseline;
 }
-#actus-caroussel .content-actus .view-rows-wrapper .views-row .node-type-actualite .content-wrapper-actu .links.inline::after {
-  content: "+";
+#actus-caroussel .content-actus .view-rows-wrapper .views-row .node-type-actualite .content-wrapper-actu .links.inline a::before {
+  content: "En savoir";
   display: block;
   padding-left: 0.4rem;
-  font-size: 1.8rem;
+  font-size: 0.7rem;
   height: fit-content;
 }
+#actus-caroussel .content-actus .view-rows-wrapper .views-row .node-type-actualite .content-wrapper-actu .links.inline a::after {
+  content: " +";
+  display: flex;
+  padding-left: 0.3rem;
+  font-size: 1rem;
+  height: 26px;
+  margin: auto;
+  align-items: center;
+}
 #actus-caroussel .content-actus .view-rows-wrapper .views-row .node-type-actualite .content-wrapper-actu .field_field_liens {
   order: 7;
   padding: 0;
@@ -1964,6 +1977,8 @@ footer {
   text-transform: uppercase;
   font-size: 0.5rem;
   margin-bottom: 0.5rem;
+  padding-top: 0.1rem;
+  padding-bottom: 0.1rem;
 }
 #actus-caroussel .content-actus .view-rows-wrapper .views-row .node-type-actualite .content-wrapper-actu .field_field_liens a svg {
   display: none;
@@ -2003,6 +2018,8 @@ footer {
   display: flex;
   flex-direction: row;
   padding-left: 0.5rem;
+  padding-top: 0.1rem;
+  padding-bottom: 0.1rem;
   display: inline-flex;
   align-items: center;
   color: white;
@@ -2392,6 +2409,8 @@ body {
   text-transform: uppercase;
   font-size: 0.5rem;
   padding-left: 0.5rem;
+  padding-top: 0.1rem;
+  padding-bottom: 0.1rem;
 }
 #home article.node-type-static .field_body h6 a svg {
   display: none;

web/themes/custom/quartiers_de_demain/src/assets/js/quartiers_de_demain.js

@@ -427,61 +427,79 @@ $(document).ready(function () {
 
 /////////////////// start voir plus...  actualite dans /actualites & /home ////////////////////
 
-  if ($("#actualites" ).length > 0 || $("#home").length > 0)  {
-    $(".node-type-actualite").each(function () {
-      let article = $(this);
+if ($("#actualites").length > 0 || $("#home").length > 0)  {
+  $(".node-type-actualite").each(function () {
+    let article = $(this);
 
-      let body = article.find(".field_body");
-      let links = article.find(".field_field_liens");
+    let body = article.find(".field_body");
+    let links = article.find(".field_field_liens");
 
-      body.hide();
-      links.hide();
+    body.hide();
+    links.hide();
 
-      let toggleButton = $("<button>")
-          .addClass("toggle-actualite")
-          .insertAfter(article);
+    let toggleButton = $("<button>")
+      .addClass("toggle-actualite")
+      .insertAfter(article);
 
-      toggleButton.on("click", function () {
-          body.slideToggle();
-          links.slideToggle();
-          $(this).toggleClass("open");
-      });
+    // Fonction commune
+    function toggleActu () {
+      body.slideToggle();
+      links.slideToggle();
+      toggleButton.toggleClass("open");
+    }
+
+    // Clic sur la flèche
+    toggleButton.on("click", function (e) {
+      e.stopPropagation();
+      toggleActu();
     });
-    // slimselect
-    // duplicated due to embeded view (archives)
-    let actu_type_select = new SlimSelect({
-      select: '#edit-field-type-d-actualite-target-id--2',
-      settings:{
-        placeholderText: 'choisir',
-        searchPlaceholder: 'choisir'
+
+    // Clic n'importe où sur le node
+    article.on("click", function (e) {
+      // Ne rien faire si clic sur un lien
+      if ($(e.target).closest("a").length) {
+        return;
       }
-    })
-    let actu_type_select2 = new SlimSelect({
-      select: '#edit-field-type-d-actualite-target-id--3',
-      settings:{
-        placeholderText: 'choisir',
-        searchPlaceholder: 'choisir'
-      }
-    })
-    let actu_site_select = new SlimSelect({
-      select: '#edit-field-site-target-id-verf--2',
-      settings:{
-        placeholderText: 'choisir',
-        searchPlaceholder: 'choisir'
-      }
-    })
-    let actu_site_select2 = new SlimSelect({
-      select: '#edit-field-site-target-id-verf--3',
-      settings:{
-        placeholderText: 'choisir',
-        searchPlaceholder: 'choisir'
-      }
-    })
-  }
+      toggleActu();
+    });
+  });
+
+  // slimselect
+  // duplicated due to embeded view (archives)
+  let actu_type_select = new SlimSelect({
+    select: '#edit-field-type-d-actualite-target-id--2',
+    settings:{
+      placeholderText: 'choisir',
+      searchPlaceholder: 'choisir'
+    }
+  })
+  let actu_type_select2 = new SlimSelect({
+    select: '#edit-field-type-d-actualite-target-id--3',
+    settings:{
+      placeholderText: 'choisir',
+      searchPlaceholder: 'choisir'
+    }
+  })
+  let actu_site_select = new SlimSelect({
+    select: '#edit-field-site-target-id-verf--2',
+    settings:{
+      placeholderText: 'choisir',
+      searchPlaceholder: 'choisir'
+    }
+  })
+  let actu_site_select2 = new SlimSelect({
+    select: '#edit-field-site-target-id-verf--3',
+    settings:{
+      placeholderText: 'choisir',
+      searchPlaceholder: 'choisir'
+    }
+  })
+}
 
 ///////////////////  end voir plus...  actualite dans /actualites & /home ////////////////////
 
 
+
 /////////////// start class à view-rows-ressources ////////
 
   $(".view-rows-wrapper").each(function () {

web/themes/custom/quartiers_de_demain/src/assets/scss/pages/home.scss

@@ -130,6 +130,8 @@
                     text-transform: uppercase;
                     font-size: 0.5rem;
                     padding-left: 0.5rem;
+                    padding-top: 0.1rem;
+                    padding-bottom: 0.1rem;
                     svg{
                         display: none;
                     }

web/themes/custom/quartiers_de_demain/src/assets/scss/partials/actu-caroussel-home.scss

@@ -54,6 +54,7 @@
                 .node-type-actualite{
                     width: 85%;
                     // padding-bottom: 2rem;
+                    cursor: pointer;
                     
                     .content-wrapper-actu{
                         display: grid;
@@ -250,21 +251,32 @@
                             display: inline-flex;
                             align-items: center;
                             a{
-                                width: 5em;
-                                display: block;
+                                display: inline-flex;
                                 overflow: hidden;
                                 white-space: nowrap;
+                                font-size: 0px;
+                                align-items: baseline;
+                                &::before{
+                                    content: "En savoir";
+                                    display: block;
+                                    // width: 20px;
+                                    padding-left: 0.4rem;
+                                    font-size: 0.7rem;
+                                    height: fit-content;
+                                }
+                                &::after{
+                                    content: " +";
+                                    display: flex;
+                                    padding-left: 0.3rem;
+                                    font-size: 1rem;
+                                    height: 26px;
+                                    margin: auto;
+                                    align-items: center;
+                                }
                             }
 
 
-                            &::after{
-                                content: "+";
-                                display: block;
-                                // width: 20px;
-                                padding-left: 0.4rem;
-                                font-size: 1.8rem;
-                                height: fit-content;
-                            }
+                            
                         }
                         .field_field_liens{
                             order: 7;
@@ -281,7 +293,8 @@
                                 text-transform: uppercase;
                                 font-size: 0.5rem;
                                 margin-bottom: 0.5rem;
-                                
+                                padding-top: 0.1rem;
+                                padding-bottom: 0.1rem;                                
                                 svg{
                                     display: none;
                                 }
@@ -330,8 +343,8 @@
                     display: flex;
                     flex-direction: row;
                     padding-left: 0.5rem;
-                    // padding-top: 0.2rem;
-                    // padding-bottom: 0.2rem;
+                    padding-top: 0.1rem;
+                    padding-bottom: 0.1rem;
                     display: inline-flex;
                     align-items: center;
                     color: white;

web/themes/custom/quartiers_de_demain/src/assets/scss/partials/timeline.scss

@@ -212,6 +212,8 @@
                     text-transform: uppercase;
                     font-size: 0.6rem;
                     margin: auto;
+                    padding-top: 0.1rem;
+                    padding-bottom: 0.1rem;
                     @media (max-width:810px) {  
                         margin-left: 0;
                         margin: auto;