diving on partie

2026-01-26 10:23:04 +01:00
parent bf3c7a562b
commit dec9de2644
11 changed files with 363 additions and 40 deletions
--- a/composer.json
+++ b/composer.json
@@ -22,6 +22,7 @@
        "drupal/core-recommended": "^10.4",
        "drupal/entity_block": "^2.0",
        "drupal/page_manager": "^4.0@RC",
+        "drupal/paragraphs": "^1.20",
        "drupal/upgrade_status": "^4.3",
        "wikimedia/composer-merge-plugin": "^2.1"
    },
--- a/composer.lock
+++ b/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": "ac9d6b4c23e1156901adb2d3916d33bf",
+    "content-hash": "14cfea0e9a67e8b560b3100650c92c1d",
    "packages": [
        {
            "name": "asm89/stack-cors",
@@ -4020,6 +4020,68 @@
                "source": "https://git.drupalcode.org/project/entity_clone"
            }
        },
+        {
+            "name": "drupal/entity_reference_revisions",
+            "version": "1.14.0",
+            "source": {
+                "type": "git",
+                "url": "https://git.drupalcode.org/project/entity_reference_revisions.git",
+                "reference": "8.x-1.14"
+            },
+            "dist": {
+                "type": "zip",
+                "url": "https://ftp.drupal.org/files/projects/entity_reference_revisions-8.x-1.14.zip",
+                "reference": "8.x-1.14",
+                "shasum": "cb900e41124979a46da1912ff2b502270beda632"
+            },
+            "require": {
+                "drupal/core": "^10.2 || ^11"
+            },
+            "conflict": {
+                "drush/drush": "<12.5.1"
+            },
+            "require-dev": {
+                "drupal/diff": "^1 || ^2"
+            },
+            "type": "drupal-module",
+            "extra": {
+                "drupal": {
+                    "version": "8.x-1.14",
+                    "datestamp": "1767266825",
+                    "security-coverage": {
+                        "status": "covered",
+                        "message": "Covered by Drupal's security advisory policy"
+                    }
+                }
+            },
+            "notification-url": "https://packages.drupal.org/8/downloads",
+            "license": [
+                "GPL-2.0-or-later"
+            ],
+            "authors": [
+                {
+                    "name": "berdir",
+                    "homepage": "https://www.drupal.org/user/214652"
+                },
+                {
+                    "name": "frans",
+                    "homepage": "https://www.drupal.org/user/514222"
+                },
+                {
+                    "name": "jeroen.b",
+                    "homepage": "https://www.drupal.org/user/1853532"
+                },
+                {
+                    "name": "miro_dietiker",
+                    "homepage": "https://www.drupal.org/user/227761"
+                }
+            ],
+            "description": "Entity Reference Revisions",
+            "homepage": "https://www.drupal.org/project/entity_reference_revisions",
+            "support": {
+                "source": "https://git.drupalcode.org/project/entity_reference_revisions"
+            }
+        },
        {
            "name": "drupal/extlink",
            "version": "2.0.5",
@@ -5591,6 +5653,87 @@
                "source": "https://git.drupalcode.org/project/pagerer"
            }
        },
+        {
+            "name": "drupal/paragraphs",
+            "version": "1.20.0",
+            "source": {
+                "type": "git",
+                "url": "https://git.drupalcode.org/project/paragraphs.git",
+                "reference": "8.x-1.20"
+            },
+            "dist": {
+                "type": "zip",
+                "url": "https://ftp.drupal.org/files/projects/paragraphs-8.x-1.20.zip",
+                "reference": "8.x-1.20",
+                "shasum": "68051cc8c025aa3f62fd44a219d158361928a4ad"
+            },
+            "require": {
+                "drupal/core": "^10.3 || ^11",
+                "drupal/entity_reference_revisions": "~1.3"
+            },
+            "require-dev": {
+                "drupal/block_field": "1.x-dev",
+                "drupal/diff": "1.x-dev",
+                "drupal/entity_browser": "2.x-dev",
+                "drupal/entity_usage": "2.x-dev",
+                "drupal/feeds": "^3",
+                "drupal/field_group": "3.x-dev",
+                "drupal/inline_entity_form": "3.x-dev",
+                "drupal/paragraphs-paragraphs_library": "*",
+                "drupal/replicate": "1.x-dev",
+                "drupal/search_api": "^1",
+                "drupal/search_api_db": "*"
+            },
+            "suggest": {
+                "drupal/entity_browser": "Recommended for an improved user experience when using the Paragraphs library module"
+            },
+            "type": "drupal-module",
+            "extra": {
+                "drupal": {
+                    "version": "8.x-1.20",
+                    "datestamp": "1767269542",
+                    "security-coverage": {
+                        "status": "covered",
+                        "message": "Covered by Drupal's security advisory policy"
+                    }
+                }
+            },
+            "notification-url": "https://packages.drupal.org/8/downloads",
+            "license": [
+                "GPL-2.0-or-later"
+            ],
+            "authors": [
+                {
+                    "name": "berdir",
+                    "homepage": "https://www.drupal.org/user/214652"
+                },
+                {
+                    "name": "frans",
+                    "homepage": "https://www.drupal.org/user/514222"
+                },
+                {
+                    "name": "jeroen.b",
+                    "homepage": "https://www.drupal.org/user/1853532"
+                },
+                {
+                    "name": "jstoller",
+                    "homepage": "https://www.drupal.org/user/99012"
+                },
+                {
+                    "name": "miro_dietiker",
+                    "homepage": "https://www.drupal.org/user/227761"
+                },
+                {
+                    "name": "primsi",
+                    "homepage": "https://www.drupal.org/user/282629"
+                }
+            ],
+            "description": "Enables the creation of Paragraphs entities.",
+            "homepage": "https://www.drupal.org/project/paragraphs",
+            "support": {
+                "source": "https://git.drupalcode.org/project/paragraphs"
+            }
+        },
        {
            "name": "drupal/path_alias_xt",
            "version": "dev-1.x",
--- a/web_main/themes/custom/mathallo/assets/dist/main.css
+++ b/web_main/themes/custom/mathallo/assets/dist/main.css
--- a/web_main/themes/custom/mathallo/assets/dist/main.js
+++ b/web_main/themes/custom/mathallo/assets/dist/main.js
--- a/web_main/themes/custom/mathallo/assets/js/main.js
+++ b/web_main/themes/custom/mathallo/assets/js/main.js
@@ -61,13 +61,13 @@ gsap.registerPlugin(ScrollTrigger, ScrollSmoother);
      //   scrollTrigger: 'main[role="main"]', // start animation when ".box" enters the viewport
      //   backgroundPositionY: 10
      // });
-      ScrollSmoother.create({
-        smooth: 1, // how long (in seconds) it takes to "catch up" to the native scroll position
-        effects: true, // looks for data-speed and data-lag attributes on elements
-        smoothTouch: 0.1, // much shorter smoothing time on touch devices (default is NO smoothing on touch devices)
-        wrapper: 'main[role="main"]',
-        content: 'main[role="main"]>.layout-content'
-      });
+      // ScrollSmoother.create({
+      //   smooth: 1, // how long (in seconds) it takes to "catch up" to the native scroll position
+      //   effects: true, // looks for data-speed and data-lag attributes on elements
+      //   smoothTouch: 0.1, // much shorter smoothing time on touch devices (default is NO smoothing on touch devices)
+      //   wrapper: 'main[role="main"]',
+      //   content: 'main[role="main"]>.layout-content'
+      // });
    }

    function initVues(){
--- a/web_main/themes/custom/mathallo/assets/scss/main.scss
+++ b/web_main/themes/custom/mathallo/assets/scss/main.scss
@@ -43,8 +43,8 @@ div.layout-container{
    // flex: 1 1 auto; 
    position: fixed;     
    z-index: 90;
-    top:$header_height + 40px;
-    left: 20px;
+    top:$header_height + 30px;
+    left: 15px;
  }
  main[role="main"]{
    // flex: 1 1 auto; 
@@ -96,6 +96,10 @@ header[role="banner"]{
      font-size: 2em;
      text-transform:uppercase;
      font-weight: 500;
+
+      &:hover{
+        color: $rose;
+      }
    }
  }

@@ -108,11 +112,18 @@ header[role="banner"]{
    >div#burger-btn{
      position:relative;
      transition-duration: 0.5s;
+      transition-property: transform;
      top: 8.5px;
      &, &::before, &::after{
        // position: absolute;
        width:20px; height:3px;
        background-color: $bleu_site;
+        
+      }
+      &:hover{
+        &, &::before, &::after{
+          background-color: $rose;
+        } 
      }
      &::before, &::after{
        content: "";
@@ -126,7 +137,6 @@ header[role="banner"]{
      &::after{
        bottom: 6px;
      }
-
      &[opened]{
        transform: rotate(90deg);
      }
@@ -155,6 +165,7 @@ header[role="banner"]{
      }

      nav#block-mathallo-contenu{
+        padding: 1em;
        @include menu-contenus;
        li{
          padding:0 0 1em 0;
@@ -220,8 +231,8 @@ nav[role="breadcrumb"]{
    }
  }
  #block-mathallo-contenu-2{
-    @include menu-contenus;
    padding: 0.5em 1em;
+    @include menu-contenus;
    li:not(.in-active-trail){
      display: none;
    }
@@ -251,17 +262,17 @@ nav[role="breadcrumb"]{
                      
 main[role="main"]{
  div.layout-content{
+    
    article{
-      position: relative;
-      background-color: #fff;
-      padding:2em;
-      box-shadow: 0 0 10px rgba(0,0,0,0.25);
-      max-width: 50em;
-      margin: 5em auto 0;
-
+      
+      @include card;
+      
      h2{
        @include titre_h2;
        margin:0;
+        a:hover{
+          color: $rose;
+        }
      }
      div.field-chapitre-num,
      div.field-partie-num{
@@ -276,6 +287,7 @@ main[role="main"]{
        &>*{
          font-weight: 600;
        }
+
      }

    }
@@ -287,6 +299,59 @@ main[role="main"]{
      gap: 2em;
      padding:1em;
    }
+
+    section.field-card{
+      @include card;
+
+      h3{
+        @include titre_h3;
+      }
+
+      &.field-en-pratique{
+        div.field-label{
+          text-align: right;
+        }
+      }
+
+      &.field-ressources,
+      &.field-plus-loin{
+        .field-label{
+          @include titre_h3;
+          padding-bottom: 1em;
+        }
+        div.paragraph{
+          padding-bottom: 1em;
+        }
+        p{
+          margin: 0 0.25em;
+        }
+      }
+
+      &.field-ressources{
+        div.paragraph--type--ressource{
+          .field_titre{
+            background-color: $bleu_site;
+            color: #fff;
+            border-radius: 2em;
+            display: inline-block;
+            padding: 0.5em 1em;
+            &>div{
+              @include titre_h4;
+              color:#fff;
+            }
+          }
+        }
+      }
+      &.field-plus-loin{
+        div.paragraph--type--complement{
+          .field_titre{
+            @include titre_h4;
+            color: $bleu_site;
+          }
+        }
+      }
+    }
+
    // HOME
    div.views-home-chapitres{
      display: flex;
--- a/web_main/themes/custom/mathallo/assets/scss/partials/fonts.scss
+++ b/web_main/themes/custom/mathallo/assets/scss/partials/fonts.scss
@@ -14,6 +14,7 @@ body{
  font-size: 3em;
  font-weight: 400;
  color: $bleu_typo;
+  line-height: 1;
 }

@mixin titre_h3{
@@ -21,3 +22,8 @@ body{
  font-size: 2em;
 }

+@mixin titre_h4{
+  @include titre_h2();
+  font-size: 1.323em;
+}
+
--- a/web_main/themes/custom/mathallo/assets/scss/partials/mixins.scss
+++ b/web_main/themes/custom/mathallo/assets/scss/partials/mixins.scss
@@ -1,5 +1,4 @@
@mixin menu-contenus{
-  padding: 1em;
  ul,li{
    padding: 0;
    margin:0;
@@ -19,4 +18,14 @@
    font-size: 1.13em;
  }
  
-}
+}
+
+@mixin card{
+  position: relative;
+  background-color: #fff;
+  padding:2em;
+  box-shadow: 0 0 10px rgba(0,0,0,0.25);
+  max-width: 50em;
+  margin: 5em auto 0;
+}
+
--- a/web_main/themes/custom/mathallo/mathallo.theme
+++ b/web_main/themes/custom/mathallo/mathallo.theme
@@ -86,17 +86,17 @@ function mathallo_preprocess_contanier(&$variables) {

 }

+/**
+ * Implements hook_preprocess_HOOK() for node.html.twig.
+ */
+function mathallo_preprocess_field(&$variables) {
+  if (!isset($variables["title_attributes"]['class'])) {
+    $variables["title_attributes"]['class'] = [];
+  }
+  $variables['title_attributes']['class'][] = 'field-label';

-
-// function A(){
-//   $attr = 6;
-//   B($attr);
-//   print($attr);
-// }
-
-// function B($attr){
-//   $attr = 3;
-//   print($attr);
-// }
-
-// A();
+  if (!isset($variables["attributes"]['class'])) {
+    $variables["attributes"]['class'] = [];
+  }
+  $variables['attributes']['class'][] = $variables['field_name'];
+}
--- a/web_main/themes/custom/mathallo/templates/field.html.twig
+++ b/web_main/themes/custom/mathallo/templates/field.html.twig
@@ -58,7 +58,9 @@
  {% endif %}
 {% else %}
  <div{{ attributes }}>
+
    <div{{ title_attributes.addClass(title_classes) }}>{{ label }}</div>
+
    {% if multiple %}
      <div>
    {% endif %}
--- a/web_main/themes/custom/mathallo/templates/node--partie--full.html.twig
+++ b/web_main/themes/custom/mathallo/templates/node--partie--full.html.twig
@@ -0,0 +1,97 @@
+{#
+/**
+ * @file
+ * Default theme implementation to display a node.
+ *
+ * Available variables:
+ * - node: The node entity with limited access to object properties and methods.
+ *   Only method names starting with "get", "has", or "is" and a few common
+ *   methods such as "id", "label", and "bundle" are available. For example:
+ *   - node.getCreatedTime() will return the node creation timestamp.
+ *   - node.hasField('field_example') returns TRUE if the node bundle includes
+ *     field_example. (This does not indicate the presence of a value in this
+ *     field.)
+ *   - node.isPublished() will return whether the node is published or not.
+ *   Calling other methods, such as node.delete(), will result in an exception.
+ *   See \Drupal\node\Entity\Node for a full list of public properties and
+ *   methods for the node object.
+ * - label: (optional) The title of the node.
+ * - content: All node items. Use {{ content }} to print them all,
+ *   or print a subset such as {{ content.field_example }}. Use
+ *   {{ content|without('field_example') }} to temporarily suppress the printing
+ *   of a given child element.
+ * - author_picture: The node author user entity, rendered using the "compact"
+ *   view mode.
+ * - metadata: Metadata for this node.
+ * - date: (optional) Themed creation date field.
+ * - author_name: (optional) Themed author name field.
+ * - url: Direct URL of the current node.
+ * - display_submitted: Whether submission information should be displayed.
+ * - attributes: HTML attributes for the containing element.
+ *   The attributes.class element may contain one or more of the following
+ *   classes:
+ *   - node: The current template type (also known as a "theming hook").
+ *   - node--type-[type]: The current node type. For example, if the node is an
+ *     "Article" it would result in "node--type-article". Note that the machine
+ *     name will often be in a short form of the human readable label.
+ *   - node--view-mode-[view_mode]: The View Mode of the node; for example, a
+ *     teaser would result in: "node--view-mode-teaser", and
+ *     full: "node--view-mode-full".
+ *   The following are controlled through the node publishing options.
+ *   - node--promoted: Appears on nodes promoted to the front page.
+ *   - node--sticky: Appears on nodes ordered above other non-sticky nodes in
+ *     teaser listings.
+ *   - node--unpublished: Appears on unpublished nodes visible only to site
+ *     admins.
+ * - title_attributes: Same as attributes, except applied to the main title
+ *   tag that appears in the template.
+ * - content_attributes: Same as attributes, except applied to the main
+ *   content tag that appears in the template.
+ * - author_attributes: Same as attributes, except applied to the author of
+ *   the node tag that appears in the template.
+ * - title_prefix: Additional output populated by modules, intended to be
+ *   displayed in front of the main title tag that appears in the template.
+ * - title_suffix: Additional output populated by modules, intended to be
+ *   displayed after the main title tag that appears in the template.
+ * - view_mode: View mode; for example, "teaser" or "full".
+ * - teaser: Flag for the teaser state. Will be true if view_mode is 'teaser'.
+ * - page: Flag for the full page state. Will be true if view_mode is 'full'.
+ *
+ * @see template_preprocess_node()
+ *
+ * @ingroup themeable
+ */
+#}
+
+<article{{ attributes }}>
+  <div class="field-partie-num">
+    {{ content.field_partie }}
+  </div>
+  {{ title_prefix }}
+  {% if label and not page %}
+    <h2{{ title_attributes }}>
+      <a href="{{ url }}" rel="bookmark">{{ label }}</a>
+    </h2>
+  {% endif %}
+  {{ title_suffix }}
+
+  <div{{ content_attributes }}>
+    {{ content|without('field_partie','field_principes_reflexions','field_en_pratique','field_ressources','field_pour_aller_plus_loin') }}
+  </div>
+
+</article>
+{% if content.field_principes_reflexions %}
+  <section class="field-card field-principes-reflexion">{{ content.field_principes_reflexions }}</section>
+{% endif %}
+
+{% if content.field_en_pratique %}
+  <section class="field-card field-en-pratique">{{ content.field_en_pratique }}</section>
+{% endif %}
+
+{% if content.field_ressources %}
+  <section class="field-card field-ressources">{{ content.field_ressources }}</section>
+{% endif %}
+
+{% if content.field_pour_aller_plus_loin %}
+  <section class="field-card field-plus-loin">{{ content.field_pour_aller_plus_loin }}</section>
+{% endif %}