view actus

web/themes/custom/reha/dist/bundle.js

@@ -15,7 +15,7 @@
   \********************/
 /***/ (() => {
 
-eval("/**\n * @file\n * reha behaviors.\n */\n(function (Drupal) {\n\n  'use strict';\n\n  Drupal.behaviors.reha = {\n    attach: function (context, settings) {\n\n      console.log('It works!');\n\n    }\n  };\n\n  \n} (Drupal));\n\njQuery(document).ready(function($){\n\n  // menu déroulant\n\n  //////////////  contacts ///////\n\n  $(\".bouton-contact\").click(function(event) {\n        // Fermer .connexion-full s'il est déroulé\n  if ($(\".connexion-full\").is(\":visible\")) {\n    $(\".connexion-full\").slideUp();\n  }\n  if ($(\".connected-full\").is(\":visible\")) {\n    $(\".connected-full\").slideUp();\n  }\n    // Ouvrir .contacts-full\n    $(\".contacts-full\").slideToggle();\n\n  });\n\n//////////////  connexion ///////\n\n  $(\".bouton-connexion\").click(function(event) {\n      // Fermer .contacts-full s'il est déroulé\n  if ($(\".contacts-full\").is(\":visible\")) {\n    $(\".contacts-full\").slideUp();\n  }\n  // Ouvrir .connexion-full\n    $(\".connexion-full\").slideToggle();\n  });\n  \n  $(\".bouton-connected\").click(function(event) {\n    // Fermer .contacts-full s'il est déroulé\n    if ($(\".contacts-full\").is(\":visible\")) {\n      $(\".contacts-full\").slideUp();\n    }\n    // Ouvrir .connected-full\n    $(\".connected-full\").slideToggle();\n  });\n  \n  $(\".titre\").click(function(event) {\n    if ($(\".connected-full\").is(\":visible\")) {\n      $(\".connected-full\").slideUp();\n    }\n    if ($(\".contacts-full\").is(\":visible\")) {\n      $(\".contacts-full\").slideUp();\n    }\n    if ($(\".connexion-full\").is(\":visible\")) {\n      $(\".connexion-full\").slideUp();\n    }\n    // // Ouvrir .connexion-full\n    //   $(\".connected-full\").slideToggle();\n  });\n  \n  $(\"#edit-field-dossier-de-candidature-0--label\").click(function(event) {\n    event.preventDefault();\n    // Ouvrir .connexion-full\n    $(\"#edit-field-dossier-de-candidature-0--description>ul.main\").slideToggle();\n  });\n\n});\n\n\n//  slideshow home \n\n(function($, window) {\n  console.log('hello slick')\n  $(document).ready(function(){\n      $('.view-id-sites.view-display-id-block_1').slick({\n        slidesToShow: 1,\n        // slidesToScroll: 1,\n        dots: false,\n        arrows: true,\n        centerMode: true,\n        // centerPadding: '100px',\n        responsive: [\n          {\n            breakpoint: 810,\n            settings: {\n              slidesToShow: 1,\n              adaptiveHeight: true,\n              arrows: false,\n              draggable: true,\n              centerMode: true,\n            }\n          }]\n      });\n      console.log('salut slick home');\n\n  });\n})(jQuery, window);\n\n\n//# sourceURL=webpack://dev.reha.fr/./js/reha.js?");
+eval("/**\n * @file\n * reha behaviors.\n */\n(function (Drupal) {\n\n  'use strict';\n\n  Drupal.behaviors.reha = {\n    attach: function (context, settings) {\n\n      console.log('It works!');\n\n    }\n  };\n\n  \n} (Drupal));\n\njQuery(document).ready(function($){\n\n  // menu déroulant\n\n  //////////////  contacts ///////\n\n  $(\".bouton-contact\").click(function(event) {\n        // Fermer .connexion-full s'il est déroulé\n  if ($(\".connexion-full\").is(\":visible\")) {\n    $(\".connexion-full\").slideUp();\n  }\n  if ($(\".connected-full\").is(\":visible\")) {\n    $(\".connected-full\").slideUp();\n  }\n    // Ouvrir .contacts-full\n    $(\".contacts-full\").slideToggle();\n\n  });\n\n//////////////  connexion ///////\n\n  $(\".bouton-connexion\").click(function(event) {\n      // Fermer .contacts-full s'il est déroulé\n  if ($(\".contacts-full\").is(\":visible\")) {\n    $(\".contacts-full\").slideUp();\n  }\n  // Ouvrir .connexion-full\n    $(\".connexion-full\").slideToggle();\n  });\n  \n  $(\".bouton-connected\").click(function(event) {\n    // Fermer .contacts-full s'il est déroulé\n    if ($(\".contacts-full\").is(\":visible\")) {\n      $(\".contacts-full\").slideUp();\n    }\n    // Ouvrir .connected-full\n    $(\".connected-full\").slideToggle();\n  });\n  \n  $(\".titre\").click(function(event) {\n    if ($(\".connected-full\").is(\":visible\")) {\n      $(\".connected-full\").slideUp();\n    }\n    if ($(\".contacts-full\").is(\":visible\")) {\n      $(\".contacts-full\").slideUp();\n    }\n    if ($(\".connexion-full\").is(\":visible\")) {\n      $(\".connexion-full\").slideUp();\n    }\n    // // Ouvrir .connexion-full\n    //   $(\".connected-full\").slideToggle();\n  });\n  \n  $(\"#edit-field-dossier-de-candidature-0--label\").click(function(event) {\n    event.preventDefault();\n    // Ouvrir .connexion-full\n    $(\"#edit-field-dossier-de-candidature-0--description>ul.main\").slideToggle();\n  });\n\n});\n\n\n//  slideshow home \n\n(function($, window) {\n  console.log('hello slick')\n  $(document).ready(function(){\n      $('.view-id-sites.view-display-id-block_1').slick({\n        slidesToShow: 1,\n        // slidesToScroll: 1,\n        dots: false,\n        arrows: true,\n        centerMode: true,\n        // centerPadding: '100px',\n        responsive: [\n          {\n            breakpoint: 810,\n            settings: {\n              slidesToShow: 1,\n              adaptiveHeight: true,\n              arrows: false,\n              draggable: true,\n              centerMode: true,\n            }\n          }]\n      });\n      console.log('salut slick home');\n\n  });\n})(jQuery, window);\n\n\n// document.addEventListener('DOMContentLoaded', function() {\n//   var nav = document.querySelectorAll('main-nav');\n//   var links = nav.querySelectorAll('li > a');\n//   console.log(links);\n\n\n//   links.forEach(function(link) {\n//     if (link.classList.contains('is-active')) {\n//       nav.classList.add('has-active');\n//     }\n//   });\n// });\n\n\n\n// /////////////////\n//// ancre dans texte au click parragraphe correspondant arrive en dessous du header \n\n\n// (function($, window) {\n//   var adjustAnchor = function() {\n//       var $anchor = $('.block-views-blockhome-block-1'),\n//               fixedElementHeight = 350;\n//       if ($anchor.length > 0) {\n//           $('html, body').stop().animate({scrollTop: $anchor.offset().top - fixedElementHeight }, 0);\n//       }\n//   };\n\n//   $(window).on('hashchange', function() {\n//       adjustAnchor();\n//   });\n\n// })(jQuery, window);\n\n//# sourceURL=webpack://dev.reha.fr/./js/reha.js?");
 
 /***/ }),
 

web/themes/custom/reha/dist/css/bundle.css

@@ -348,14 +348,18 @@ header .region-header #block-reha-navigationprincipale ul {
     flex-direction: column;
   }
 }
-header .region-header #block-reha-navigationprincipale ul a {
+header .region-header #block-reha-navigationprincipale ul li.has-active {
-  font-weight: 800;
-}
-header .region-header #block-reha-navigationprincipale ul a.is-active {
   text-decoration: underline;
   font-weight: 1000;
 }
-header .region-header #block-reha-navigationprincipale ul a:hover {
+header .region-header #block-reha-navigationprincipale ul li a {
+  font-weight: 800;
+}
+header .region-header #block-reha-navigationprincipale ul li a.is-active {
+  text-decoration: underline;
+  font-weight: 1000;
+}
+header .region-header #block-reha-navigationprincipale ul li a:hover {
   text-decoration: underline;
 }
 header .region-header #block-reha-connexionutilisateur {
@@ -936,7 +940,7 @@ input {
   cursor: pointer;
   background: transparent;
   color: transparent;
-  top: 25%;
+  top: 20%;
   -webkit-transform: translate(0, -50%);
   -ms-transform: translate(0, -50%);
   transform: translate(0, -50%);
@@ -1668,7 +1672,7 @@ html.js body.node-type-operation.node-id-7 div.dialog-off-canvas-main-canvas div
   padding: 2rem;
   margin-right: 1rem;
   width: 20%;
-  margin-left: 8%;
+  margin-left: 12%;
   padding-top: 0.5rem;
   padding-left: 0.5rem;
   padding-bottom: 5rem;
@@ -1689,6 +1693,7 @@ html.js body.node-type-operation.node-id-7 div.dialog-off-canvas-main-canvas div
 .home-page-layout-content .block-views-blocksites-block-1 {
   top: -60px;
   position: relative;
+  height: 550px;
 }
 @media (max-width: 891px) {
   .home-page-layout-content .block-views-blocksites-block-1 .views-row {
@@ -1713,11 +1718,11 @@ html.js body.node-type-operation.node-id-7 div.dialog-off-canvas-main-canvas div
 .home-page-layout-content .block-views-blocksites-block-1 .views-row .node-type-site .image-site {
   order: 1;
   grid-row: 1/span 10;
-  grid-column: 1/span 9;
+  grid-column: 2/span 9;
+  width: 100%;
 }
 .home-page-layout-content .block-views-blocksites-block-1 .views-row .node-type-site .image-site img {
-  width: 100%;
+  height: 500px;
-  height: auto;
 }
 .home-page-layout-content .block-views-blocksites-block-1 .views-row .node-type-site .filtered-content {
   background-color: rgb(255, 255, 255);
@@ -1726,7 +1731,7 @@ html.js body.node-type-operation.node-id-7 div.dialog-off-canvas-main-canvas div
   display: flex;
   flex-direction: column;
   grid-row: 7/span 5;
-  grid-column: 7/span 12;
+  grid-column: 7/span 9;
   padding: 1rem;
 }
 @media (max-width: 891px) {
@@ -1873,8 +1878,8 @@ html.js body.node-type-operation.node-id-7 div.dialog-off-canvas-main-canvas div
 }
 
 .block-views-blockactus-block-1 {
-  display: none;
   background-color: white;
+  padding-bottom: 3rem;
 }
 .block-views-blockactus-block-1 h2 {
   width: 80%;
@@ -1899,34 +1904,38 @@ html.js body.node-type-operation.node-id-7 div.dialog-off-canvas-main-canvas div
 .block-views-blockactus-block-1 .view-id-actus .views-row .node-type-actualite p.field__item {
   display: none;
 }
-.block-views-blockactus-block-1 .view-id-actus .views-row .node-type-actualite h2 {
-  order: 3;
-  margin: 0;
-}
 .block-views-blockactus-block-1 .view-id-actus .views-row .node-type-actualite .field--name-field-image {
   order: 1;
   max-width: 100%;
+  padding-bottom: 1rem;
 }
 .block-views-blockactus-block-1 .view-id-actus .views-row .node-type-actualite .field--name-field-image img {
-  max-width: 100%;
+  width: 80%;
-  object-fit: contain;
+  height: auto;
 }
-.block-views-blockactus-block-1 .view-id-actus .views-row .node-type-actualite .field--name-field-numero-site {
+.block-views-blockactus-block-1 .view-id-actus .views-row .node-type-actualite .infos-content {
-  order: 3;
+  display: flex;
+  flex-direction: column;
 }
-.block-views-blockactus-block-1 .view-id-actus .views-row .node-type-actualite .field--name-field-adresse-site {
+.block-views-blockactus-block-1 .view-id-actus .views-row .node-type-actualite .infos-content h2 {
-  order: 4;
-}
-.block-views-blockactus-block-1 .view-id-actus .views-row .node-type-actualite .field--name-field-architecte {
-  order: 4;
-}
-.block-views-blockactus-block-1 .view-id-actus .views-row .node-type-actualite .field--name-field-type-d-actualite {
   order: 2;
+  margin: 0;
+  padding: 0;
 }
-.block-views-blockactus-block-1 .view-id-actus .views-row .node-type-actualite .field--name-field-site {
+.block-views-blockactus-block-1 .view-id-actus .views-row .node-type-actualite .infos-content .field--name-field-sous-titre {
   order: 3;
 }
-.block-views-blockactus-block-1 .view-id-actus .views-row .node-type-actualite > div:nth-child(2) > div:nth-child(2) {
+.block-views-blockactus-block-1 .view-id-actus .views-row .node-type-actualite .infos-content .field--name-field-type-d-actualite {
+  order: 1;
+  text-transform: uppercase;
+}
+.block-views-blockactus-block-1 .view-id-actus .views-row .node-type-actualite .infos-content .field--name-field-site {
+  order: 5;
+}
+.block-views-blockactus-block-1 .view-id-actus .views-row .node-type-actualite .infos-content .field--name-field-date {
+  order: 4;
+}
+.block-views-blockactus-block-1 .view-id-actus .views-row .node-type-actualite .body-content {
   display: none;
 }
 

web/themes/custom/reha/js/reha.js

@@ -107,3 +107,38 @@ jQuery(document).ready(function($){
 
   });
 })(jQuery, window);
+
+
+// document.addEventListener('DOMContentLoaded', function() {
+//   var nav = document.querySelectorAll('main-nav');
+//   var links = nav.querySelectorAll('li > a');
+//   console.log(links);
+
+
+//   links.forEach(function(link) {
+//     if (link.classList.contains('is-active')) {
+//       nav.classList.add('has-active');
+//     }
+//   });
+// });
+
+
+
+// /////////////////
+//// ancre dans texte au click parragraphe correspondant arrive en dessous du header 
+
+
+// (function($, window) {
+//   var adjustAnchor = function() {
+//       var $anchor = $('.block-views-blockhome-block-1'),
+//               fixedElementHeight = 350;
+//       if ($anchor.length > 0) {
+//           $('html, body').stop().animate({scrollTop: $anchor.offset().top - fixedElementHeight }, 0);
+//       }
+//   };
+
+//   $(window).on('hashchange', function() {
+//       adjustAnchor();
+//   });
+
+// })(jQuery, window);

web/themes/custom/reha/reha.theme

@@ -32,7 +32,7 @@ function reha_preprocess_html(&$variables) {
       $node = &$variables['node'];
       $variables['attributes']['class'][] = 'node-type-' . $node->gettype();
       
-      if ($node->getType() == 'site' || $node->getType() == 'ressource') {
+      if ($node->getType() == 'site' || $node->getType() == 'ressource' || $node->getType() == 'actualite') {
           $fields_to_exclude = [
               'field_image', // Remplacez par le nom machine exact de votre champ image
           ];

web/themes/custom/reha/scss/pages/home/home-view-actualites.scss

@@ -1,6 +1,7 @@
 .block-views-blockactus-block-1{
-    display:none;
+    // display:none;
     background-color: white;
+    padding-bottom: 3rem;
     h2{
         width: 80%;
         margin: auto;
@@ -22,38 +23,44 @@
                 p.field__item{
                     display: none;
                 }
-                h2{
-                    order: 3;
-                    margin: 0;
-                }
                 .field--name-field-image{
                     order: 1;
                     max-width: 100%;
+                    padding-bottom: 1rem;
                     img{
-                        max-width: 100%;
+                        width: 80%;
-                        object-fit: contain;
+                        height: auto;
                     }
                 }
-                .field--name-field-numero-site {
+                .infos-content{
-                    order: 3;
+                    display: flex;
+                    flex-direction: column;
+                    h2{
+                        order: 2;
+                        margin: 0;
+                        padding: 0;
+                    }
+                    
+                    .field--name-field-sous-titre {
+                        order: 3;
+                    }
+                    .field--name-field-type-d-actualite{
+                        order: 1;
+                        text-transform: uppercase;
+                    }
+                    .field--name-field-site{
+                        order: 5;
+                    }
+                    .field--name-field-date{
+                        order: 4;
+                    }
                 }
-                .field--name-field-adresse-site{
+                .body-content{
-                    order: 4;
+                    display: none;
-                }
-                .field--name-field-architecte{
-                    order: 4;
-                }
-                .field--name-field-type-d-actualite{
-                    order: 2;
-                }
-                .field--name-field-site{
-                    order: 3;
                 }
                 
             }
-            .node-type-actualite > div:nth-child(2) > div:nth-child(2){
+           
-                display: none;
-            }
         }
         
     }

web/themes/custom/reha/scss/pages/home/home-view-sites.scss

@@ -7,7 +7,7 @@
     padding: 2rem;
     margin-right: 1rem;
     width: 20%;
-    margin-left: 8%;
+    margin-left: 12%;
     padding-top: 0.5rem;
     padding-left: 0.5rem;
     padding-bottom: 5rem;
@@ -25,6 +25,7 @@
     .block-views-blocksites-block-1 {
         top: -60px;
         position: relative;
+        height: 550px;
     
         .views-row{
             @media(max-width: 891px){
@@ -45,11 +46,14 @@
                 .image-site{
                     order: 1;
                     grid-row: 1/span 10;
-                    grid-column: 1/span 9;
+                    grid-column: 2/span 9;
+                    width: 100%;
                     img {
-                        width: 100%;
+                        // width: 70%;
-                        // object-fit: cover;
+                        // // object-fit: cover;
-                        height: auto;
+                        // height: auto;
+                        height: 500px;
+                        
                     }
                 }
                 .filtered-content{
@@ -60,7 +64,7 @@
                     display: flex;
                     flex-direction: column;
                     grid-row: 7/span 5;
-                    grid-column: 7/span 12;
+                    grid-column: 7/span 9;
                     padding: 1rem;
                     @media(max-width: 891px){
                         width: auto;

web/themes/custom/reha/scss/pages/node-actualite.scss

@@ -0,0 +1,46 @@
+.page-node-site{
+    .node-type-actualite{
+        width: 70%;
+        margin: auto;
+        display: grid;
+        grid-template-columns: repeat(4, auto);
+        grid-template-rows: repeat(2, auto);
+        padding-top: 3rem;
+
+        .image-actualite{
+            grid-row: 1;
+            grid-column: 1 /span 2;
+            margin-right: 2rem;
+
+            img{
+                height: fit-content;
+                // width: auto;
+            }
+        }
+        .infos-content{
+            grid-row: 1;
+            grid-column: 3 /span 4;
+            .field--name-field-type-de-actualite{
+                text-transform: uppercase;
+                font-size: 1.5rem;
+            }
+            .field--name-field-sous-titre{
+                font-size: 2rem;
+            }
+            .field--name-field-auteur{
+                font-weight: 800;
+                font-size: 1.4rem;
+            }
+        }
+        .body-content {
+            grid-row: 2;
+            grid-column: 1 /span 3;
+            width: 100%;
+            margin-top: 2rem;
+            .field--name-field-fichiers{
+                width: fit-content;
+            }
+
+        }
+    }   
+}

web/themes/custom/reha/scss/partials/_header.scss

@@ -74,20 +74,34 @@ header{
                 display: flex;
                 flex-direction: row;
                 justify-content: space-evenly;
+                
+               
                 @media (max-width:1400px) {
                     flex-direction: column;
                 }
-                a{
+                li{
-                    font-weight: 800;
+                    &.has-active {
-                    &.is-active{
                         text-decoration: underline;
                         font-weight: 1000;
                     }
-                    &:hover{
+                    
-                        text-decoration: underline;
+                    a{
+                        font-weight: 800;
+                        &.is-active{
+                            text-decoration: underline;
+                            font-weight: 1000;
+                        }
+                        &:hover{
+                            text-decoration: underline;
+                        }
                     }
                 }
+               
             }
+            // ul > li a.active{
+            //     text-decoration: underline;
+            //     font-weight: 1000;
+            // }
         }
 
         #block-reha-connexionutilisateur{

web/themes/custom/reha/scss/partials/_slick-theme.scss

@@ -72,7 +72,7 @@ $slick-opacity-not-active: 0.25 !default;
     cursor: pointer;
     background: transparent;
     color: transparent;
-    top: 25%;
+    top: 20%;
     -webkit-transform: translate(0, -50%);
     -ms-transform: translate(0, -50%);
     transform: translate(0, -50%);

web/themes/custom/reha/templates/block--system-menu-block.html.twig

@@ -0,0 +1,51 @@
+{#
+/**
+ * @file
+ * Default theme implementation for a menu block.
+ *
+ * Available variables:
+ * - plugin_id: The ID of the block implementation.
+ * - label: The configured label of the block if visible.
+ * - configuration: A list of the block's configuration values.
+ *   - label: The configured label for the block.
+ *   - label_display: The display settings for the label.
+ *   - provider: The module or other provider that provided this block plugin.
+ *   - Block plugin specific settings will also be stored here.
+ * - in_preview: Whether the plugin is being rendered in preview mode.
+ * - content: The content of this block.
+ * - attributes: HTML attributes for the containing element.
+ *   - id: A valid HTML ID and guaranteed unique.
+ * - title_attributes: HTML attributes for the title element.
+ * - content_attributes: HTML attributes for the content element.
+ * - title_prefix: Additional output populated by modules, intended to be
+ *   displayed in front of the main title tag that appears in the template.
+ * - title_suffix: Additional output populated by modules, intended to be
+ *   displayed after the main title tag that appears in the template.
+ *
+ * Headings should be used on navigation menus that consistently appear on
+ * multiple pages. When this menu block's label is configured to not be
+ * displayed, it is automatically made invisible using the 'visually-hidden' CSS
+ * class, which still keeps it visible for screen-readers and assistive
+ * technology. Headings allow screen-reader and keyboard only users to navigate
+ * to or skip the links.
+ * See http://juicystudio.com/article/screen-readers-display-none.php and
+ * http://www.w3.org/TR/WCAG-TECHS/H42.html for more information.
+ *
+ * @ingroup themeable
+ */
+#}
+{% set heading_id = attributes.id ~ '-menu'|clean_id %}
+<nav role="navigation" aria-labelledby="{{ heading_id }}"{{ attributes|without('role', 'aria-labelledby') }}>
+  {# Label. If not displayed, we still provide it for screen readers. #}
+  {% if not configuration.label_display %}
+    {% set title_attributes = title_attributes.addClass('visually-hidden') %}
+  {% endif %}
+  {{ title_prefix }}
+  <h2{{ title_attributes.setAttribute('id', heading_id) }}>{{ configuration.label }}</h2>
+  {{ title_suffix }}
+
+  {# Menu. #}
+  {% block content %}
+    {{ content }}
+  {% endblock %}
+</nav>

web/themes/custom/reha/templates/menu.html.twig

@@ -0,0 +1,49 @@
+{#
+/**
+ * @file
+ * Default theme implementation to display a menu.
+ *
+ * Available variables:
+ * - menu_name: The machine name of the menu.
+ * - items: A nested list of menu items. Each menu item contains:
+ *   - attributes: HTML attributes for the menu item.
+ *   - below: The menu item child items.
+ *   - title: The menu link title.
+ *   - url: The menu link URL, instance of \Drupal\Core\Url
+ *   - localized_options: Menu link localized options.
+ *   - is_expanded: TRUE if the link has visible children within the current
+ *     menu tree.
+ *   - is_collapsed: TRUE if the link has children within the current menu tree
+ *     that are not currently visible.
+ *   - in_active_trail: TRUE if the link is in the active trail.
+ *
+ * @ingroup themeable
+ */
+#}
+{% import _self as menus %}
+
+{#
+  We call a macro which calls itself to render the full tree.
+  https://twig.symfony.com/doc/3.x/tags/macro.html
+#}
+{{ menus.menu_links(items, attributes, 0) }}
+
+{% macro menu_links(items, attributes, menu_level) %}
+  {% import _self as menus %}
+  {% if items %}
+    {% if menu_level == 0 %}
+      <ul id='main-nav'{{ attributes }}>
+    {% else %}
+      <ul>
+    {% endif %}
+    {% for item in items %}
+      <li{{ item.attributes }}>
+        {{ link(item.title, item.url) }}
+        {% if item.below %}
+          {{ menus.menu_links(item.below, attributes, menu_level + 1) }}
+        {% endif %}
+      </li>
+    {% endfor %}
+    </ul>
+  {% endif %}
+{% endmacro %}

web/themes/custom/reha/templates/node--actualite.html.twig

@@ -0,0 +1,126 @@
+{#
+/**
+ * @file
+ * Default theme implementation to display a node.
+ *
+ * Available variables:
+ * - node: The node entity with limited access to object properties and methods.
+ *   Only method names starting with "get", "has", or "is" and a few common
+ *   methods such as "id", "label", and "bundle" are available. For example:
+ *   - node.getCreatedTime() will return the node creation timestamp.
+ *   - node.hasField('field_example') returns TRUE if the node bundle includes
+ *     field_example. (This does not indicate the presence of a value in this
+ *     field.)
+ *   - node.isPublished() will return whether the node is published or not.
+ *   Calling other methods, such as node.delete(), will result in an exception.
+ *   See \Drupal\node\Entity\Node for a full list of public properties and
+ *   methods for the node object.
+ * - label: (optional) The title of the node.
+ * - content: All node items. Use {{ content }} to print them all,
+ *   or print a subset such as {{ content.field_example }}. Use
+ *   {{ content|without('field_example') }} to temporarily suppress the printing
+ *   of a given child element.
+ * - author_picture: The node author user entity, rendered using the "compact"
+ *   view mode.
+ * - metadata: Metadata for this node.
+ * - date: (optional) Themed creation date field.
+ * - author_name: (optional) Themed author name field.
+ * - url: Direct URL of the current node.
+ * - display_submitted: Whether submission information should be displayed.
+ * - attributes: HTML attributes for the containing element.
+ *   The attributes.class element may contain one or more of the following
+ *   classes:
+ *   - node: The current template type (also known as a "theming hook").
+ *   - node--type-[type]: The current node type. For example, if the node is an
+ *     "Article" it would result in "node--type-article". Note that the machine
+ *     name will often be in a short form of the human readable label.
+ *   - node--view-mode-[view_mode]: The View Mode of the node; for example, a
+ *     teaser would result in: "node--view-mode-teaser", and
+ *     full: "node--view-mode-full".
+ *   The following are controlled through the node publishing options.
+ *   - node--promoted: Appears on nodes promoted to the front page.
+ *   - node--sticky: Appears on nodes ordered above other non-sticky nodes in
+ *     teaser listings.
+ *   - node--unpublished: Appears on unpublished nodes visible only to site
+ *     admins.
+ * - title_attributes: Same as attributes, except applied to the main title
+ *   tag that appears in the template.
+ * - content_attributes: Same as attributes, except applied to the main
+ *   content tag that appears in the template.
+ * - author_attributes: Same as attributes, except applied to the author of
+ *   the node tag that appears in the template.
+ * - title_prefix: Additional output populated by modules, intended to be
+ *   displayed in front of the main title tag that appears in the template.
+ * - title_suffix: Additional output populated by modules, intended to be
+ *   displayed after the main title tag that appears in the template.
+ * - view_mode: View mode; for example, "teaser" or "full".
+ * - teaser: Flag for the teaser state. Will be true if view_mode is 'teaser'.
+ * - page: Flag for the full page state. Will be true if view_mode is 'full'.
+ * - readmore: Flag for more state. Will be true if the teaser content of the
+ *   node cannot hold the main body content.
+ * - logged_in: Flag for authenticated user status. Will be true when the
+ *   current user is a logged-in member.
+ * - is_admin: Flag for admin user status. Will be true when the current user
+ *   is an administrator.
+ *
+ * @see template_preprocess_node()
+ *
+ * @ingroup themeable
+ */
+#}
+<article{{ attributes.addClass('node-type-actualite') }}>
+
+  {{ title_prefix }}
+
+  {# Afficher le champ image séparément #}
+  {% if image_field_content %}
+    <div class="image-actualite">
+      {{ image_field_content }}
+    </div>
+  {% endif %}
+
+  {# Envelopper les autres champs dans des divs distinctes #}
+  <div class="infos-content">
+    {% if label and not page %}
+      <h2{{ title_attributes }}>
+        <a href="{{ url }}" rel="bookmark">{{ label }}</a>
+      </h2>
+    {% endif %}
+
+    {% for field_name, field_content in filtered_content %}
+      {{ field_content }}
+    {% endfor %}
+  </div>
+
+  {# Ajouter une nouvelle div pour le champ body et fichiers #}
+  {% if body_field_content is defined or files_field_content is defined %}
+    <div class="body-content">
+      {% if body_field_content is defined %}
+        <div class="summary-content">
+          {{ body_field_content }}
+        </div>
+      {% endif %}
+      {% if files_field_content is defined %}
+        <div class="links-content">
+          {{ files_field_content }}
+          {{ liens_field_content }}
+        </div>
+      {% endif %}
+    </div>
+  {% endif %}
+
+  {{ title_suffix }}
+
+  {% if display_submitted %}
+    <footer>
+      {{ author_picture }}
+      <div{{ author_attributes }}>
+        {% trans %}Submitted by {{ author_name }} on {{ date }}{% endtrans %}
+        {{ metadata }}
+      </div>
+    </footer>
+  {% endif %}
+
+</article>
+
+