image very large

composer.json

@@ -35,6 +35,7 @@
         "drupal/quick_node_clone": "^1.18",
         "drupal/simple_sitemap": "^4.1",
         "drupal/social_media_links": "^2.9",
+        "drupal/viewsreference": "^2.0@beta",
         "drupal/yaml_editor": "^1.2",
         "drush/drush": "^12.4",
         "wikimedia/composer-merge-plugin": "^2.1"

composer.lock

@@ -4,7 +4,7 @@
         "Read more about it at https://getcomposer.org/doc/01-basic-usage.md#installing-dependencies",
         "This file is @generated automatically"
     ],
-    "content-hash": "e636d8065f593dcf1268ea5aa1ecdd2d",
+    "content-hash": "410874c298658217f9eccd480c10c4e6",
     "packages": [
         {
             "name": "asm89/stack-cors",
@@ -7572,6 +7572,72 @@
                 "docs": "https://www.drupal.org/docs/8/modules/views-bulk-operations-vbo"
             }
         },
+        {
+            "name": "drupal/viewsreference",
+            "version": "2.0.0-beta10",
+            "source": {
+                "type": "git",
+                "url": "https://git.drupalcode.org/project/viewsreference.git",
+                "reference": "8.x-2.0-beta10"
+            },
+            "dist": {
+                "type": "zip",
+                "url": "https://ftp.drupal.org/files/projects/viewsreference-8.x-2.0-beta10.zip",
+                "reference": "8.x-2.0-beta10",
+                "shasum": "699c3f790d3dbe6ebcd890916409c66562a04eb4"
+            },
+            "require": {
+                "drupal/core": "^10 || ^11"
+            },
+            "conflict": {
+                "drupal/viewsreferennce": "*"
+            },
+            "require-dev": {
+                "drupal/views_ajax_history": "1.x-dev"
+            },
+            "type": "drupal-module",
+            "extra": {
+                "drupal": {
+                    "version": "8.x-2.0-beta10",
+                    "datestamp": "1725510905",
+                    "security-coverage": {
+                        "status": "not-covered",
+                        "message": "Beta releases are not covered by Drupal security advisories."
+                    }
+                }
+            },
+            "notification-url": "https://packages.drupal.org/8/downloads",
+            "license": [
+                "GPL-2.0-or-later"
+            ],
+            "authors": [
+                {
+                    "name": "joekers",
+                    "homepage": "https://www.drupal.org/user/2229066"
+                },
+                {
+                    "name": "NewZeal",
+                    "homepage": "https://www.drupal.org/user/93571"
+                },
+                {
+                    "name": "scott_euser",
+                    "homepage": "https://www.drupal.org/user/3267594"
+                },
+                {
+                    "name": "seanB",
+                    "homepage": "https://www.drupal.org/user/545912"
+                }
+            ],
+            "description": "Views reference",
+            "homepage": "http://drupal.org/project/viewsreference",
+            "keywords": [
+                "Drupal"
+            ],
+            "support": {
+                "source": "https://git.drupalcode.org/project/viewsreference",
+                "issues": "https://www.drupal.org/project/issues/viewsreference"
+            }
+        },
         {
             "name": "drupal/yaml_editor",
             "version": "1.2.0",
@@ -12708,6 +12774,7 @@
     "minimum-stability": "stable",
     "stability-flags": {
         "drupal/page_manager": 5,
+        "drupal/viewsreference": 10,
         "drupal/advanced_text_formatter": 5,
         "drupal/bulkdelete": 20,
         "drupal/config_ignore": 5,

config/sync/core.date_format.jj.yml

@@ -5,4 +5,4 @@ dependencies: {  }
 id: jj
 label: JJ/MM/AAAA
 locked: false
-pattern: d-m-Y
+pattern: d/m/Y

config/sync/core.entity_form_display.node.static.default.yml

@@ -4,6 +4,7 @@ status: true
 dependencies:
   config:
     - field.field.node.static.body
+    - field.field.node.static.field_map
     - field.field.node.static.field_pieces_jointes
     - field.field.node.static.field_textes
     - node.type.static
@@ -13,6 +14,7 @@ dependencies:
     - paragraphs
     - path
     - text
+    - viewsreference
 third_party_settings:
   field_group:
     group_details:
@@ -23,7 +25,7 @@ third_party_settings:
       label: Details
       region: content
       parent_name: ''
-      weight: 9
+      weight: 10
       format_type: details_sidebar
       format_settings:
         classes: ''
@@ -51,10 +53,20 @@ content:
     third_party_settings: {  }
   created:
     type: datetime_timestamp
-    weight: 4
+    weight: 5
     region: content
     settings: {  }
     third_party_settings: {  }
+  field_map:
+    type: viewsreference_autocomplete
+    weight: 2
+    region: content
+    settings:
+      match_operator: CONTAINS
+      match_limit: 10
+      size: 60
+      placeholder: ''
+    third_party_settings: {  }
   field_pieces_jointes:
     type: file_generic
     weight: 4
@@ -64,7 +76,7 @@ content:
     third_party_settings: {  }
   field_textes:
     type: paragraphs
-    weight: 2
+    weight: 3
     region: content
     settings:
       title: Paragraphe
@@ -89,27 +101,37 @@ content:
     third_party_settings: {  }
   path:
     type: path
-    weight: 7
+    weight: 8
     region: content
     settings: {  }
     third_party_settings: {  }
   promote:
     type: boolean_checkbox
-    weight: 5
+    weight: 6
     region: content
     settings:
       display_label: true
     third_party_settings: {  }
+  simple_sitemap:
+    weight: 11
+    region: content
+    settings: {  }
+    third_party_settings: {  }
+  simple_sitemap_index_now:
+    weight: 12
+    region: content
+    settings: {  }
+    third_party_settings: {  }
   status:
     type: boolean_checkbox
-    weight: 8
+    weight: 9
     region: content
     settings:
       display_label: true
     third_party_settings: {  }
   sticky:
     type: boolean_checkbox
-    weight: 6
+    weight: 7
     region: content
     settings:
       display_label: true
@@ -129,7 +151,7 @@ content:
     third_party_settings: {  }
   uid:
     type: entity_reference_autocomplete
-    weight: 3
+    weight: 4
     region: content
     settings:
       match_operator: CONTAINS

config/sync/core.entity_view_display.config_pages.diaporama_home.default.yml

@@ -6,7 +6,7 @@ dependencies:
     - config_pages.type.diaporama_home
     - field.field.config_pages.diaporama_home.field_images
     - field.field.config_pages.diaporama_home.field_video
-    - image.style.wide
+    - image.style.very_large
   module:
     - image_field_caption
     - video_embed_field
@@ -19,7 +19,7 @@ content:
     type: image_caption
     label: visually_hidden
     settings:
-      image_style: wide
+      image_style: very_large
       image_link: ''
       image_loading:
         attribute: lazy

config/sync/core.entity_view_display.node.actualite.full.yml

@@ -0,0 +1,101 @@
+uuid: 0ca5aa5d-c7a9-4dba-b6d2-aca25c3bd831
+langcode: fr
+status: true
+dependencies:
+  config:
+    - core.entity_view_mode.node.full
+    - field.field.node.actualite.body
+    - field.field.node.actualite.field_date
+    - field.field.node.actualite.field_fichiers
+    - field.field.node.actualite.field_images
+    - field.field.node.actualite.field_liens
+    - field.field.node.actualite.field_type_d_actualite
+    - image.style.wide
+    - node.type.actualite
+  module:
+    - datetime_range
+    - file
+    - image_field_caption
+    - link
+    - manage_display
+    - text
+id: node.actualite.full
+targetEntityType: node
+bundle: actualite
+mode: full
+content:
+  body:
+    type: text_default
+    label: hidden
+    settings: {  }
+    third_party_settings: {  }
+    weight: 3
+    region: content
+  field_date:
+    type: daterange_default
+    label: visually_hidden
+    settings:
+      timezone_override: ''
+      format_type: jj
+      separator: '-'
+    third_party_settings: {  }
+    weight: 5
+    region: content
+  field_fichiers:
+    type: file_default
+    label: visually_hidden
+    settings:
+      use_description_as_link_text: true
+    third_party_settings: {  }
+    weight: 6
+    region: content
+  field_images:
+    type: image_caption
+    label: visually_hidden
+    settings:
+      image_style: wide
+      image_link: ''
+      image_loading:
+        attribute: lazy
+    third_party_settings: {  }
+    weight: 0
+    region: content
+  field_liens:
+    type: link
+    label: visually_hidden
+    settings:
+      trim_length: 80
+      url_only: false
+      url_plain: false
+      rel: ''
+      target: ''
+    third_party_settings: {  }
+    weight: 7
+    region: content
+  field_type_d_actualite:
+    type: entity_reference_label
+    label: visually_hidden
+    settings:
+      link: true
+    third_party_settings: {  }
+    weight: 4
+    region: content
+  links:
+    settings: {  }
+    third_party_settings: {  }
+    weight: 2
+    region: content
+  title:
+    type: title
+    label: hidden
+    settings:
+      link_to_entity: true
+      tag: h2
+    third_party_settings: {  }
+    weight: 1
+    region: content
+hidden:
+  created: true
+  langcode: true
+  search_api_excerpt: true
+  uid: true

config/sync/core.entity_view_display.node.static.default.yml

@@ -4,6 +4,7 @@ status: true
 dependencies:
   config:
     - field.field.node.static.body
+    - field.field.node.static.field_map
     - field.field.node.static.field_pieces_jointes
     - field.field.node.static.field_textes
     - node.type.static
@@ -11,6 +12,7 @@ dependencies:
     - entity_reference_revisions
     - manage_display
     - text
+    - viewsreference
 _core:
   default_config_hash: 9mgezio6-8HiMYhQHSfouZjKyY4BFKR71Yh4kbSmAYU
 id: node.static.default
@@ -25,6 +27,15 @@ content:
     third_party_settings: {  }
     weight: 1
     region: content
+  field_map:
+    type: viewsreference_formatter
+    label: visually_hidden
+    settings:
+      plugin_types:
+        - block
+    third_party_settings: {  }
+    weight: 2
+    region: content
   field_textes:
     type: entity_reference_revisions_entity_view
     label: visually_hidden
@@ -32,12 +43,12 @@ content:
       view_mode: default
       link: ''
     third_party_settings: {  }
-    weight: 2
+    weight: 3
     region: content
   links:
     settings: {  }
     third_party_settings: {  }
-    weight: 3
+    weight: 4
     region: content
   title:
     type: title

config/sync/core.entity_view_display.node.static.full.yml

@@ -5,6 +5,7 @@ dependencies:
   config:
     - core.entity_view_mode.node.full
     - field.field.node.static.body
+    - field.field.node.static.field_map
     - field.field.node.static.field_pieces_jointes
     - field.field.node.static.field_textes
     - node.type.static
@@ -12,6 +13,7 @@ dependencies:
     - entity_reference_revisions
     - manage_display
     - text
+    - viewsreference
 _core:
   default_config_hash: 9mgezio6-8HiMYhQHSfouZjKyY4BFKR71Yh4kbSmAYU
 id: node.static.full
@@ -26,6 +28,18 @@ content:
     third_party_settings: {  }
     weight: 1
     region: content
+  field_map:
+    type: viewsreference_formatter
+    label: hidden
+    settings:
+      plugin_types:
+        block: block
+        default: '0'
+        page: '0'
+        feed: '0'
+    third_party_settings: {  }
+    weight: 2
+    region: content
   field_textes:
     type: entity_reference_revisions_entity_view
     label: visually_hidden
@@ -33,12 +47,12 @@ content:
       view_mode: default
       link: ''
     third_party_settings: {  }
-    weight: 2
+    weight: 3
     region: content
   links:
     settings: {  }
     third_party_settings: {  }
-    weight: 3
+    weight: 4
     region: content
   title:
     type: title

config/sync/core.entity_view_display.node.static.teaser.yml

@@ -5,6 +5,7 @@ dependencies:
   config:
     - core.entity_view_mode.node.teaser
     - field.field.node.static.body
+    - field.field.node.static.field_map
     - field.field.node.static.field_pieces_jointes
     - field.field.node.static.field_textes
     - node.type.static
@@ -33,6 +34,7 @@ content:
     region: content
 hidden:
   created: true
+  field_map: true
   field_pieces_jointes: true
   field_textes: true
   langcode: true

config/sync/core.extension.yml

@@ -119,6 +119,7 @@ module:
   views_bulk_edit: 0
   views_bulk_operations: 0
   views_ui: 0
+  viewsreference: 0
   yaml_editor: 0
   extlink: 1
   menu_admin_per_menu: 1

config/sync/field.field.node.static.field_map.yml

@@ -0,0 +1,36 @@
+uuid: b8723518-542b-4df0-97c5-04b632ac65bb
+langcode: fr
+status: true
+dependencies:
+  config:
+    - field.storage.node.field_map
+    - node.type.static
+    - views.view.site
+  module:
+    - viewsreference
+id: node.static.field_map
+field_name: field_map
+entity_type: node
+bundle: static
+label: map
+description: ''
+required: false
+translatable: false
+default_value:
+  -
+    target_uuid: 9e172612-e65e-4292-bb32-706c81ee98e3
+    display_id: block_3
+    data: 'a:6:{s:5:"pager";N;s:5:"title";N;s:5:"limit";N;s:6:"header";N;s:8:"argument";N;s:6:"offset";N;}'
+default_value_callback: ''
+settings:
+  handler: 'default:view'
+  handler_settings:
+    target_bundles: null
+    auto_create: false
+  plugin_types:
+    block: block
+  preselect_views:
+    site: site
+  enabled_settings:
+    title: title
+field_type: viewsreference

config/sync/field.storage.node.field_map.yml

@@ -0,0 +1,21 @@
+uuid: cd2ff55f-d680-4d0d-98a0-f95b36cef2d7
+langcode: fr
+status: true
+dependencies:
+  module:
+    - node
+    - views
+    - viewsreference
+id: node.field_map
+field_name: field_map
+entity_type: node
+type: viewsreference
+settings:
+  target_type: view
+module: viewsreference
+locked: false
+cardinality: 1
+translatable: true
+indexes: {  }
+persist_with_no_fields: false
+custom_storage: false

config/sync/image.style.very_large.yml

@@ -0,0 +1,15 @@
+uuid: 64bdc93e-a869-44e2-999f-ee11546c843f
+langcode: fr
+status: true
+dependencies: {  }
+name: very_large
+label: 'very large'
+effects:
+  a7bcfc53-03a8-402c-b7fc-db13ef4b5b8b:
+    uuid: a7bcfc53-03a8-402c-b7fc-db13ef4b5b8b
+    id: image_scale
+    weight: 1
+    data:
+      width: 2000
+      height: null
+      upscale: false

config/sync/page_manager.page_variant.home-panels_variant-0.yml

@@ -45,7 +45,7 @@ variant_settings:
       config_page_type: diaporama_home
       config_page_view_mode: full
       region: content
-      weight: -1
+      weight: -2
       uuid: 40cf53e9-ed23-4eeb-8f75-3dc26453edae
       css_classes:
         - ''

config/sync/system.image.gd.yml

@@ -1,4 +1,4 @@
 _core:
   default_config_hash: 4YcE8Hcsaj70JXlGGmatBaarAYPpNMonbFc3eRVZ3lo
 langcode: fr
-jpeg_quality: 75
+jpeg_quality: 95

config/sync/system.image.yml

@@ -1,4 +1,4 @@
 _core:
   default_config_hash: nXCKr4YHeXjNagehk2FVvVen05hIeLJJQOxL-EV1WdA
 langcode: fr
-toolkit: imagemagick
+toolkit: gd

config/sync/views.view.site.yml

@@ -644,6 +644,7 @@ display:
     display_plugin: block
     position: 2
     display_options:
+      title: 'sites map'
       fields:
         field_geofield:
           id: field_geofield
@@ -853,7 +854,7 @@ display:
             value: field_sous_titre
             options: '{"maxWidth":"300","minWidth":"50","autoPan":true}'
             view_mode: full
-          leaflet_map: esri-world_physical_map
+          leaflet_map: stamen-toner-lite
           height: '400'
           height_unit: px
           hide_empty_map: false
@@ -871,10 +872,10 @@ display:
             options: '{"position":"topright","setView":"untilPanOrZoom","returnToPrevBounds":true,"keepCurrentZoomLevel":true,"strings":{"title":"Locate my position"}}'
             automatic: false
           map_position:
-            force: false
+            force: true
             center:
-              lat: 0.0
-              lon: 0.0
+              lat: 46.5819227
+              lon: 2.4514603
             zoomControlPosition: topleft
             zoom: 5
             minZoom: 1
@@ -916,6 +917,7 @@ display:
         type: fields
         options: {  }
       defaults:
+        title: false
         style: false
         row: false
         fields: false
@@ -944,3 +946,312 @@ display:
       tags:
         - 'config:field.storage.node.field_geofield'
         - 'config:field.storage.node.field_sous_titre'
+  block_3:
+    id: block_3
+    display_title: 'Sites Map Home Bloc'
+    display_plugin: block
+    position: 2
+    display_options:
+      title: 'site home map'
+      fields:
+        field_geofield:
+          id: field_geofield
+          table: node__field_geofield
+          field: field_geofield
+          relationship: none
+          group_type: group
+          admin_label: ''
+          plugin_id: field
+          label: ''
+          exclude: true
+          alter:
+            alter_text: false
+            text: ''
+            make_link: false
+            path: ''
+            absolute: false
+            external: false
+            replace_spaces: false
+            path_case: none
+            trim_whitespace: false
+            alt: ''
+            rel: ''
+            link_class: ''
+            prefix: ''
+            suffix: ''
+            target: ''
+            nl2br: false
+            max_length: 0
+            word_boundary: true
+            ellipsis: true
+            more_link: false
+            more_link_text: ''
+            more_link_path: ''
+            strip_tags: false
+            trim: false
+            preserve_tags: ''
+            html: false
+          element_type: ''
+          element_class: ''
+          element_label_type: ''
+          element_label_class: ''
+          element_label_colon: false
+          element_wrapper_type: ''
+          element_wrapper_class: ''
+          element_default_classes: true
+          empty: ''
+          hide_empty: false
+          empty_zero: false
+          hide_alter_empty: true
+          click_sort_column: value
+          type: geofield_default
+          settings:
+            output_format: wkt
+            output_escape: true
+          group_column: value
+          group_columns: {  }
+          group_rows: true
+          delta_limit: 0
+          delta_offset: 0
+          delta_reversed: false
+          delta_first_last: false
+          multi_type: separator
+          separator: ', '
+          field_api_classes: false
+        field_sous_titre:
+          id: field_sous_titre
+          table: node__field_sous_titre
+          field: field_sous_titre
+          relationship: none
+          group_type: group
+          admin_label: ''
+          plugin_id: field
+          label: ''
+          exclude: false
+          alter:
+            alter_text: false
+            text: ''
+            make_link: false
+            path: ''
+            absolute: false
+            external: false
+            replace_spaces: false
+            path_case: none
+            trim_whitespace: false
+            alt: ''
+            rel: ''
+            link_class: ''
+            prefix: ''
+            suffix: ''
+            target: ''
+            nl2br: false
+            max_length: 0
+            word_boundary: true
+            ellipsis: true
+            more_link: false
+            more_link_text: ''
+            more_link_path: ''
+            strip_tags: false
+            trim: false
+            preserve_tags: ''
+            html: false
+          element_type: ''
+          element_class: ''
+          element_label_type: ''
+          element_label_class: ''
+          element_label_colon: false
+          element_wrapper_type: ''
+          element_wrapper_class: ''
+          element_default_classes: true
+          empty: ''
+          hide_empty: false
+          empty_zero: false
+          hide_alter_empty: true
+          click_sort_column: value
+          type: string
+          settings:
+            link_to_entity: true
+          group_column: value
+          group_columns: {  }
+          group_rows: true
+          delta_limit: 0
+          delta_offset: 0
+          delta_reversed: false
+          delta_first_last: false
+          multi_type: separator
+          separator: ', '
+          field_api_classes: false
+        title:
+          id: title
+          table: node_field_data
+          field: title
+          relationship: none
+          group_type: group
+          admin_label: ''
+          entity_type: node
+          entity_field: title
+          plugin_id: field
+          label: ''
+          exclude: false
+          alter:
+            alter_text: false
+            text: ''
+            make_link: false
+            path: ''
+            absolute: false
+            external: false
+            replace_spaces: false
+            path_case: none
+            trim_whitespace: false
+            alt: ''
+            rel: ''
+            link_class: ''
+            prefix: ''
+            suffix: ''
+            target: ''
+            nl2br: false
+            max_length: 0
+            word_boundary: true
+            ellipsis: true
+            more_link: false
+            more_link_text: ''
+            more_link_path: ''
+            strip_tags: false
+            trim: false
+            preserve_tags: ''
+            html: false
+          element_type: ''
+          element_class: ''
+          element_label_type: ''
+          element_label_class: ''
+          element_label_colon: false
+          element_wrapper_type: ''
+          element_wrapper_class: ''
+          element_default_classes: true
+          empty: ''
+          hide_empty: false
+          empty_zero: false
+          hide_alter_empty: true
+          click_sort_column: value
+          type: string
+          settings:
+            link_to_entity: true
+          group_column: value
+          group_columns: {  }
+          group_rows: true
+          delta_limit: 0
+          delta_offset: 0
+          delta_reversed: false
+          delta_first_last: false
+          multi_type: separator
+          separator: ', '
+          field_api_classes: false
+      arguments: {  }
+      style:
+        type: leaflet_map
+        options:
+          grouping: {  }
+          data_source:
+            field_geofield: field_geofield
+          entity_source: __base_table
+          name_field: ''
+          leaflet_tooltip:
+            value: title
+            options: '{"permanent":false,"direction":"center"}'
+          leaflet_popup:
+            value: field_sous_titre
+            options: '{"maxWidth":"300","minWidth":"50","autoPan":true}'
+            view_mode: full
+          leaflet_map: stamen-toner-lite
+          height: '400'
+          height_unit: px
+          hide_empty_map: false
+          disable_wheel: true
+          gesture_handling: false
+          fitbounds_options: '{"padding":[0,0]}'
+          reset_map:
+            control: false
+            options: '{"position":"topleft","title":"Reset View"}'
+          map_scale:
+            control: false
+            options: '{"position":"bottomright","maxWidth":100,"metric":true,"imperial":false,"updateWhenIdle":false}'
+          locate:
+            control: false
+            options: '{"position":"topright","setView":"untilPanOrZoom","returnToPrevBounds":true,"keepCurrentZoomLevel":true,"strings":{"title":"Locate my position"}}'
+            automatic: false
+          map_position:
+            force: true
+            center:
+              lat: 46.5819227
+              lon: 2.4514603
+            zoomControlPosition: topleft
+            zoom: 5
+            minZoom: 1
+            maxZoom: 18
+            zoomFiner: 0
+          weight: ''
+          icon:
+            iconType: marker
+            iconUrl: ''
+            shadowUrl: ''
+            className: ''
+            iconSize:
+              x: ''
+              'y': ''
+            iconAnchor:
+              x: ''
+              'y': ''
+            shadowSize:
+              x: ''
+              'y': ''
+            shadowAnchor:
+              x: ''
+              'y': ''
+            popupAnchor:
+              x: ''
+              'y': ''
+            html: '<div></div>'
+            html_class: leaflet-map-divicon
+            circle_marker_options: '{"radius":100,"color":"red","fillColor":"#f03","fillOpacity":0.5}'
+          fullscreen:
+            control: false
+            options: '{"position":"topleft","pseudoFullscreen":false}'
+          path: '{"color":"#3388ff","opacity":"1.0","stroke":true,"weight":3,"fill":"depends","fillColor":"*","fillOpacity":"0.2","radius":"6"}'
+          map_lazy_load:
+            lazy_load: false
+          feature_properties:
+            values: ''
+      row:
+        type: fields
+        options: {  }
+      defaults:
+        title: false
+        style: false
+        row: false
+        fields: false
+        arguments: false
+      display_description: ''
+      display_extenders:
+        matomo:
+          enabled: false
+          keyword_gets: ''
+          keyword_behavior: first
+          keyword_concat_separator: ' '
+          category_behavior: none
+          category_gets: ''
+          category_concat_separator: ' '
+          category_fallback: ''
+          category_facets: {  }
+          category_facets_concat_separator: ', '
+        simple_sitemap_display_extender: {  }
+      block_hide_empty: true
+    cache_metadata:
+      max-age: -1
+      contexts:
+        - 'languages:language_content'
+        - 'languages:language_interface'
+        - 'user.node_grants:view'
+        - user.permissions
+      tags:
+        - 'config:field.storage.node.field_geofield'
+        - 'config:field.storage.node.field_sous_titre'

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

@@ -407,7 +407,7 @@ header .header_nav_container #block-quartiers-de-demain-entete ul {
 }
 @media (max-width: 1090px) {
   header .header_nav_container #block-quartiers-de-demain-entete ul li {
-    padding-top: 0.3rem;
+    padding-top: 0.5rem;
   }
 }
 header .header_nav_container #block-quartiers-de-demain-entete ul li a {
@@ -417,7 +417,7 @@ header .header_nav_container #block-quartiers-de-demain-entete ul li a {
 }
 @media (max-width: 1090px) {
   header .header_nav_container #block-quartiers-de-demain-entete ul li a {
-    font-size: 0.6rem;
+    font-size: 0.9rem;
   }
 }
 @media (max-width: 500px) {
@@ -425,13 +425,12 @@ header .header_nav_container #block-quartiers-de-demain-entete ul li a {
     display: flex;
     flex-direction: column;
     align-items: center;
-    font-size: 0.9rem;
+    font-size: 1rem;
   }
 }
 header .header_nav_container #block-quartiers-de-demain-entete ul li:not(:last-of-type) ::after {
   content: "";
   display: block;
-  width: 80px;
   border-bottom: solid white 1px;
   padding-bottom: 0.3rem;
 }
@@ -580,11 +579,6 @@ footer {
 .footer #footer-left .footer_left_container .logo-qdd {
   display: none;
 }
-@media (max-width: 500px) {
-  .footer #footer-left .footer_left_container {
-    padding-left: 15%;
-  }
-}
 .footer #footer-left .footer_left_container #block-quartiers-de-demain-logoepau {
   height: fit-content;
   margin: auto;
@@ -629,6 +623,9 @@ footer {
   padding-bottom: 0.2rem;
 }
 @media (max-width: 700px) {
+  .footer #footer-middle #block-quartiers-de-demain-pieddepage {
+    padding-left: 40px;
+  }
   .footer #footer-middle #block-quartiers-de-demain-pieddepage ul {
     padding-left: 0rem;
   }
@@ -650,6 +647,11 @@ footer {
 .footer #footer-right #block-quartiers-de-demain-socialmedialinks {
   flex-direction: column;
 }
+@media (max-width: 700px) {
+  .footer #footer-right #block-quartiers-de-demain-socialmedialinks {
+    padding-left: 1rem;
+  }
+}
 .footer #footer-right #block-quartiers-de-demain-socialmedialinks h2 {
   display: flex;
   flex-direction: column;
@@ -657,6 +659,11 @@ footer {
   font-weight: 400;
   font-size: 0.6rem;
 }
+@media (max-width: 700px) {
+  .footer #footer-right #block-quartiers-de-demain-socialmedialinks h2 {
+    width: 50%;
+  }
+}
 .footer #footer-right #block-quartiers-de-demain-socialmedialinks li {
   padding: 0;
 }
@@ -1112,8 +1119,6 @@ footer {
   display: none;
 }
 
-/* TIMELINE
-–––––––––––––––––––––––––––––––––––––––––––––––––– */
 #home * {
   box-sizing: border-box;
 }
@@ -1136,138 +1141,94 @@ footer {
   padding-top: 4rem;
   font-size: 1.7rem;
 }
-#home .timeline {
-  display: flex;
-  flex-direction: column;
-  white-space: nowrap;
-  overflow: hidden;
+#home .__container-deroulement .config_pages--type--deroulement {
+  height: 550px;
+  margin-top: 4.5rem;
+}
+#home .__container-deroulement .config_pages--type--deroulement .field_field_phase {
+  height: 100%;
+}
+#home .__container-deroulement .config_pages--type--deroulement .field_field_phase .timeline {
+  height: 100%;
+}
+#home .__container-deroulement .config_pages--type--deroulement .field_field_phase .timeline .__timeline-content {
   padding-top: 2rem;
-  padding-bottom: 3rem;
-  height: 800px;
 }
-@media (max-width: 1090px) {
-  #home .timeline {
-    overflow: scroll;
-    height: 600px;
-  }
-}
-#home .timeline .__timeline-arrows {
-  width: fit-content;
-  margin: auto;
-  margin-top: 0;
-  margin-bottom: 4rem;
-  padding-bottom: 2rem;
-}
-@media (max-width: 1090px) {
-  #home .timeline .__timeline-arrows {
-    margin-bottom: 9rem;
-  }
-}
-#home .timeline .__timeline-arrows button {
-  background-color: transparent;
-  border: none;
-  padding-left: 1rem;
-}
-#home .timeline .__timeline-arrows button:hover {
-  opacity: 0.5;
-}
-@media (max-width: 1090px) {
-  #home .timeline .__timeline-arrows button svg {
-    padding: 0.5rem;
-  }
-}
-#home .timeline .__timeline-content {
-  width: fit-content;
-  padding-top: 7rem;
-  padding-bottom: 2rem;
-  padding-left: 3rem;
-  transition: all 1s;
-}
-#home .timeline .__timeline-content .__paragraphs {
-  position: relative;
-  display: inline-flex;
-  width: 600px;
-  height: 1px;
-  background: black;
-}
-#home .timeline .__timeline-content .__paragraphs:not(:first-child) {
-  margin-left: 14px;
-}
-#home .timeline .__timeline-content .__paragraphs::after {
-  content: "";
-  position: absolute;
-  top: 50%;
-  left: -18px;
-  bottom: 0;
-  width: 17px;
-  height: 17px;
-  transform: translateY(-50%);
-  border-radius: 50%;
-  background: black;
-}
-@media (max-width: 810px) {
-  #home .timeline .__timeline-content .__paragraphs {
-    width: 100vw;
-  }
-}
-#home .timeline .__timeline-content .__paragraphs .paragraph--type--phase-deroulement {
-  display: flex;
-  flex-direction: row;
-  position: absolute;
-  padding-bottom: 1rem;
-  left: -18px;
-  top: -16px;
-  transform: translateY(-100%);
-  width: 600px;
-  height: 300px;
-  font-size: 1rem;
-  white-space: normal;
-  color: black;
-}
-@media (max-width: 550px) {
-  #home .timeline .__timeline-content .__paragraphs .paragraph--type--phase-deroulement {
-    padding-left: 0rem;
-    width: 240px;
-    align-items: end;
-    height: 200px;
-  }
-}
-#home .timeline .__timeline-content .__paragraphs .paragraph--type--phase-deroulement .date {
-  width: fit-content;
-  display: flex;
-  flex-direction: column;
-  margin: auto;
-  margin-left: 0;
-  margin-right: 0;
-  align-items: flex-start;
-  padding-right: 1rem;
+#home .__container-deroulement .config_pages--type--deroulement .field_field_phase .timeline .__timeline-content .slick-track {
+  height: fit-content;
+  border-bottom: solid black 1px;
   margin-bottom: 1rem;
 }
-#home .timeline .__timeline-content .__paragraphs .paragraph--type--phase-deroulement .date .field_field_date_de_jour {
+@media (max-width: 500px) {
+  #home .__container-deroulement .config_pages--type--deroulement .field_field_phase .timeline .__timeline-content .slick-track {
+    flex-direction: column;
+    height: fit-content;
+  }
+}
+#home .__container-deroulement .config_pages--type--deroulement .field_field_phase .timeline .__timeline-content .slick-track.__paragraphs ::before {
+  content: ".";
+}
+#home .__container-deroulement .config_pages--type--deroulement .field_field_phase .timeline .__timeline-content .slick-track .paragraph--type--phase-deroulement {
+  display: flex;
+  flex-direction: row;
+  align-items: center;
+  padding-right: 1rem;
+  padding-bottom: 1rem;
+}
+@media (max-width: 500px) {
+  #home .__container-deroulement .config_pages--type--deroulement .field_field_phase .timeline .__timeline-content .slick-track .paragraph--type--phase-deroulement {
+    flex-direction: column;
+    align-items: baseline;
+  }
+}
+#home .__container-deroulement .config_pages--type--deroulement .field_field_phase .timeline .__timeline-content .slick-track .paragraph--type--phase-deroulement:before {
+  content: ".";
+  font-size: 4rem;
+  position: absolute;
+  top: 50%;
+  transform: translateY(-50%); /* Centrer parfaitement verticalement */
+}
+@media (max-width: 550px) {
+  #home .__container-deroulement .config_pages--type--deroulement .field_field_phase .timeline .__timeline-content .slick-track .paragraph--type--phase-deroulement:before {
+    display: none;
+  }
+}
+#home .__container-deroulement .config_pages--type--deroulement .field_field_phase .timeline .__timeline-content .slick-track .paragraph--type--phase-deroulement .date {
+  width: fit-content !important;
+  display: flex;
+  flex-direction: column;
+  padding-right: 1rem;
+}
+@media (max-width: 500px) {
+  #home .__container-deroulement .config_pages--type--deroulement .field_field_phase .timeline .__timeline-content .slick-track .paragraph--type--phase-deroulement .date {
+    padding-right: 0rem;
+  }
+}
+#home .__container-deroulement .config_pages--type--deroulement .field_field_phase .timeline .__timeline-content .slick-track .paragraph--type--phase-deroulement .date .field_field_date_de_jour {
   font-size: 2.5rem;
   line-height: 0.3rem;
 }
 @media (max-width: 550px) {
-  #home .timeline .__timeline-content .__paragraphs .paragraph--type--phase-deroulement .date .field_field_date_de_jour {
+  #home .__container-deroulement .config_pages--type--deroulement .field_field_phase .timeline .__timeline-content .slick-track .paragraph--type--phase-deroulement .date .field_field_date_de_jour {
     font-size: 3rem;
     line-height: 1.3rem;
   }
 }
-#home .timeline .__timeline-content .__paragraphs .paragraph--type--phase-deroulement .date .field_field_date_de_moi {
+#home .__container-deroulement .config_pages--type--deroulement .field_field_phase .timeline .__timeline-content .slick-track .paragraph--type--phase-deroulement .date .field_field_date_de_moi {
   padding-right: 0.2rem;
   text-transform: uppercase;
   font-size: 4rem;
   display: inline-flex;
 }
 @media (max-width: 550px) {
-  #home .timeline .__timeline-content .__paragraphs .paragraph--type--phase-deroulement .date .field_field_date_de_moi {
+  #home .__container-deroulement .config_pages--type--deroulement .field_field_phase .timeline .__timeline-content .slick-track .paragraph--type--phase-deroulement .date .field_field_date_de_moi {
     font-size: 4rem;
   }
 }
-#home .timeline .__timeline-content .__paragraphs .paragraph--type--phase-deroulement .date .field_field_date_de_moi .after::after {
+#home .__container-deroulement .config_pages--type--deroulement .field_field_phase .timeline .__timeline-content .slick-track .paragraph--type--phase-deroulement .date .field_field_date_de_moi .after::after {
   content: ".";
 }
-#home .timeline .__timeline-content .__paragraphs .paragraph--type--phase-deroulement .date .annee {
+#home .__container-deroulement .config_pages--type--deroulement .field_field_phase .timeline .__timeline-content .slick-track .paragraph--type--phase-deroulement .date .annee {
   display: flex;
   align-items: center;
   font-size: 0.6rem;
@@ -1275,71 +1236,72 @@ footer {
   top: -10px;
 }
 @media (max-width: 1090px) {
-  #home .timeline .__timeline-content .__paragraphs .paragraph--type--phase-deroulement .date .annee {
+  #home .__container-deroulement .config_pages--type--deroulement .field_field_phase .timeline .__timeline-content .slick-track .paragraph--type--phase-deroulement .date .annee {
     font-size: 1.2rem;
   }
 }
-#home .timeline .__timeline-content .__paragraphs .paragraph--type--phase-deroulement .date .annee .field_field_date_de_annee {
+#home .__container-deroulement .config_pages--type--deroulement .field_field_phase .timeline .__timeline-content .slick-track .paragraph--type--phase-deroulement .date .annee .field_field_date_de_annee {
   display: inline-flex;
   align-items: center;
 }
-#home .timeline .__timeline-content .__paragraphs .paragraph--type--phase-deroulement .date .annee .field_field_date_de_annee::after {
+#home .__container-deroulement .config_pages--type--deroulement .field_field_phase .timeline .__timeline-content .slick-track .paragraph--type--phase-deroulement .date .annee .field_field_date_de_annee::after {
   content: url("../img/noun-arrow-to-right-black.svg");
   display: flex;
 }
-#home .timeline .__timeline-content .__paragraphs .paragraph--type--phase-deroulement .date .annee .field_field_date_de_annee.only {
+#home .__container-deroulement .config_pages--type--deroulement .field_field_phase .timeline .__timeline-content .slick-track .paragraph--type--phase-deroulement .date .annee .field_field_date_de_annee.only {
   display: inline-flex;
   align-items: center;
 }
-#home .timeline .__timeline-content .__paragraphs .paragraph--type--phase-deroulement .date .annee .field_field_date_de_annee.only::after {
+#home .__container-deroulement .config_pages--type--deroulement .field_field_phase .timeline .__timeline-content .slick-track .paragraph--type--phase-deroulement .date .annee .field_field_date_de_annee.only::after {
   content: "";
   display: flex;
 }
-#home .timeline .__timeline-content .__paragraphs .paragraph--type--phase-deroulement .date .annee .date2 {
+#home .__container-deroulement .config_pages--type--deroulement .field_field_phase .timeline .__timeline-content .slick-track .paragraph--type--phase-deroulement .date .annee .date2 {
   display: inline-flex;
 }
-#home .timeline .__timeline-content .__paragraphs .paragraph--type--phase-deroulement .date .annee .date2 .field_field_date_a_jour {
+#home .__container-deroulement .config_pages--type--deroulement .field_field_phase .timeline .__timeline-content .slick-track .paragraph--type--phase-deroulement .date .annee .date2 .field_field_date_a_jour {
   padding-right: 0.2rem;
 }
-#home .timeline .__timeline-content .__paragraphs .paragraph--type--phase-deroulement .date .annee .date2 .field_field_date_a_moi {
+#home .__container-deroulement .config_pages--type--deroulement .field_field_phase .timeline .__timeline-content .slick-track .paragraph--type--phase-deroulement .date .annee .date2 .field_field_date_a_moi {
   padding-right: 0.2rem;
 }
-#home .timeline .__timeline-content .__paragraphs .paragraph--type--phase-deroulement .text {
+#home .__container-deroulement .config_pages--type--deroulement .field_field_phase .timeline .__timeline-content .slick-track .paragraph--type--phase-deroulement .text {
   border: solid rgb(7, 50, 194) 1px;
   border-radius: 5%;
   padding: 0.6rem 0.6rem;
   line-height: 1.1;
   width: 41%;
   min-width: 35%;
+  height: 300px;
 }
 @media (max-width: 1090px) {
-  #home .timeline .__timeline-content .__paragraphs .paragraph--type--phase-deroulement .text {
+  #home .__container-deroulement .config_pages--type--deroulement .field_field_phase .timeline .__timeline-content .slick-track .paragraph--type--phase-deroulement .text {
     height: 200px;
     min-width: 80%;
   }
 }
-#home .timeline .__timeline-content .__paragraphs .paragraph--type--phase-deroulement .text .field_field_titre {
-  font-size: 0.6rem;
+#home .__container-deroulement .config_pages--type--deroulement .field_field_phase .timeline .__timeline-content .slick-track .paragraph--type--phase-deroulement .text .field_field_titre {
+  font-size: 0.7rem;
   font-family: "gilroy-semibold";
 }
 @media (max-width: 1090px) {
-  #home .timeline .__timeline-content .__paragraphs .paragraph--type--phase-deroulement .text .field_field_titre {
+  #home .__container-deroulement .config_pages--type--deroulement .field_field_phase .timeline .__timeline-content .slick-track .paragraph--type--phase-deroulement .text .field_field_titre {
     font-size: 1rem;
   }
 }
-#home .timeline .__timeline-content .__paragraphs .paragraph--type--phase-deroulement .text .field_field_description {
+#home .__container-deroulement .config_pages--type--deroulement .field_field_phase .timeline .__timeline-content .slick-track .paragraph--type--phase-deroulement .text .field_field_description {
   font-family: "gilroy-regular";
 }
-#home .timeline .__timeline-content .__paragraphs .paragraph--type--phase-deroulement .text .field_field_description p {
-  font-size: 0.6rem !important;
+#home .__container-deroulement .config_pages--type--deroulement .field_field_phase .timeline .__timeline-content .slick-track .paragraph--type--phase-deroulement .text .field_field_description p {
+  font-size: 0.7rem !important;
   margin: 0;
 }
 @media (max-width: 1090px) {
-  #home .timeline .__timeline-content .__paragraphs .paragraph--type--phase-deroulement .text .field_field_description p {
+  #home .__container-deroulement .config_pages--type--deroulement .field_field_phase .timeline .__timeline-content .slick-track .paragraph--type--phase-deroulement .text .field_field_description p {
     font-size: 1rem !important;
   }
 }
-#home .timeline .__timeline-content .__paragraphs .paragraph--type--phase-deroulement .text .field_field_description .field--label-above {
+#home .__container-deroulement .config_pages--type--deroulement .field_field_phase .timeline .__timeline-content .slick-track .paragraph--type--phase-deroulement .text .field_field_description .field--label-above {
   display: none;
 }
 
@@ -1544,12 +1506,10 @@ header #block-quartiers-de-demain-logoquartiersdedemain .field_field_logo .qdd-h
 }
 
 #home #background-animated {
-  display: none;
   position: absolute;
-  top: -150px;
-  left: 0;
+  top: 2000px;
+  left: 350px;
   width: 100%;
-  height: 100%;
   pointer-events: none; /* Permet de cliquer à travers l'élément */
   z-index: 2; /* S'assure que l'élément soit au-dessus */
 }
@@ -1561,6 +1521,7 @@ header #block-quartiers-de-demain-logoquartiersdedemain .field_field_logo .qdd-h
 #home #background-animated svg {
   max-width: 100%;
   position: relative;
+  top: -1500px;
 }
 #home .layout-content {
   position: relative;
@@ -1653,20 +1614,23 @@ header #block-quartiers-de-demain-logoquartiersdedemain .field_field_logo .qdd-h
 #home .config_pages--type--diaporama-home {
   position: relative;
 }
-#home .config_pages--type--diaporama-home .swiper-container .swiper-wrapper .swiper-slide .cadre-img-zoom {
+#home .config_pages--type--diaporama-home .diaporama .slick-list {
+  padding: 0 !important;
+}
+#home .config_pages--type--diaporama-home .diaporama .slick-list .cadre-img-zoom {
   max-height: 1281px;
   overflow: hidden;
 }
-#home .config_pages--type--diaporama-home .swiper-container .swiper-wrapper .swiper-slide .cadre-img-zoom img {
+#home .config_pages--type--diaporama-home .diaporama .slick-list .cadre-img-zoom img {
   width: 100%;
   height: auto;
-  animation: zoomOut 3.5s ease-in infinite;
+  animation: zoomOut 2.5s ease-in infinite;
 }
-#home .config_pages--type--diaporama-home .swiper-container .swiper-wrapper .swiper-slide blockquote {
+#home .config_pages--type--diaporama-home .diaporama .slick-list blockquote {
   position: relative;
   top: -30px;
 }
-#home .config_pages--type--diaporama-home .swiper-container .swiper-wrapper .swiper-slide blockquote p {
+#home .config_pages--type--diaporama-home .diaporama .slick-list blockquote p {
   font-size: 0.4rem !important;
   font-family: "gilroy-regular";
   padding-top: 0.5rem;
@@ -1676,7 +1640,7 @@ header #block-quartiers-de-demain-logoquartiersdedemain .field_field_logo .qdd-h
     transform: scale(1);
   }
   100% {
-    transform: scale(1.1);
+    transform: scale(1.05);
   }
 }
 #home .content_container #block-quartiers-de-demain-titredepage {
@@ -2815,6 +2779,13 @@ header #block-quartiers-de-demain-logoquartiersdedemain .field_field_logo .qdd-h
 .node-type-site .layout--threecol-25-50-25 {
   flex-wrap: nowrap;
 }
+@media (max-width: 500px) {
+  .node-type-site .layout--threecol-25-50-25 {
+    display: flex;
+    flex-direction: column;
+    width: 100%;
+  }
+}
 .node-type-site .layout--threecol-25-50-25 .layout__region--first {
   flex: 1 0 20%;
   display: flex;
@@ -2824,6 +2795,11 @@ header #block-quartiers-de-demain-logoquartiersdedemain .field_field_logo .qdd-h
 .node-type-site .layout--threecol-25-50-25 .layout__region--first .block-region-first {
   width: 100%;
 }
+@media (max-width: 500px) {
+  .node-type-site .layout--threecol-25-50-25 .layout__region--first div:has(.field_field_documents) {
+    margin-top: 1rem;
+  }
+}
 .node-type-site .layout--threecol-25-50-25 .layout__region--first div:has(.field_field_documents) h2, .node-type-site .layout--threecol-25-50-25 .layout__region--first div:has(.field_field_documents) .field--label-above, .node-type-site .layout--threecol-25-50-25 .layout__region--first div:has(.field_field_documents) span:not(.file) {
   display: none;
 }
@@ -2833,6 +2809,11 @@ header #block-quartiers-de-demain-logoquartiersdedemain .field_field_logo .qdd-h
   font-size: 0.4rem;
   text-transform: uppercase;
 }
+@media (max-width: 500px) {
+  .node-type-site .layout--threecol-25-50-25 .layout__region--first div:has(.field_field_documents) .file--mime-application-pdf {
+    font-size: 0.8rem;
+  }
+}
 .node-type-site .layout--threecol-25-50-25 .layout__region--first div:has(.field_field_documents) .file--mime-application-pdf a {
   color: white;
   padding: 0.5rem 0.3rem;
@@ -2844,6 +2825,12 @@ header #block-quartiers-de-demain-logoquartiersdedemain .field_field_logo .qdd-h
   text-transform: uppercase;
   width: fit-content;
 }
+@media (max-width: 500px) {
+  .node-type-site .layout--threecol-25-50-25 .layout__region--first .field_field_liens_site div div {
+    margin-top: 0.5rem;
+    font-size: 0.8rem;
+  }
+}
 .node-type-site .layout--threecol-25-50-25 .layout__region--first .field_field_liens_site div div a {
   color: white;
   padding: 0.5rem 0.3rem;
@@ -2857,6 +2844,12 @@ header #block-quartiers-de-demain-logoquartiersdedemain .field_field_logo .qdd-h
   flex-wrap: wrap;
   margin-left: 2.5rem;
 }
+@media (max-width: 500px) {
+  .node-type-site .layout--threecol-25-50-25 .layout__region--second .block-region-second {
+    margin-left: 0.5rem;
+    margin-top: 1rem;
+  }
+}
 .node-type-site .layout--threecol-25-50-25 .layout__region--second .block-region-second .field_title,
 .node-type-site .layout--threecol-25-50-25 .layout__region--second .block-region-second .field_field_numero,
 .node-type-site .layout--threecol-25-50-25 .layout__region--second .block-region-second .field_field_sous_titre {
@@ -2874,6 +2867,9 @@ header #block-quartiers-de-demain-logoquartiersdedemain .field_field_logo .qdd-h
   padding-left: 0.4rem;
   padding-right: 0.4rem;
 }
+.node-type-site .layout--threecol-25-50-25 .layout__region--second .block-region-second div:has(.field_title) {
+  align-content: end;
+}
 .node-type-site .layout--threecol-25-50-25 .layout__region--second .block-region-second .field_field_sous_titre {
   font-size: 0.9rem;
   padding-left: 1.5rem;
@@ -2915,6 +2911,12 @@ header #block-quartiers-de-demain-logoquartiersdedemain .field_field_logo .qdd-h
   padding-left: 1rem;
   border-bottom: solid 1px rgb(247, 0, 43);
 }
+.node-type-site .layout--threecol-25-50-25 .layout__region--second .block-region-second div:has(.field_field_mots_clefs) h2 {
+  font-size: 0.5rem;
+  color: rgb(7, 50, 194);
+  text-transform: uppercase;
+  margin: 0;
+}
 .node-type-site .layout--threecol-25-50-25 .layout__region--second .block-region-second div:has(.field_field_mots_clefs) .field_field_mots_clefs {
   font-size: 0.5rem;
   color: rgb(7, 50, 194);
@@ -2922,6 +2924,11 @@ header #block-quartiers-de-demain-logoquartiersdedemain .field_field_logo .qdd-h
 .node-type-site .layout--threecol-25-50-25 .layout__region--second .block-region-second div:has(.field_field_parties) {
   margin-top: 2rem;
 }
+@media (max-width: 500px) {
+  .node-type-site .layout--threecol-25-50-25 .layout__region--second .block-region-second div:has(.field_field_parties) {
+    width: 100%;
+  }
+}
 .node-type-site .layout--threecol-25-50-25 .layout__region--second .block-region-second div:has(.field_field_parties) .paragraph--type--site-parts .field_field_titre_site {
   font-family: "gilroy-semibold";
   font-size: 0.6rem;
@@ -2936,6 +2943,11 @@ header #block-quartiers-de-demain-logoquartiersdedemain .field_field_logo .qdd-h
   flex-direction: row !important;
   justify-content: space-between;
 }
+@media (max-width: 500px) {
+  .node-type-site .layout--threecol-25-50-25 .layout__region--second .block-region-second .paragraph--type--site-diapo .field_field_images .diaporama {
+    flex-direction: column !important;
+  }
+}
 .node-type-site .layout--threecol-25-50-25 .layout__region--second .block-region-second .paragraph--type--site-diapo .field_field_images .diaporama .cadre-img-zoom {
   margin: auto;
 }
@@ -2951,10 +2963,22 @@ header #block-quartiers-de-demain-logoquartiersdedemain .field_field_logo .qdd-h
   font-size: 0.3rem;
   font-family: "gilroy-light";
 }
+@media (max-width: 500px) {
+  .node-type-site .layout--threecol-25-50-25 .layout__region--third {
+    display: flex;
+    flex-direction: column;
+    width: 100%;
+  }
+}
 .node-type-site .layout--threecol-25-50-25 .layout__region--third .block-region-third div {
   display: flex;
   flex-direction: row;
 }
+@media (max-width: 500px) {
+  .node-type-site .layout--threecol-25-50-25 .layout__region--third .block-region-third div {
+    justify-content: center;
+  }
+}
 .node-type-site .layout--threecol-25-50-25 .layout__region--third .block-region-third div .prev-site {
   padding-right: 0.5rem;
 }

web/themes/custom/quartiers_de_demain/dist/assets/img/carte-qdd-avec-points.svg

@@ -0,0 +1,191 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!-- Created with Inkscape (http://www.inkscape.org/) -->
+
+<svg
+   width="160.57019mm"
+   height="171.90887mm"
+   viewBox="0 0 160.57019 171.90887"
+   version="1.1"
+   id="svg1"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:svg="http://www.w3.org/2000/svg">
+  <defs
+     id="defs1">
+    <clipPath
+       clipPathUnits="userSpaceOnUse"
+       id="clipPath88">
+      <path
+         d="M 0,0 H 438.71561 V -470.27432 H 0 Z"
+         transform="matrix(1.3333333,0,0,-1.3333333,543.93475,1857.6088)"
+         clip-rule="evenodd"
+         id="path88" />
+    </clipPath>
+    <clipPath
+       clipPathUnits="userSpaceOnUse"
+       id="clipPath84">
+      <path
+         d="M 0,-470.27432 H 1260 V 470.27432 H 0 Z"
+         transform="translate(-407.036,-85.659762)"
+         id="path84" />
+    </clipPath>
+    <clipPath
+       clipPathUnits="userSpaceOnUse"
+       id="clipPath85">
+      <path
+         d="M 0,-470.27432 H 1260 V 470.27432 H 0 Z"
+         transform="translate(-2.5000001e-6,-470.27432)"
+         id="path85" />
+    </clipPath>
+  </defs>
+  <g
+     id="layer1"
+     transform="translate(-25.237685,-27.066503)">
+    <rect
+       style="fill:#b3b3b3;stroke:#f50029;stroke-width:0;paint-order:fill markers stroke"
+       id="rect1"
+       width="160.57019"
+       height="171.90887"
+       x="25.237686"
+       y="27.066502" />
+    <g
+       id="g87"
+       clip-path="url(#clipPath88)"
+       transform="matrix(0.26458333,0,0,0.26458333,-117.12499,-462.76799)">
+      <path
+         d="M 22.94948,0 24.34889,-18.0149 0,-25.72302 5.65439,-72.56693 20.36713,-85.65977 31.67962,-51.59929 30.80613,-4.91625 Z"
+         style="fill:#ffffff;fill-opacity:1;fill-rule:nonzero;stroke:none"
+         transform="matrix(1.3333333,0,0,-1.3333333,1086.6494,2370.4282)"
+         clip-path="url(#clipPath84)"
+         id="path86" />
+      <path
+         d="M 213.91022,-8.56159 245.88833,0 c 0,0 58.73522,-78.05274 188.63529,-102.77609 0,0 -13.72994,-23.9062 -20.7684,-68.77233 l -46.76509,-59.13289 22.59883,4.10628 9.98215,-59.15478 -15.22238,-6.69194 c 0,0 21.10627,-42.02694 33.11738,-51.15904 l -49.61728,-51.89156 c 0,0 -54.37257,40.3184 -83.08495,23.05862 -26.13166,-16.38332 -20.26669,-47.73592 -20.26669,-47.73592 l -84.48157,7.5286 -73.42912,23.87167 c 0,0 13.68285,68.86637 13.5616,120.85908 l 13.70164,-16.03089 -8.31311,25.90453 c -7.71795,24.04996 -30.44003,42.76792 -30.59939,44.58536 -3.6948,42.13802 -38.37183,51.8082 -82.82932,56.0101 L 0,-120.94655 l 48.38804,11.38921 63.90371,-13.15789 c 0,0 -1.62874,19.5427 -17.78042,51.54499 l 20.25382,7.61331 c 0,0 16.51357,-27.83033 25.80184,-26.51089 4.8781,0.69253 23.95695,21.70897 32.12568,26.76126 7.32295,4.5292 35.79484,10.58956 36.55389,13.534 2.94469,10.87069 4.66366,41.21097 4.66366,41.21097 z"
+         style="fill:#ffffff;fill-opacity:1;fill-rule:nonzero;stroke:none"
+         transform="matrix(1.3333333,0,0,-1.3333333,543.93475,1857.6088)"
+         clip-path="url(#clipPath85)"
+         id="path87" />
+    </g>
+    <path
+       id="path89"
+       d="m 141.42707,58.038178 c 2.54231,0 4.60352,-2.063358 4.60352,-4.608992 0,-2.545337 -2.06121,-4.608692 -4.60352,-4.608692 -2.54231,0 -4.60351,2.063355 -4.60351,4.608692 0,2.545634 2.0612,4.608992 4.60351,4.608992 z"
+       style="fill:#f7002b;fill-opacity:1;fill-rule:nonzero;stroke:#ffffff;stroke-width:0.699283;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" />
+    <path
+       id="path90"
+       d="m 141.42704,51.407326 v 4.045331"
+       style="fill:none;stroke:#ffffff;stroke-width:0.699283;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" />
+    <path
+       id="path91"
+       d="m 139.40669,53.429218 h 4.04052"
+       style="fill:none;stroke:#ffffff;stroke-width:0.699283;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" />
+    <path
+       id="path92"
+       d="m 114.16196,75.650697 c 2.54231,0 4.60352,-2.063358 4.60352,-4.608992 0,-2.545337 -2.06121,-4.608692 -4.60352,-4.608692 -2.54231,0 -4.60351,2.063355 -4.60351,4.608692 0,2.545634 2.0612,4.608992 4.60351,4.608992 z"
+       style="fill:#000000;fill-opacity:1;fill-rule:nonzero;stroke:#ffffff;stroke-width:0.699283;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" />
+    <path
+       id="path93"
+       d="m 114.16193,69.019844 v 4.045331"
+       style="fill:none;stroke:#ffffff;stroke-width:0.699283;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" />
+    <path
+       id="path94"
+       d="m 112.14158,71.041737 h 4.04052"
+       style="fill:none;stroke:#ffffff;stroke-width:0.699283;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1"
+       onmouseover="" />
+    <path
+       id="path92-1"
+       d="m 112.82019,38.104154 c 2.54231,0 4.60352,-2.063358 4.60352,-4.608992 0,-2.545337 -2.06121,-4.608692 -4.60352,-4.608692 -2.54231,0 -4.60351,2.063355 -4.60351,4.608692 0,2.545634 2.0612,4.608992 4.60351,4.608992 z"
+       style="fill:#000000;fill-opacity:1;fill-rule:nonzero;stroke:#ffffff;stroke-width:0.699283;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" />
+    <path
+       id="path93-2"
+       d="m 112.82016,31.473301 v 4.045331"
+       style="fill:none;stroke:#ffffff;stroke-width:0.699283;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" />
+    <path
+       id="path94-7"
+       d="m 110.79981,33.495194 h 4.04052"
+       style="fill:none;stroke:#ffffff;stroke-width:0.699283;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1"
+       onmouseover="" />
+    <path
+       id="path92-6"
+       d="m 171.98291,87.5186 c 2.54231,0 4.60352,-2.06336 4.60352,-4.60899 0,-2.545338 -2.06121,-4.608693 -4.60352,-4.608693 -2.54231,0 -4.60351,2.063355 -4.60351,4.608693 0,2.54563 2.0612,4.60899 4.60351,4.60899 z"
+       style="fill:#000000;fill-opacity:1;fill-rule:nonzero;stroke:#ffffff;stroke-width:0.699283;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" />
+    <path
+       id="path93-0"
+       d="M 171.98288,80.887748 V 84.93308"
+       style="fill:none;stroke:#ffffff;stroke-width:0.699283;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" />
+    <path
+       id="path94-6"
+       d="m 169.96253,82.90964 h 4.04052"
+       style="fill:none;stroke:#ffffff;stroke-width:0.699283;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1"
+       onmouseover="" />
+    <path
+       id="path95"
+       d="m 76.380105,65.10721 c 2.54231,0 4.60352,-2.063358 4.60352,-4.608992 0,-2.545337 -2.06121,-4.608692 -4.60352,-4.608692 -2.54231,0 -4.60351,2.063355 -4.60351,4.608692 0,2.545634 2.0612,4.608992 4.60351,4.608992 z"
+       style="fill:#000000;fill-opacity:1;fill-rule:nonzero;stroke:#ffffff;stroke-width:0.699283;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" />
+    <path
+       id="path96"
+       d="m 76.380085,58.476357 v 4.045331"
+       style="fill:none;stroke:#ffffff;stroke-width:0.699283;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" />
+    <path
+       id="path97"
+       d="m 74.359725,60.49825 h 4.04052"
+       style="fill:none;stroke:#ffffff;stroke-width:0.699283;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" />
+    <path
+       id="path98"
+       d="m 85.343635,85.361249 c 2.54231,0 4.60352,-2.063358 4.60352,-4.608992 0,-2.545337 -2.06121,-4.608692 -4.60352,-4.608692 -2.54231,0 -4.60351,2.063355 -4.60351,4.608692 0,2.545634 2.0612,4.608992 4.60351,4.608992 z"
+       style="fill:#000000;fill-opacity:1;fill-rule:nonzero;stroke:#ffffff;stroke-width:0.699283;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" />
+    <path
+       id="path99"
+       d="m 85.343615,78.730396 v 4.045331"
+       style="fill:none;stroke:#ffffff;stroke-width:0.699283;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" />
+    <path
+       id="path100"
+       d="m 83.323255,80.752289 h 4.04052"
+       style="fill:none;stroke:#ffffff;stroke-width:0.699283;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" />
+    <path
+       id="path101"
+       d="m 76.030555,143.13159 c 2.54231,0 4.60352,-2.06336 4.60352,-4.60899 0,-2.54534 -2.06121,-4.60869 -4.60352,-4.60869 -2.54231,0 -4.60351,2.06335 -4.60351,4.60869 0,2.54563 2.0612,4.60899 4.60351,4.60899 z"
+       style="fill:#000000;fill-opacity:1;fill-rule:nonzero;stroke:#ffffff;stroke-width:0.699283;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" />
+    <path
+       id="path102"
+       d="m 76.030525,136.50074 v 4.04533"
+       style="fill:none;stroke:#ffffff;stroke-width:0.699283;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" />
+    <path
+       id="path103"
+       d="m 74.010175,138.52263 h 4.04052"
+       style="fill:none;stroke:#ffffff;stroke-width:0.699283;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" />
+    <path
+       id="path104"
+       d="m 123.48097,159.75377 c 2.54231,0 4.60352,-2.06335 4.60352,-4.60899 0,-2.54534 -2.06121,-4.60869 -4.60352,-4.60869 -2.54231,0 -4.60351,2.06335 -4.60351,4.60869 0,2.54564 2.0612,4.60899 4.60351,4.60899 z"
+       style="fill:#000000;fill-opacity:1;fill-rule:nonzero;stroke:#ffffff;stroke-width:0.699283;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" />
+    <path
+       id="path105"
+       d="m 123.48095,153.12292 v 4.04533"
+       style="fill:none;stroke:#ffffff;stroke-width:0.699283;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" />
+    <path
+       id="path106"
+       d="m 121.4606,155.14479 h 4.04052"
+       style="fill:none;stroke:#ffffff;stroke-width:0.699283;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" />
+    <path
+       id="path107"
+       d="m 148.93452,166.64347 c 2.54231,0 4.60352,-2.06335 4.60352,-4.60899 0,-2.54534 -2.06121,-4.60869 -4.60352,-4.60869 -2.54231,0 -4.60351,2.06335 -4.60351,4.60869 0,2.54564 2.0612,4.60899 4.60351,4.60899 z"
+       style="fill:#000000;fill-opacity:1;fill-rule:nonzero;stroke:#ffffff;stroke-width:0.699283;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" />
+    <path
+       id="path108"
+       d="m 148.93448,160.01262 v 4.04533"
+       style="fill:none;stroke:#ffffff;stroke-width:0.699283;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" />
+    <path
+       id="path109"
+       d="m 146.91414,162.03448 h 4.04052"
+       style="fill:none;stroke:#ffffff;stroke-width:0.699283;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" />
+    <path
+       id="path110"
+       d="m 153.88746,157.38191 c 2.54231,0 4.60352,-2.06335 4.60352,-4.60899 0,-2.54534 -2.06121,-4.60869 -4.60352,-4.60869 -2.54231,0 -4.60351,2.06335 -4.60351,4.60869 0,2.54564 2.0612,4.60899 4.60351,4.60899 z"
+       style="fill:#000000;fill-opacity:1;fill-rule:nonzero;stroke:#ffffff;stroke-width:0.699283;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" />
+    <path
+       id="path111"
+       d="m 153.88743,150.75106 v 4.04533"
+       style="fill:none;stroke:#ffffff;stroke-width:0.699283;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" />
+    <path
+       id="path112"
+       d="m 151.8671,152.77293 h 4.04052"
+       style="fill:none;stroke:#ffffff;stroke-width:0.699283;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;stroke-dasharray:none;stroke-opacity:1" />
+  </g>
+</svg>

web/themes/custom/quartiers_de_demain/dist/assets/img/carte-qdd-vierge.svg

@@ -0,0 +1,64 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!-- Created with Inkscape (http://www.inkscape.org/) -->
+
+<svg
+   width="154.7691mm"
+   height="165.90233mm"
+   viewBox="0 0 154.7691 165.90233"
+   version="1.1"
+   id="svg1"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:svg="http://www.w3.org/2000/svg">
+  <defs
+     id="defs1">
+    <clipPath
+       clipPathUnits="userSpaceOnUse"
+       id="clipPath88">
+      <path
+         d="M 0,0 H 438.71561 V -470.27432 H 0 Z"
+         transform="matrix(1.3333333,0,0,-1.3333333,543.93475,1857.6088)"
+         clip-rule="evenodd"
+         id="path88" />
+    </clipPath>
+    <clipPath
+       clipPathUnits="userSpaceOnUse"
+       id="clipPath84">
+      <path
+         d="M 0,-470.27432 H 1260 V 470.27432 H 0 Z"
+         transform="translate(-407.036,-85.659762)"
+         id="path84" />
+    </clipPath>
+    <clipPath
+       clipPathUnits="userSpaceOnUse"
+       id="clipPath85">
+      <path
+         d="M 0,-470.27432 H 1260 V 470.27432 H 0 Z"
+         transform="translate(-2.5000001e-6,-470.27432)"
+         id="path85" />
+    </clipPath>
+  </defs>
+  <g
+     id="layer1"
+     transform="translate(-22.815678,-21.746124)">
+    <g
+       id="g448"
+       transform="matrix(0.26458333,0,0,0.26458333,-121.10039,-469.7462)">
+      <g
+         id="g87"
+         clip-path="url(#clipPath88)">
+        <path
+           d="M 22.94948,0 24.34889,-18.0149 0,-25.72302 5.65439,-72.56693 20.36713,-85.65977 31.67962,-51.59929 30.80613,-4.91625 Z"
+           style="fill:#ffffff;fill-opacity:1;fill-rule:nonzero;stroke:none"
+           transform="matrix(1.3333333,0,0,-1.3333333,1086.6494,2370.4282)"
+           clip-path="url(#clipPath84)"
+           id="path86" />
+        <path
+           d="M 213.91022,-8.56159 245.88833,0 c 0,0 58.73522,-78.05274 188.63529,-102.77609 0,0 -13.72994,-23.9062 -20.7684,-68.77233 l -46.76509,-59.13289 22.59883,4.10628 9.98215,-59.15478 -15.22238,-6.69194 c 0,0 21.10627,-42.02694 33.11738,-51.15904 l -49.61728,-51.89156 c 0,0 -54.37257,40.3184 -83.08495,23.05862 -26.13166,-16.38332 -20.26669,-47.73592 -20.26669,-47.73592 l -84.48157,7.5286 -73.42912,23.87167 c 0,0 13.68285,68.86637 13.5616,120.85908 l 13.70164,-16.03089 -8.31311,25.90453 c -7.71795,24.04996 -30.44003,42.76792 -30.59939,44.58536 -3.6948,42.13802 -38.37183,51.8082 -82.82932,56.0101 L 0,-120.94655 l 48.38804,11.38921 63.90371,-13.15789 c 0,0 -1.62874,19.5427 -17.78042,51.54499 l 20.25382,7.61331 c 0,0 16.51357,-27.83033 25.80184,-26.51089 4.8781,0.69253 23.95695,21.70897 32.12568,26.76126 7.32295,4.5292 35.79484,10.58956 36.55389,13.534 2.94469,10.87069 4.66366,41.21097 4.66366,41.21097 z"
+           style="fill:#ffffff;fill-opacity:1;fill-rule:nonzero;stroke:none"
+           transform="matrix(1.3333333,0,0,-1.3333333,543.93475,1857.6088)"
+           clip-path="url(#clipPath85)"
+           id="path87" />
+      </g>
+    </g>
+  </g>
+</svg>

web/themes/custom/quartiers_de_demain/dist/assets/img/carte-qdd.svg

@@ -0,0 +1,55 @@
+<!-- Image Map Generated by https://www.fla-shop.com/image-map/ -->
+<svg style="width:100%" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 585 627">
+   <style>
+   .image-mapper-shape {
+       fill: rgba(0, 0, 0, 0);
+   }
+   g:hover .image-mapper-shape {
+       stroke: white;
+       stroke-width: 2px;
+       opacity: 20%;
+   }
+   </style>
+           
+   <image xlink:href="carte-qdd-avec-points.svg" style="width: 585px;"></image>
+   <a xlink:href="#" target="---" xlink:title="">
+   <g>
+   <circle cx="223" cy="196" r="26.92582403567252" class="image-mapper-shape" data-index="1"></circle>
+   </g>
+   </a>
+   <a xlink:href="#" target="_self" xlink:title="Test 1">
+   <g>
+   <circle cx="185" cy="121" r="26.570660511172846" class="image-mapper-shape" data-index="2"></circle>
+   </g>
+   </a>
+   <a xlink:href="#" target="_self" xlink:title="test 2">
+   <g>
+   <circle cx="330" cy="158" r="24.08318915758459" class="image-mapper-shape" data-index="3"></circle>
+   </g>
+   </a>
+   <a xlink:href="#https://stage.quartiersdedemain.figli.io/sites/clone-colmar-test" target="_self" xlink:title="Sedan, Quartier du Lac">
+   <g>
+   <circle cx="433" cy="94" r="25.495097567963924" class="image-mapper-shape" data-index="4"></circle>
+   </g>
+   </a>
+   <a xlink:href="#" target="---" xlink:title="">
+   <g>
+   <circle cx="477" cy="464" r="24.20743687382041" class="image-mapper-shape" data-index="5"></circle>
+   </g>
+   </a>
+   <a xlink:href="#" target="---" xlink:title="">
+   <g>
+   <circle cx="458" cy="508" r="24.73863375370596" class="image-mapper-shape" data-index="6"></circle>
+   </g>
+   </a>
+   <a xlink:href="#" target="---" xlink:title="">
+   <g>
+   <circle cx="367" cy="478" r="22.67156809750927" class="image-mapper-shape" data-index="7"></circle>
+   </g>
+   </a>
+   <a xlink:href="#" target="---" xlink:title="">
+   <g>
+   <circle cx="183" cy="415" r="24.331050121192877" class="image-mapper-shape" data-index="8"></circle>
+   </g>
+   </a>
+   </svg>

web/themes/custom/quartiers_de_demain/dist/assets/img/formes-animees.svg

@@ -4,9 +4,9 @@
 <svg
    version="1.1"
    id="svg1"
-   width="100%"
-   height="100%"
-   viewBox="0 0 2560.2766 11997.26"
+   width="1440.5675"
+   height="6585.9683"
+   viewBox="0 0 1440.5675 6585.9684"
    xmlns="http://www.w3.org/2000/svg"
    xmlns:svg="http://www.w3.org/2000/svg">
   <defs
@@ -44,59 +44,55 @@
          id="path303" />
     </clipPath>
   </defs>
+  <g
+     id="g3"
+     transform="translate(-509.36305,-2445.5661)">
+    <g
+       id="g2">
       <g
          id="g1"
          transform="translate(0.17944336,-2.9196463)">
         <path
            id="path148"
-       d="M 0,0 211.55,177.512"
-       style="fill:none;stroke:#0833c2;stroke-width:70;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
-       transform="matrix(1.3333333,0,0,-1.3333333,1686.6035, 8750)" />
+           d="m 1544.4558,8077.9597 194.3574,-163.0856"
+           style="fill:none;stroke:#0833c2;stroke-width:64.3111;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" />
         <path
            id="path151"
-       d="M 0,0 V -174.775"
-       style="fill:none;stroke:#0833c2;stroke-width:85;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
-       transform="matrix(1.3333333,0,0,-1.3333333,2083.6333,1370.6667)" />
+           d="m 1818.0282,2628.0978 v 160.571"
+           style="fill:none;stroke:#0833c2;stroke-width:78.092;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" />
         <path
            id="path254"
-       d="M 0,0 C 0,126.805 -102.795,229.6 -229.6,229.6"
-       style="fill:none;stroke:#000000;stroke-width:100.482;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
-       transform="matrix(1.3333333,0,0,-1.3333333,1838.3405,9800)"
+           d="M 0,0 C 0,205.098 -166.265,371.361 -371.362,371.361"
+           style="fill:none;stroke:#000000;stroke-width:137.482;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
+           transform="matrix(0.91872984,0,0,-0.91872984,1649.0098,9034.4538)"
            clip-path="url(#clipPath255)" />
         <path
            id="path256"
-       d="M 0,0 177.512,-211.551"
-       style="fill:none;stroke:#0833c2;stroke-width:70;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
-       transform="matrix(1.3333333,0,0,-1.3333333,219.88347,2300)" />
+           d="m 533.81621,3347.9845 163.08557,194.3583"
+           style="fill:none;stroke:#0833c2;stroke-width:64.3111;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" />
         <path
            id="path257"
            d="M 0,0 C -205.098,0 -371.361,-166.265 -371.361,-371.362"
            style="fill:none;stroke:#f7002b;stroke-width:137.482;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
-       transform="matrix(1.3333333,0,0,-1.3333333,1460.9323,1201.6543)"
+           transform="matrix(0.91872984,0,0,-0.91872984,1388.9577,2511.6402)"
            clip-path="url(#clipPath258)" />
         <path
            id="path300"
            d="M 0,0 C 0,-126.805 102.795,-229.6 229.6,-229.6"
            style="fill:none;stroke:#f7002b;stroke-width:85;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
-       transform="matrix(1.3333333,0,0,-1.3333333,1968.6667,3850)"
+           transform="matrix(0.91872984,0,0,-0.91872984,1738.8107,4755.9014)"
            clip-path="url(#clipPath301)" />
         <path
            id="path302"
            d="M 0,0 C 0,126.805 -102.795,229.6 -229.6,229.6"
            style="fill:none;stroke:#0833c2;stroke-width:85;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
-       transform="matrix(1.3333333,0,0,-1.3333333,2165.1349,5700)"
+           transform="matrix(0.91872984,0,0,-0.91872984,1874.1866,6246.5711)"
            clip-path="url(#clipPath303)" />
         <path
            id="path311"
-       d="M 0,0 V 283"
-       style="fill:none;stroke:#000000;stroke-width:85;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
-       transform="matrix(1.3333333,0,0,-1.3333333,247.22107,5500)" />
-    <rect
-       style="fill:none;stroke:none;stroke-width:0.872103;paint-order:fill markers stroke"
-       id="rect717"
-       width="2559.4043"
-       height="11996.388"
-       x="0.25652406"
-       y="3.3556976" />
+           d="M 552.65311,6047.771 V 5787.7705"
+           style="fill:none;stroke:#000000;stroke-width:78.092;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" />
+      </g>
+    </g>
   </g>
 </svg>

web/themes/custom/quartiers_de_demain/dist/assets/img/formes-animees1.svg

@@ -0,0 +1,100 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!-- Created with Inkscape (http://www.inkscape.org/) -->
+
+<svg
+   version="1.1"
+   id="svg1"
+   width="6555016.5"
+   height="143934240"
+   viewBox="0 0 6555016.5 1.4393424e+08"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:svg="http://www.w3.org/2000/svg">
+  <defs
+     id="defs1">
+    <clipPath
+       clipPathUnits="userSpaceOnUse"
+       id="clipPath255">
+      <path
+         d="M 0,0 H 1920 V 9000 H 0 Z"
+         transform="translate(-1378.7554,-1136.295)"
+         id="path255" />
+    </clipPath>
+    <clipPath
+       clipPathUnits="userSpaceOnUse"
+       id="clipPath258">
+      <path
+         d="M 0,0 H 1920 V 9000 H 0 Z"
+         transform="translate(-1095.6993,-8098.7595)"
+         id="path258" />
+    </clipPath>
+    <clipPath
+       clipPathUnits="userSpaceOnUse"
+       id="clipPath301">
+      <path
+         d="M 0,0 H 1920 V 9000 H 0 Z"
+         transform="translate(-1476.5001,-5895.4337)"
+         id="path301" />
+    </clipPath>
+    <clipPath
+       clipPathUnits="userSpaceOnUse"
+       id="clipPath303">
+      <path
+         d="M 0,0 H 1920 V 9000 H 0 Z"
+         transform="translate(-1623.8512,-4272.9005)"
+         id="path303" />
+    </clipPath>
+  </defs>
+  <path
+     id="path151"
+     d="m 2083.8127,1367.7471 v 233.0333"
+     style="fill:none;stroke:#0833c2;stroke-width:113.333;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" />
+  <path
+     id="path256"
+     d="m 220.06291,2297.0804 236.68266,282.068"
+     style="fill:none;stroke:#0833c2;stroke-width:93.3333;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" />
+  <path
+     id="path257"
+     d="M 0,0 C -205.098,0 -371.361,-166.265 -371.361,-371.362"
+     style="fill:none;stroke:#f7002b;stroke-width:137.482;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
+     transform="matrix(1.3333333,0,0,-1.3333333,1461.1117,1198.7347)"
+     clip-path="url(#clipPath258)" />
+  <path
+     id="path300"
+     d="M 0,0 C 0,-126.805 102.795,-229.6 229.6,-229.6"
+     style="fill:none;stroke:#f7002b;stroke-width:85;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
+     transform="matrix(1.3333333,0,0,-1.3333333,1968.8461,3847.0804)"
+     clip-path="url(#clipPath301)" />
+  <path
+     id="path302"
+     d="M 0,0 C 0,126.805 -102.795,229.6 -229.6,229.6"
+     style="fill:none;stroke:#0833c2;stroke-width:85;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
+     transform="matrix(1.3333333,0,0,-1.3333333,2165.3143,5697.0804)"
+     clip-path="url(#clipPath303)" />
+  <path
+     id="path311"
+     d="M 247.40051,5497.0804 V 5119.7471"
+     style="fill:none;stroke:#000000;stroke-width:113.333;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" />
+  <g
+     id="g2">
+    <g
+       id="g1">
+      <path
+         id="path148"
+         d="m 1686.7829,8157.0804 282.0667,-236.6827"
+         style="fill:none;stroke:#0833c2;stroke-width:93.3333;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" />
+      <path
+         id="path254"
+         d="M 0,0 C 0,126.805 -102.795,229.6 -229.6,229.6"
+         style="fill:none;stroke:#000000;stroke-width:100.482;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
+         transform="matrix(1.3333333,0,0,-1.3333333,1838.5199,9207.0804)"
+         clip-path="url(#clipPath255)" />
+      <rect
+         style="fill:none;stroke:none;stroke-width:0.872103;paint-order:fill markers stroke"
+         id="rect717"
+         width="2559.4043"
+         height="11996.388"
+         x="0.43596742"
+         y="0.43605134" />
+    </g>
+  </g>
+</svg>

web/themes/custom/quartiers_de_demain/dist/assets/img/linkedin.svg

@@ -1,45 +1,23 @@
 <?xml version="1.0" encoding="UTF-8" standalone="no"?>
 <svg
-   width="43.904964"
-   height="44.141781"
+   width="35.86787"
+   height="36.061337"
    version="1.1"
    id="svg1"
-   sodipodi:docname="linkedin.svg"
-   inkscape:version="1.3.2 (091e20ef0f, 2023-11-25, custom)"
-   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
-   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
    xmlns="http://www.w3.org/2000/svg"
    xmlns:svg="http://www.w3.org/2000/svg">
-  <sodipodi:namedview
-     id="namedview1"
-     pagecolor="#ffffff"
-     bordercolor="#666666"
-     borderopacity="1.0"
-     inkscape:showpageshadow="2"
-     inkscape:pageopacity="0.0"
-     inkscape:pagecheckerboard="0"
-     inkscape:deskcolor="#d1d1d1"
-     inkscape:zoom="15.223672"
-     inkscape:cx="26.504775"
-     inkscape:cy="27.260177"
-     inkscape:window-width="1920"
-     inkscape:window-height="1016"
-     inkscape:window-x="1920"
-     inkscape:window-y="156"
-     inkscape:window-maximized="1"
-     inkscape:current-layer="svg1" />
   <defs
      id="defs1" />
   <ellipse
-     style="fill:#000000;fill-opacity:1;fill-rule:evenodd;stroke:none;stroke-width:0.768923;stroke-linecap:round;stroke-linejoin:round;paint-order:stroke fill markers"
+     style="fill:#000000;fill-opacity:1;fill-rule:evenodd;stroke:none;stroke-width:0.628166;stroke-linecap:round;stroke-linejoin:round;paint-order:stroke fill markers"
      id="path2"
-     cx="21.952482"
-     cy="22.07089"
-     rx="21.952482"
-     ry="22.07089" />
+     cx="17.933935"
+     cy="18.030668"
+     rx="17.933935"
+     ry="18.030668" />
   <path
-     d="m 34.099761,32.005576 v -8.752069 c 0,-4.689063 -2.502831,-6.871018 -5.841366,-6.871018 -2.69393,0 -3.900424,1.481732 -4.572124,2.52137 v -2.163417 h -5.074116 c 0.06703,1.433246 0,15.265134 0,15.265134 h 5.074116 v -8.525315 c 0,-0.45493 0.0328,-0.911288 0.166856,-1.236442 0.366512,-0.911288 1.200789,-1.855375 2.602659,-1.855375 1.836836,0 2.571286,1.399018 2.571286,3.451198 v 8.167359 z M 13.265651,14.656889 c 1.768382,0 2.870769,-1.173692 2.870769,-2.638313 -0.0328,-1.49742 -1.102387,-2.6368856 -2.837968,-2.6368856 -1.735582,0 -2.869343,1.1394656 -2.869343,2.6368856 0,1.466048 1.100962,2.638313 2.805168,2.638313 z M 15.80271,32.005576 V 16.740442 h -5.072689 v 15.265134 z"
+     d="m 27.857574,26.146744 v -7.149945 c 0,-3.830699 -2.044671,-5.613232 -4.772064,-5.613232 -2.20079,0 -3.186427,1.21049 -3.735167,2.059816 v -1.767389 h -4.145266 c 0.05475,1.170881 0,12.47075 0,12.47075 h 4.145266 v -6.964699 c 0,-0.371652 0.02679,-0.744471 0.136311,-1.010104 0.29942,-0.74447 0.980977,-1.515736 2.126226,-1.515736 1.50059,0 2.100594,1.142918 2.100594,2.819433 v 6.672271 z M 10.837286,11.973848 c 1.444669,0 2.345256,-0.958839 2.345256,-2.1553512 -0.02679,-1.223307 -0.900587,-2.154186 -2.318459,-2.154186 -1.4178721,0 -2.3440921,0.930879 -2.3440921,2.154186 0,1.1976782 0.899424,2.1553512 2.2916641,2.1553512 z m 2.072632,14.172896 V 13.675994 H 8.7658199 v 12.47075 z"
      fill="#ffffff"
      id="path2-9"
-     style="stroke-width:1.42611" />
+     style="stroke-width:1.16505" />
 </svg>

web/themes/custom/quartiers_de_demain/dist/assets/img/linkedin2.svg

@@ -1,21 +1,23 @@
 <?xml version="1.0" encoding="UTF-8" standalone="no"?>
 <svg
-   enable-background="new 0 0 32 32"
+   width="32.583511"
+   height="32.759266"
    version="1.1"
-   viewBox="0 0 31.999998 32"
-   xml:space="preserve"
-   id="svg2"
-   width="31.999998"
-   height="32"
+   id="svg1"
    xmlns="http://www.w3.org/2000/svg"
-   xmlns:svg="http://www.w3.org/2000/svg"><defs
-     id="defs2" /><g
-     id="g1"
-     style="fill:#000000;fill-opacity:1"><path
-       d="M 16,0 C 7.163,0 0,7.163 0,16 0,24.836 7.163,32 16,32 24.837,32 32,24.836 32,16 32,7.163 24.837,0 16,0 Z"
-       fill="#333333"
-       id="path1"
-       style="fill:#000000;fill-opacity:1" /></g><path
-     d="m 24.294,22.942 v -6.137 c 0,-3.288 -1.755,-4.818 -4.096,-4.818 -1.889,0 -2.735,1.039 -3.206,1.768 v -1.517 h -3.558 c 0.047,1.005 0,10.704 0,10.704 h 3.558 v -5.978 c 0,-0.319 0.023,-0.639 0.117,-0.867 0.257,-0.639 0.842,-1.301 1.825,-1.301 1.288,0 1.803,0.981 1.803,2.42 v 5.727 z M 9.6849997,10.777 C 10.925,10.777 11.698,9.954 11.698,8.927 11.675,7.877 10.925,7.078 9.7079997,7.078 8.491,7.078 7.696,7.877 7.696,8.927 c 0,1.028 0.7720001,1.85 1.9669997,1.85 z M 11.464,22.942 V 12.238 H 7.9070001 v 10.704 z"
+   xmlns:svg="http://www.w3.org/2000/svg">
+  <defs
+     id="defs1" />
+  <ellipse
+     style="fill:#000000;fill-opacity:1;fill-rule:evenodd;stroke:none;stroke-width:0.570646;stroke-linecap:round;stroke-linejoin:round;paint-order:stroke fill markers"
+     id="path2"
+     cx="16.291756"
+     cy="16.379631"
+     rx="16.291756"
+     ry="16.379631" />
+  <path
+     d="m 25.306704,23.752532 v -6.495237 c 0,-3.479928 -1.857444,-5.099238 -4.335095,-5.099238 -1.999267,0 -2.894651,1.099648 -3.393144,1.871202 v -1.605552 h -3.765691 c 0.04974,1.063665 0,11.328825 0,11.328825 h 3.765691 v -6.326954 c 0,-0.33762 0.02434,-0.676301 0.123829,-0.91761 0.272003,-0.6763 0.891151,-1.376943 1.931531,-1.376943 1.363184,0 1.908247,1.038263 1.908247,2.561263 V 23.75359 Z M 9.8449345,10.877424 c 1.3123825,0 2.1305045,-0.87104 2.1305045,-1.9579904 -0.02434,-1.111291 -0.818122,-1.956931 -2.1061615,-1.956931 -1.28804,0 -2.129447,0.84564 -2.129447,1.956931 0,1.0880094 0.817065,1.9579904 2.08182,1.9579904 z M 11.727779,23.752532 V 12.423707 H 7.9631485 v 11.328825 z"
      fill="#ffffff"
-     id="path2" /></svg>
+     id="path2-9"
+     style="stroke-width:1.05837" />
+</svg>

web/themes/custom/quartiers_de_demain/quartiers_de_demain.libraries.yml

@@ -1,5 +1,6 @@
 # Main theme library.
 global:
+  version: 0.1
   js:
     dist/assets/bundle.js: {}
     librairies/slick-1.8.1/slick/slick.min.js: {}

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

@@ -1,10 +1,11 @@
 document.addEventListener('scroll', function() {
     const scrolled = window.pageYOffset;
     const background = document.getElementById('background-animated');
-  
+    if (background) {
       // Adjust this value to control the speed of the parallax effect
       const parallaxSpeed = 0.2;
       background.style.transform = 'translateY(' + (scrolled * parallaxSpeed) + 'px)';
+    }
 });
 
 
@@ -34,6 +35,7 @@ document.addEventListener('scroll', function() {
 //ANimation Pilliers 
 const svg = document.querySelector('#paragraph-id--7 .colone-picto');
 
+if (svg) {
   // Configuration de l'observateur d'intersection
   const observer = new IntersectionObserver(entries => {
     entries.forEach(entry => {
@@ -52,3 +54,5 @@ const observer = new IntersectionObserver(entries => {
   
   // Observer l'élément SVG
   observer.observe(svg);
+  
+}

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

@@ -286,62 +286,85 @@
 
   ////////////////////////  end script smooth apparition des textes /////////////////
 
-  //////////////////// start Timeline script ///////////////////////
+  // //////////////////// start Timeline script ///////////////////////
 
-  document.addEventListener('DOMContentLoaded', function() {
-    let currentSlide = 0;
+  // // document.addEventListener('DOMContentLoaded', function() {
+  // //   let currentSlide = 0;
   
-    //// responsive ///
-    function getVisibleSlides() {
-      if (window.innerWidth <= 600) {
-        return 1; // Show 1 slide on small screens
-      } else if (window.innerWidth <= 900) {
-        return 4; // Show 4 slides on medium screens
-      } else {
-        return 4; // Show 4 slides on large screens
-      }
-    }
+  // //   //// responsive ///
+  // //   function getVisibleSlides() {
+  // //     if (window.innerWidth <= 600) {
+  // //       return 1; // Show 1 slide on small screens
+  // //     } else if (window.innerWidth <= 900) {
+  // //       return 4; // Show 4 slides on medium screens
+  // //     } else {
+  // //       return 4; // Show 4 slides on large screens
+  // //     }
+  // //   }
   
-    function showSlides(index) {
-      const slides = document.querySelectorAll('.__paragraphs');
-      const totalSlides = slides.length;
-      const visibleSlides = getVisibleSlides();
-      const maxSlide = totalSlides - visibleSlides;
+  // //   function showSlides(index) {
+  // //     const slides = document.querySelectorAll('.__paragraphs');
+  // //     const totalSlides = slides.length;
+  // //     const visibleSlides = getVisibleSlides();
+  // //     const maxSlide = totalSlides - visibleSlides;
   
-      // Adjust the index to ensure it loops
-      if (index > maxSlide) {
-        currentSlide = 0; // Go back to the first slide
-      } else if (index < 0) {
-        currentSlide = maxSlide; // Go to the last slide
-      } else {
-        currentSlide = index;
-      }
+  // //     // Adjust the index to ensure it loops
+  // //     if (index > maxSlide) {
+  // //       currentSlide = 0; // Go back to the first slide
+  // //     } else if (index < 0) {
+  // //       currentSlide = maxSlide; // Go to the last slide
+  // //     } else {
+  // //       currentSlide = index;
+  // //     }
   
-      // Calculate the offset for the transform
-      const offset = currentSlide * -50 / visibleSlides;
-      const offsetmobile = currentSlide * -10 / visibleSlides;
-      if (window.innerWidth <= 600){
-        document.querySelector('.__timeline-content').style.transform = `translateX(${offsetmobile}%)`;
-      } else {
-        document.querySelector('.__timeline-content').style.transform = `translateX(${offset}%)`;
-      }
+  // //     // Calculate the offset for the transform
+  // //     const offset = currentSlide * -50 / visibleSlides;
+  // //     const offsetmobile = currentSlide * -10 / visibleSlides;
+  // //     let timeline = document.querySelector('.__timeline-content');
+  // //     if (timeline) {
+  // //       if (window.innerWidth <= 600){
+  // //         timeline.style.transform = `translateX(${offsetmobile}%)`;
+  // //       } else {
+  // //         timeline.style.transform = `translateX(${offset}%)`;
+  // //       }
+  // //     }
   
-      // Enable/disable arrows based on the current slide
-      document.getElementById('arrowPrev').disabled = false; // Always enabled now
-      document.getElementById('arrowNext').disabled = false; // Always enabled now
-    }
+  // //     // Enable/disable arrows based on the current slide
+  // //     // document.getElementById('arrowPrev').disabled = false; // Always enabled now
+  // //     // document.getElementById('arrowNext').disabled = false; // Always enabled now
+  // //     // Attach event listeners
+  // //     let arrowprev = document.getElementById('arrowPrev');
+  // //     if (arrowprev) {
+  // //       arrowprev.disabled = false; // Always enabled now
+  // //     }
+  // //     let arrownext = document.getElementById('arrowNext')
+  // //     if (arrownext) {
+  // //       arrownext.disabled = false; // Always enabled now
+  // //     }
+  // //   }
   
-    function prevSlide() {
-      showSlides(currentSlide - 1);
-    }
+  // //   // function prevSlide() {
+  // //   //   showSlides(currentSlide - 1);
+  // //   // }
   
-    function nextSlide() {
-      showSlides(currentSlide + 1);
-    }
+  // //   // function nextSlide() {
+  // //   //   showSlides(currentSlide + 1);
+  // //   // }
+  
+  // //   // // Attach event listeners
+  // //   // document.getElementById('arrowPrev').addEventListener('click', prevSlide);
+  // //   // document.getElementById('arrowNext').addEventListener('click', nextSlide);
+  
+  // //   // Attach event listeners
+  // //   let arrowprev = document.getElementById('arrowPrev');
+  // //   if (arrowprev) {
+  // //     arrowprev.addEventListener('click', prevSlide);
+  // //   }
+  // //   let arrownext = document.getElementById('arrowNext')
+  // //   if (arrownext) {
+  // //     arrownext.addEventListener('click', nextSlide);
+  // //   }
     
-    // Attach event listeners
-    document.getElementById('arrowPrev').addEventListener('click', prevSlide);
-    document.getElementById('arrowNext').addEventListener('click', nextSlide);
 
     // Update month field to only show the first 3 letters
     document.querySelectorAll('.paragraph--type--phase-deroulement').forEach(function(paragraph) {
@@ -390,20 +413,55 @@
       }
     });
   
-    // Configuration de l'observateur
-    const config = { childList: true, subtree: true };
+  //   // Configuration de l'observateur
+  //   const config = { childList: true, subtree: true };
   
-    // Démarrer l'observateur sur le document entier ou sur un conteneur spécifique
-    observer.observe(document.body, config);
+  //   // Démarrer l'observateur sur le document entier ou sur un conteneur spécifique
+  //   observer.observe(document.body, config);
+  
+  // //   // Handle window resize
+  // //   window.addEventListener('resize', function() {
+  // //     showSlides(currentSlide); // Recalculate the slides on resize
+  // //   });
+  
+  // //   // Initialize
+  // //   showSlides(currentSlide);
+  // // });
+
+  //   ////////////////////// start  calendrier home   /////////////////////////////////
+    $(document).ready(function(){
+      $('.__timeline-content').slick({
+        slidesToShow: 3,
+        // slidesToScroll: 1,
+        dots: false,
+        arrows: true,
+        centerMode: true,
+        adaptiveHeight: true,
+        autoplay: false,
+        draggable: true,
+        // autoplaySpeed: 1500,
+        infinite: true,
+        // centerPadding: '100px',
+        responsive: [
+          {
+            breakpoint: 810,
+            settings: {
+              slidesToShow: 1,
+              adaptiveHeight: false,
+              arrows: true,
+              draggable: true,
+              centerMode: true,
+              autoplay: false,
+              // autoplaySpeed: 2000,
+            }
+          }]
+      });
+      console.log('salut slick calendrier');
     
-    // Handle window resize
-    window.addEventListener('resize', function() {
-      showSlides(currentSlide); // Recalculate the slides on resize
       });
     
-    // Initialize
-    showSlides(currentSlide);
-  });
+  //       ////////////////////// end   calendrier home   /////////////////////////////////
+  
   
 
   //////////////////////// end Timeline script /////////////////////////////////////////////
@@ -427,7 +485,9 @@
  ////////////  slideshow home  ////////////////////////// 
 
   $(document).ready(function(){
-      $('.content-actus .view').slick({
+      let actuview = $('.content-actus .view')
+      if (actuview) {
+        actuview.slick({
           slidesToShow: 3,
           // slidesToScroll: 1,
           dots: false,
@@ -454,29 +514,83 @@
         });
         console.log('salut slick home');
         
+      }
+
   });
 
       ////////////////////// start  diaporama home swiper  /////////////////////////////////
       
-      $(document).ready(function () {
-        //initialize swiper when document ready
-        var mySwiper = new Swiper ('.swiper-container', {
+      // PAS DE SWIPER CHARGÉ DANS L'ENV JS ...
 
-          speed: 400,
-          spaceBetween: 100,
-          // Optional parameters
-          autoplay: {
-            delay: 3000,
-            disableOnInteraction: false,
-          },
-          direction: 'horizontal',
-          loop: true,
-        })
-      });
+      // $(document).ready(function () {
+      //   //initialize swiper when document ready
+      //   let mySwiper = new Swiper ('.swiper-container', {
+          
+      //     speed: 400,
+      //     spaceBetween: 100,
+      //     // Optional parameters
+      //     autoplay: {
+      //       delay: 3000,
+      //       disableOnInteraction: false,
+      //     },
+      //     direction: 'horizontal',
+      //     loop: true,
+      //   })
+      // });
   
       ////////////////////// end  diaporama home swiper /////////////////////////////////
   
 
+  ////////////////////// start  diaporama home swiper  /////////////////////////////////
+
+  // $(document).ready(function () {
+  //   //initialize swiper when document ready
+  //   var mySwiper = new Swiper ('.swiper-container', {
+      
+  //     speed: 400,
+  //     spaceBetween: 100,
+  //     // Optional parameters
+  //     autoplay: {
+  //       delay: 3000,
+  //       disableOnInteraction: false,
+  //     },
+  //     direction: 'horizontal',
+  //     loop: true,
+  //   })
+  // });
+
+  ////////////////////// end  diaporama home swiper /////////////////////////////////
+
+  $(document).ready(function(){
+    let diapohome = $('.config_pages--type--diaporama-home .diaporama');
+    if (diapohome) {
+      diapohome.slick({
+        slidesToShow: 1,
+        dots: false,
+        arrows: false,
+        centerMode: false,  // Désactivé pour éviter les sauts
+        adaptiveHeight: false,  // Désactivé pour éviter les changements de hauteur
+        autoplay: true,
+        autoplaySpeed: 2000,
+        infinite: true,
+        responsive: [
+          {
+            breakpoint: 810,
+            settings: {
+              slidesToShow: 1,
+              adaptiveHeight: false,
+              arrows: true,
+              draggable: true,
+              centerMode: true,  // Désactivé seulement pour les petits écrans
+            }
+          }]
+      });
+      console.log('Diaporama initialisé');
+    }
+});
+
+
+  
 
 })(jQuery, window);
 

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

@@ -4,17 +4,16 @@
     .config_pages--type--diaporama-home{
         position: relative;
         
-            .swiper-container{
-                .swiper-wrapper{
-                    .swiper-slide {
-                        
+        .diaporama{
+            .slick-list{
+                padding: 0 !important;   
                     .cadre-img-zoom{
                         max-height: 1281px;
                         overflow:hidden;
                         img{
                             width: 100%;
                             height: auto;
-                                animation: zoomOut 3.5s ease-in infinite;
+                            animation: zoomOut 2.5s ease-in infinite;
                         }
                     }
                     blockquote{
@@ -32,13 +31,12 @@
                             transform: scale(1);
                             }
                             100% {
-                                transform: scale(1.1);
+                            transform: scale(1.05);
                             }
                     }
                         
             }     
         }
-            }
         
     }
     .content_container{

web/themes/custom/quartiers_de_demain/src/assets/scss/pages/node-type-site.scss

@@ -8,6 +8,11 @@
     }
     .layout--threecol-25-50-25{
         flex-wrap: nowrap;
+        @media(max-width: 500px){
+            display: flex;
+            flex-direction: column;
+            width: 100%;
+        }
         .layout__region--first{
             flex: 1 0 20%;
             display: flex;
@@ -20,6 +25,9 @@
                 // width: fit-content;
             }
             div:has(.field_field_documents){
+                @media(max-width: 500px){
+                    margin-top: 1rem;
+                }
                 
                 h2, .field--label-above, span:not(.file){
                     display: none;
@@ -29,6 +37,9 @@
                     color: white;
                     font-size: 0.4rem;
                     text-transform: uppercase;
+                    @media(max-width: 500px){
+                        font-size: 0.8rem;
+                    }
                     a{
                         color: white;
                         padding: 0.5rem 0.3rem;
@@ -42,6 +53,10 @@
                 font-size: 0.4rem;
                 text-transform: uppercase;
                 width: fit-content;
+                @media(max-width: 500px){
+                    margin-top: 0.5rem;
+                    font-size: 0.8rem;
+                }
                 a{
                     color: white;
                     padding: 0.5rem 0.3rem;
@@ -55,6 +70,10 @@
                 flex-direction: row;
                 flex-wrap: wrap;
                 margin-left: 2.5rem;
+                @media(max-width: 500px){
+                    margin-left: 0.5rem;
+                    margin-top: 1rem;
+                }
                 .field_title, 
                 .field_field_numero,
                 .field_field_sous_titre{
@@ -77,6 +96,10 @@
         
                     }
                 }
+                div:has(.field_title){
+                    align-content: end;
+                }
+
                 .field_field_sous_titre{
                     font-size: 0.9rem;
                     padding-left: 1.5rem;
@@ -125,6 +148,12 @@
                     flex: 0 0 25%;
                     padding-left: 1rem;
                     border-bottom: solid 1px $red_QDD;
+                    h2{
+                        font-size: 0.5rem;
+                        color: $blue_QDD;
+                        text-transform: uppercase;
+                        margin: 0;
+                    }
                     .field_field_mots_clefs{
                         font-size: 0.5rem;
                         color: $blue_QDD;
@@ -133,6 +162,9 @@
     
                 div:has(.field_field_parties){
                     margin-top: 2rem;
+                    @media(max-width: 500px){
+                        width: 100%;
+                    }
                     .paragraph--type--site-parts{
                         
                         .field_field_titre_site{
@@ -154,6 +186,9 @@
                             display: flex !important;
                             flex-direction: row !important;
                             justify-content: space-between;
+                            @media(max-width: 500px){
+                                flex-direction: column !important;
+                            }
                             .cadre-img-zoom{
                                margin: auto;
                                 img{
@@ -180,10 +215,19 @@
 
 
         .layout__region--third{
+            @media(max-width: 500px){
+                display: flex;
+                flex-direction: column;
+                width: 100%;
+            }
             .block-region-third{
                 div{
                     display: flex;
                     flex-direction: row;
+                    @media(max-width: 500px){
+                        justify-content: center;
+                    }
+
                     .prev-site{
                         padding-right: 0.5rem;
                         &::before{

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

@@ -41,7 +41,7 @@ footer{
                 // max-width: 50vw;
             }
             @media (max-width: 500px){
-                padding-left: 15%;
+                // padding-left: 15%;
             }
             display: flex;
             flex-direction: row;
@@ -94,6 +94,7 @@ footer{
                 padding-bottom: 0.2rem;
             }
             @media(max-width: 700px){
+                padding-left: 40px;
              ul{
                  padding-left: 0rem;
              }
@@ -120,6 +121,9 @@ footer{
         #block-quartiers-de-demain-socialmedialinks{
             // display: none;
             flex-direction: column;
+            @media (max-width: 700px){
+                padding-left: 1rem;
+             }
             h2{
                 display: flex;
                 flex-direction: column;
@@ -128,6 +132,9 @@ footer{
                 
                 // padding-bottom: 0.6rem;
                 font-size: 0.6rem;
+                @media (max-width: 700px){
+                    width: 50%;
+                 }
 
             }
             // .fa-3x{

web/themes/custom/quartiers_de_demain/src/assets/scss/partials/formes-animees.scss

@@ -1,12 +1,12 @@
 #home{
 
   #background-animated {
-    display: none;
+    // display: none;
       position: absolute;
-      top: -150px;
-      left: 0;
+      top: 2000px;
+      left: 350px;
       width: 100%;
-      height: 100%;
+      // height: 100%;
       pointer-events: none; /* Permet de cliquer à travers l'élément */
       z-index: 2; /* S'assure que l'élément soit au-dessus */
       @media(max-width: 1400px){
@@ -15,7 +15,7 @@
     svg{
       max-width: 100%;
       position: relative;
-      // top: -1500px;
+      top: -1500px;
     }
   }
   // .not-visible{

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

@@ -149,20 +149,20 @@ header{
                 }
                 li{
                     @media(max-width: 1090px){
-                        padding-top: 0.3rem;
+                        padding-top: 0.5rem;
                     }
                     a{
                         text-transform: uppercase;
                         color: white;
                         font-size: 0.5rem;
                         @media(max-width:1090px){
-                            font-size: 0.6rem;
+                            font-size: 0.9rem;
                         }
                         @media(max-width: 500px){
                             display: flex;
                             flex-direction: column;
                             align-items: center;
-                            font-size: 0.9rem;
+                            font-size: 1rem;
                         }
                        
                     }
@@ -170,7 +170,7 @@ header{
                         ::after{
                             content: "";
                             display: block;
-                            width: 80px;
+                            // width: 80px;
                             border-bottom: solid white 1px;
                             padding-bottom: 0.3rem;
                         }

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

@@ -1,6 +1,6 @@
 
-/* TIMELINE
-–––––––––––––––––––––––––––––––––––––––––––––––––– */
+// /* TIMELINE
+// –––––––––––––––––––––––––––––––––––––––––––––––––– */
 #home{
    
     * { box-sizing: border-box; }
@@ -21,119 +21,61 @@
             font-size: 1.7rem;
 
         }
-
-    }
+        .config_pages--type--deroulement{
+            height: 550px;
+            margin-top: 4.5rem;
+            .field_field_phase{
+                height: 100%;
                 .timeline{
-        display: flex;
-        flex-direction: column;
-        white-space: nowrap;
-        overflow: hidden;
-        padding-top: 2rem;
-        padding-bottom: 3rem;
-        height: 800px;
-        @media(max-width:1090px){
-            // padding-top: 14rem;
-            overflow: scroll;
-            height: 600px;
-        }
-        .__timeline-arrows{
-            width: fit-content;
-            margin: auto;
-            margin-top: 0;
-            margin-bottom: 4rem;
-            padding-bottom: 2rem;
-            @media(max-width:1090px){
-                // top: -211px;
-                // display: none;
-                margin-bottom: 9rem;
-            }
-            button{
-                background-color: transparent;
-                border: none; 
-                padding-left: 1rem;
-                &:hover{
-                    opacity: 0.5;
-                } 
-                @media(max-width:1090px){
-                    svg{
-                        padding: 0.5rem;
-                    }               
-                }   
-            }
-        }
+                    height: 100%;
                     .__timeline-content{
-            // font-size: 0;
-            // width: 100vw;
-            width: fit-content;
-            padding-top: 7rem;
-            padding-bottom: 2rem;
-            padding-left: 3rem;
-            transition: all 1s;
-            .__paragraphs{
-                position: relative;
-                display: inline-flex;
-                width: 600px;
-                height: 1px;
-                background: black;
-                // &:last-of-type{
-                //     height: 0px;
-                // }
-                // &:last-child {
-                //     width: 20px;
-                // }
-                &:not(:first-child) {
-                    margin-left: 14px;
-                }
-                &::after {
-                    content: "";
-                    position: absolute;
-                    top: 50%;
-                    left: -18px;
-                    bottom: 0;
-                    width: 17px;
-                    height: 17px;
-                    transform: translateY(-50%);
-                    border-radius: 50%;
-                    background: black;
-                }
-                @media(max-width:810px){
-                    width: 100vw;
+                        padding-top: 2rem;
+
+                        .slick-track{
+                            height: fit-content;
+                            border-bottom: solid black 1px;
+                            margin-bottom: 1rem;
+                            @media(max-width:500px){
+                                flex-direction: column;
+                                height: fit-content;
                             }
 
+                            &.__paragraphs{
+                               ::before{
+                                   content: '.';
+                               } 
+                            }
                             .paragraph--type--phase-deroulement{
                                 display: flex;
                                 flex-direction: row;
-                    position: absolute;
+                                align-items: center;
+                                padding-right: 1rem;
                                 padding-bottom: 1rem;
-                    // left: 65%;
-                    left: -18px;
-                    top: -16px;
-                    transform: translateY(-100%);
-                    width: 600px;
-                    height: 300px;
-                    font-size: 1rem;
-                    white-space: normal;
-                    color: black;
-                    
-                    // padding-bottom: 1rem;
-                    // padding-left: 2rem;
-                    // padding-right: 2rem;
-                    @media(max-width:550px){
-                        padding-left: 0rem;
-                        width: 240px;
-                        align-items: end;
-                        height: 200px;
+                                @media(max-width:500px){
+                                    flex-direction: column;
+                                    align-items: baseline;
                                 }
+                                // border-bottom: solid black 1px;
+                                &:before{
+                                    content:".";
+                                    font-size: 4rem;
+                                    position: absolute;
+                                    top: 50%; 
+                                    transform: translateY(-50%); /* Centrer parfaitement verticalement */
+                                    @media(max-width:550px){
+                                        display: none;
+                                    }
+ 
+                                }
+                                
                                 .date{
-                        width: fit-content;
+                                    width: fit-content !important;
                                     display: flex;
                                     flex-direction: column;
-                        margin: auto;
-                        margin-left: 0;
-                        margin-right: 0;
-                        align-items: flex-start;
                                     padding-right: 1rem;
-                        margin-bottom: 1rem;
+                                    @media(max-width:500px){
+                                        padding-right: 0rem;
+                                    }
                                     .field_field_date_de_jour{
                                         font-size: 2.5rem;
                                         line-height: 0.3rem;
@@ -154,6 +96,7 @@
                                             &::after{
                                                 content: '.';
                                             }
+                                           
                                         }
                                         
                                     }
@@ -200,9 +143,6 @@
                         
                                     }
                                         
-    
-
-
                                 }
                         
                                 .text{
@@ -212,12 +152,15 @@
                                     line-height: 1.1;
                                     width: 41%;
                                     min-width: 35%;
+                                    height: 300px;
+                                   
+                                    
                                     @media(max-width:1090px){
                                         height: 200px;
                                         min-width: 80%;
                                     }
                                     .field_field_titre{
-                            font-size: 0.6rem;
+                                        font-size: 0.7rem;
                                         // font-weight: 800;
                                         font-family: 'gilroy-semibold';
                                         @media(max-width:1090px){
@@ -227,7 +170,7 @@
                                     .field_field_description{
                                         font-family: 'gilroy-regular';
                                         p{
-                                font-size: 0.6rem !important;
+                                            font-size: 0.7rem !important;
                                             margin: 0;  
                                             @media(max-width:1090px){
                                                 font-size: 1rem !important;
@@ -242,5 +185,11 @@
                             }
                         }
                     }
+                    
+                }
+            }
+        }
+   
+
     }
 }

web/themes/custom/quartiers_de_demain/templates/field--config-pages--deroulement.html.twig

@@ -68,14 +68,14 @@
   <div{{ attributes }}>
     <div{{ title_attributes.addClass(title_classes) }}>{{ label }}</div>
     <div class='timeline'>
-      <div class="__timeline-arrows">
+      {# <div class="__timeline-arrows">
         <button id='arrowPrev' class="arrow arrow__prev" aria-label="Previous" type="button"> 
           {% include active_theme_path() ~ '/dist/assets/img/prev.svg' %}
         </button>
         <button id='arrowNext' class="arrow arrow__next" aria-label="Next" type="button">
           {% include active_theme_path() ~ '/dist/assets/img/next.svg' %}
         </button>
-      </div>
+      </div> #}
       <div class="__timeline-content">
         {% if multiple %}
         {% endif %}

web/themes/custom/quartiers_de_demain/templates/field--config-pages--diaporama-home.html.twig

@@ -50,6 +50,8 @@
 {%
   set ancre_href = '#paragraph-id--' ~ paragraph.id()
 %}
+
+
 {% if label_hidden %}
   {% if multiple %}
     <div {{ attributes }}>
@@ -63,16 +65,16 @@
     {% endfor %}
   {% endif %}
 {% else %}
-  <div class="swiper-container" {{ attributes }}>
+  <div class="diaporama" {{ attributes }}>
     <div {{ title_attributes.addClass(title_classes) }}>{{ label }}</div>
     {% if multiple %}
-      <div class="swiper-wrapper">
+      {# <div class=""> #}
     {% endif %}
     {% for item in items %}
-      <div class="swiper-slide" {{ item.attributes }}>{{ item.content }}</div>
+      <div class="photo" {{ item.attributes }}>{{ item.content }}</div>
     {% endfor %}
     {% if multiple %}
-      </div>
+      {# </div> #}
     {% endif %}
   </div>
 {% endif %}

web/themes/custom/quartiers_de_demain/templates/page--front.html.twig

@@ -80,10 +80,13 @@
         </div>
       </div> #}
       {{ page.content }}
+
     </div>{# /.layout-content #}
     <div id="background-animated" >
           {% include active_theme_path() ~ '/dist/assets/img/formes-animees.svg' %}
+          <img src="/themes/custom/quartiers_de_demain/dist/assets/img/formes-animees.svg" id="formes-animees"/>
     </div>
+
     {% if page.sidebar_first %}
       <aside class="layout-sidebar-first" role="complementary">
         {{ page.sidebar_first }}