déploiement resources

README.md

@@ -1,150 +1,70 @@
-# ![](https://avatars1.githubusercontent.com/u/8237355?v=2&s=50) Grav
 
-[![PHPStan](https://img.shields.io/badge/PHPStan-enabled-brightgreen.svg?style=flat)](https://github.com/phpstan/phpstan)
-[![SensioLabsInsight](https://insight.sensiolabs.com/projects/cfd20465-d0f8-4a0a-8444-467f5b5f16ad/mini.png)](https://insight.sensiolabs.com/projects/cfd20465-d0f8-4a0a-8444-467f5b5f16ad)
-[![Discord](https://img.shields.io/discord/501836936584101899.svg?logo=discord&colorB=728ADA&label=Discord%20Chat)](https://chat.getgrav.org)
- [![PHP Tests](https://github.com/getgrav/grav/workflows/PHP%20Tests/badge.svg?branch=develop)](https://github.com/getgrav/grav/actions?query=workflow%3A%22PHP+Tests%22) [![OpenCollective](https://opencollective.com/grav/backers/badge.svg)](#backers) [![OpenCollective](https://opencollective.com/grav/sponsors/badge.svg)](#sponsors)
+#Installation site GIP EPAU  en local
 
-Grav is a **Fast**, **Simple**, and **Flexible**, file-based Web-platform.  There is **Zero** installation required.  Just extract the ZIP archive, and you are already up and running.  It follows similar principles to other flat-file CMS platforms, but has a different design philosophy than most. Grav comes with a powerful **Package Management System** to allow for simple installation and upgrading of plugins and themes, as well as simple updating of Grav itself.
 
-The underlying architecture of Grav is designed to use well-established and _best-in-class_ technologies to ensure that Grav is simple to use and easy to extend. Some of these key technologies include:
 
-* [Twig Templating](https://twig.sensiolabs.org/): for powerful control of the user interface
-* [Markdown](https://en.wikipedia.org/wiki/Markdown): for easy content creation
-* [YAML](https://yaml.org): for simple configuration
-* [Parsedown](https://parsedown.org/): for fast Markdown and Markdown Extra support
-* [Doctrine Cache](https://www.doctrine-project.org/projects/doctrine-orm/en/latest/reference/caching.html): layer for performance
-* [Pimple Dependency Injection Container](https://pimple.sensiolabs.org/): for extensibility and maintainability
-* [Symfony Event Dispatcher](https://symfony.com/doc/current/components/event_dispatcher/introduction.html): for plugin event handling
-* [Symfony Console](https://symfony.com/doc/current/components/console/introduction.html): for CLI interface
-* [Gregwar Image Library](https://github.com/Gregwar/Image): for dynamic image manipulation
-
-# Requirements
-
-- PHP 7.3.6 or higher. Check the [required modules list](https://learn.getgrav.org/basics/requirements#php-requirements)
-- Check the [Apache](https://learn.getgrav.org/basics/requirements#apache-requirements) or [IIS](https://learn.getgrav.org/basics/requirements#iis-requirements) requirements
-
-# Documentation
-
-The full documentation can be found from [learn.getgrav.org](https://learn.getgrav.org).
-
-# QuickStart
-
-These are the options to get Grav:
-
-### Downloading a Grav Package
-
-You can download a **ready-built** package from the [Downloads page on https://getgrav.org](https://getgrav.org/downloads)
-
-### With Composer
+### From GitHub
 
-You can create a new project with the latest **stable** Grav release with the following command:
+1.  Launch a **terminal** or **console** and navigate to the webroot folder:
 
-```
-$ composer create-project getgrav/grav ~/webroot/grav
-```
-
-### From GitHub
+   ```
+   $ cd path/on/your/computer
+   $ git clone -b master https://figureslibres.io/gogs/ouidade/dev-epau.archi.fr.git
+   ```
+2.   Install vendor dependencies via composer:
 
-1. Clone the Grav repository from [https://github.com/getgrav/grav]() to a folder in the webroot of your server, e.g. `~/webroot/grav`. Launch a **terminal** or **console** and navigate to the webroot folder:
    ```
-   $ cd ~/webroot
-   $ git clone https://github.com/getgrav/grav.git
+   $ cd path/on/your/computer/dev-epau.archi.fr
+   $ composer install --no-dev -o
    ```
 
-2. Install the **plugin** and **theme dependencies** by using the [Grav CLI application](https://learn.getgrav.org/advanced/grav-cli) `bin/grav`:
+3. Install the **plugin** and **theme dependencies** by using the [Grav CLI application](https://learn.getgrav.org/advanced/grav-cli) `bin/grav`:
+
    ```
-   $ cd ~/webroot/grav
    $ bin/grav install
    ```
 
-Check out the [install procedures](https://learn.getgrav.org/basics/installation) for more information.
+# Intall admin plugin
 
-# Adding Functionality
+   ```
+   bin/gpm install devtools
 
-You can download [plugins](https://getgrav.org/downloads/plugins) or [themes](https://getgrav.org/downloads/themes) manually from the appropriate tab on the [Downloads page on https://getgrav.org](https://getgrav.org/downloads), but the preferred solution is to use the [Grav Package Manager](https://learn.getgrav.org/advanced/grav-gpm) or `GPM`:
+  ```
 
-```
-$ bin/gpm index
-```
 
-This will display all the available plugins and then you can install one or more with:
+# Lancer le serveur
+
+dans Terminal
 
 ```
-$ bin/gpm install <plugin/theme>
+$ cd chemin/du/dossier/dev-epau.archi.fr
+$ php -S localhost:8000 system/router.php
+
 ```
+cette fenêtre doit restée ouverte
 
-# Updating
 
-To update Grav you should use the [Grav Package Manager](https://learn.getgrav.org/advanced/grav-gpm) or `GPM`:
+# Compilé les SCSS
 
 ```
-$ bin/gpm selfupgrade
+$ cd chemin/du/dossier/dev-epau.archi.fr
 ```
-
-To update plugins and themes:
-
 ```
-$ bin/gpm update
+$ npm install
 ```
+(uniquement la première fois)
 
-## Upgrading from older version
-
-* [Upgrading to Grav 1.7](https://learn.getgrav.org/16/advanced/grav-development/grav-17-upgrade-guide)
-* [Upgrading to Grav 1.6](https://learn.getgrav.org/16/advanced/grav-development/grav-16-upgrade-guide)
-* [Upgrading from Grav <1.6](https://learn.getgrav.org/16/advanced/grav-development/grav-15-upgrade-guide)
-
-# Contributing
-We appreciate any contribution to Grav, whether it is related to bugs, grammar, or simply a suggestion or improvement! Please refer to the [Contributing guide](CONTRIBUTING.md) for more guidance on this topic.
-
-## Security issues
-If you discover a possible security issue related to Grav or one of its plugins, please email the core team at contact@getgrav.org and we'll address it as soon as possible.
-
-# Getting Started
-
-* [What is Grav?](https://learn.getgrav.org/basics/what-is-grav)
-* [Install](https://learn.getgrav.org/basics/installation) Grav in few seconds
-* Understand the [Configuration](https://learn.getgrav.org/basics/grav-configuration)
-* Take a peek at our available free [Skeletons](https://getgrav.org/downloads/skeletons)
-* If you have questions, jump on our [Discord Chat Server](https://chat.getgrav.org)!
-* Have fun!
-
-# Exploring More
-
-* Have a look at our [Basic Tutorial](https://learn.getgrav.org/basics/basic-tutorial)
-* Dive into more [advanced](https://learn.getgrav.org/advanced) functions
-* Learn about the [Grav CLI](https://learn.getgrav.org/cli-console/grav-cli)
-* Review examples in the [Grav Cookbook](https://learn.getgrav.org/cookbook)
-* More [Awesome Grav Stuff](https://github.com/getgrav/awesome-grav)
-
-# Backers
-Support Grav with a monthly donation to help us continue development. [[Become a backer](https://opencollective.com/grav#backer)]
+puis à chaque fois, dans une 2e fenêtre de Terminal, qui doit également restée ouverte:
 
-<img src="https://opencollective.com/grav/tiers/backers.svg?avatarHeight=36&width=600" />
-
-# Sponsors
-Become a sponsor and get your logo on our README on Github with a link to your site. [[Become a sponsor](https://opencollective.com/grav#sponsor)]
-
-<img src="https://opencollective.com/grav/tiers/sponsors.svg?avatarHeight=36&width=600" />
-
-# License
-
-See [LICENSE](LICENSE.txt)
-
-
-[gitflow-model]: http://nvie.com/posts/a-successful-git-branching-model/
-[gitflow-extensions]: https://github.com/nvie/gitflow
-
-# Running Tests
-
-First install the dev dependencies by running `composer install` from the Grav root.
+```
+$ cd chemin/du/dossier/dev-epau.archi.fr/user/theme/epau-antimatter
+$ npm run sass
+```
 
-Then `composer test` will run the Unit Tests, which should be always executed successfully on any site.
-Windows users should use the `composer test-windows` command.
-You can also run a single unit test file, e.g. `composer test tests/unit/Grav/Common/AssetsTest.php`
+# Dans le navigateur
 
-To run phpstan tests, you should run:
+aller sur http://localhost:8000/
+pour voir le site
 
-* `composer phpstan` for global tests
-* `composer phpstan-framework` for more strict tests
-* `composer phpstan-plugins` to test all installed plugins
+aller sur http://localhost:8000/admin
+pour accéder au back office

user/pages/01.home/03._ressources/ressources.md

@@ -30,10 +30,8 @@ rapports:
         texte_de_presentation: "Courte explicationVita estillis semper in fuga uxoresque mercenariae\r\n infugauxoresque mercenariae conductae ad tempus expacto atque, ut conductae ad tempus ex pacto atque, ut sit species matrimonii, dotis nomine futura coniunx hastam.\r\n"
         couverture: rapport_activite_V1.png
         pdf: rapport_activite_V1.pdf
-template: modular/ressources
 process:
     markdown: true
     twig: false
 ---
 
-

user/pages/01.home/05._contact/text.md

@@ -1,9 +1,8 @@
 ---
 title: Contact
 body_classes: modular
+media_order: 'puca.png,logo cité archi.jpg,logo_gouvernment.png,logo MCTRCT.png,logo ministère culture.png,logo min logement.png,europan_france.jpg'
+published: true
 ---
 
-CONTACT :
-Fabienne.Dran@developpement-durable.gouv.fr
-+ 33 (0)1 40 81 9327
-+33 (0)7 86 5033 31
+![logo%20cit%C3%A9%20archi](logo%20cit%C3%A9%20archi.jpg "logo%20cit%C3%A9%20archi") ![logo_gouvernment](logo_gouvernment.png "logo_gouvernment") ![logo%20MCTRCT](logo%20MCTRCT.png "logo%20MCTRCT") ![logo%20minist%C3%A8re%20culture](logo%20minist%C3%A8re%20culture.png "logo%20minist%C3%A8re%20culture") ![logo%20min%20logement](logo%20min%20logement.png "logo%20min%20logement") ![europan_france](europan_france.jpg "europan_france") ![puca](puca.png "puca")

user/themes/epau-antimatter/README.md

@@ -1,56 +1,6 @@
 # Epau Antimatter
 
 
-# modif par Ouidade
-
-##le 10/03/21
-
-ai créer un module "personnes.html.twig" mais ce module n'est pas visible.
-ai donc rajouté ligne 51 à 55 dans modular.html.twig >>> marche pas
-ai rajouté lignes 11 à 16 dans personnes.html.twig  >>> marche pas
-
-ai essayé de remonter les champs du module Gouvernance et template personnes mais n'ai pas réussi. dans fichier features.html.twig qui est mon modèle je n'arrive pas à comprendre à quoi correspondent tous les "feature" et "features" et ".features" mentionnés (je pense qui se réfèrent à plusieurs choses différentes)
-donc je n'arrive pas à faire le lien avec mais nouveaux champs créés dans le template personnes.yaml pour réécrire personnes.html.twig  
-
-ai ajouter un champ de type "file" dans template features.yaml mais n'est pas visible.
-il faut que je trouve la bonne syntaxe twig a ajouter au fichier features.html.twig
-
-les liens dans les champs text de Features (module programmes) ne fonctionnent pas. Pourtant bien du markdown et écrit comme dans quark.
-
-## le 11/03/21
-
-J'ai ajouter dans features.html.twig les lignes
-
-{% if feature.logo %}
-<img src="{{ page.media[page.header.feature.logo] }}" alt=“logo_programme”/>
-{% endif %}
-
-maintenant la présence d'une image est vue mais elle ne s'affiche pas. ai seulement le texte alternatif.
-
-
-autre pb pour le module "programmes"
-le markdown du text n'est pas pris en compte.
-j'ai essayé:
-.text:
-  type: markdown
-  label: Texte de présentation du programme
-  validate:
-    type: textarea
-.text:
-  type: editor
-  label: Texte de présentation du programme
-  markdown: true
-
-.text:
-  type: editor
-  label: Texte de présentation du programme
-  markdown: true
-
-
-
-#fin des modifs par Ouidade
-
-
 ![Epau Antimatter](assets/readme_1.png)
 
 Epau Antimatter is the default [Grav](http://getgrav.org) theme. Simple, fast and modern.

user/themes/epau-antimatter/css-compiled/template.css

@@ -1,3 +1,4 @@
+@charset "UTF-8";
 @import url(//fonts.googleapis.com/css?family=Montserrat:400|Raleway:300,400,600|Inconsolata);
 #header #logo h3, #header #navbar .panel-activation, #footer p {
   position: relative;
@@ -798,6 +799,16 @@ ul.pagination {
 #body > script:first-child + .grav-lightslider {
   margin-top: -3rem; }
 
+#sb-site {
+  background: none !important; }
+  #sb-site #body {
+    background: none !important;
+    padding-bottom: 2rem !important; }
+
+#header.scrolled {
+  padding-left: 2rem;
+  padding-right: 2rem; }
+
 #header #navbar ul.navigation li a {
   font-family: "Sarabun", sans-serif;
   font-weight: 400;
@@ -828,6 +839,11 @@ ul.pagination {
     padding: 0.5rem;
     max-height: 3rem;
     margin: auto; }
+  #logo #gouv {
+    padding-right: 4rem; }
+
+#body p:empty {
+  display: none; }
 
 .callout {
   padding-top: 0.5rem; }
@@ -880,31 +896,8 @@ ul.pagination {
   padding-top: 8rem;
   padding-bottom: 8rem; }
 
-.paralax {
-  position: absolute !important;
-  width: 100%;
-  display: flex;
-  flex-direction: row;
-  flex-wrap: wrap;
-  justify-content: space-between; }
-  .paralax #photo1 {
-    position: relative;
-    top: -60px; }
-  .paralax #photo2 {
-    z-index: 0;
-    width: 700px !important;
-    position: relative;
-    top: 260px; }
-  .paralax #photo3 {
-    z-index: 0;
-    width: 700px !important;
-    position: relative;
-    top: 500px; }
-  .paralax #photo4 {
-    z-index: 0;
-    width: 700px !important;
-    position: relative;
-    top: 300px; }
+.parallax-window {
+  background: transparent; }
 
 .programme {
   z-index: 1;
@@ -920,7 +913,8 @@ ul.pagination {
   .programme p {
     font-family: "Sarabun", sans-serif;
     font-weight: 500;
-    font-style: italic; }
+    font-style: italic;
+    padding-bottom: 1.5rem; }
 
 .programme:hover {
   background-color: #000;
@@ -930,6 +924,42 @@ ul.pagination {
   .programme:hover h4 {
     color: #fff; }
 
+/*CSS pour afficher/masquer un texte via un bouton*/
+/*Style du module TEXTE*/
+.texte-cache {
+  position: relative;
+  max-height: 400px;
+  /*Hauteur du texte visible avant le clic*/
+  overflow: hidden;
+  /*On cache tout ce qui dépasse des 500px*/
+  transition: max-height 1s ease;
+  /* Transition CSS entre l'ouverture et la fermeture*/ }
+
+/*Style du module TEXTE lorsqu'il est ouvert*/
+.texte-cache.ouvert {
+  max-height: 100vh;
+  /* On lui définit une hauteur max de tout l'écran si nécessaire pour qu'il affiche tout son contenu*/ }
+
+/*On stylise l'effet de flou lorsque le module TEXTE est fermé, donc il n'a pas la classe "ouvert"*/
+.texte-cache:not(.ouvert)::after {
+  content: '';
+  position: absolute;
+  top: 400px;
+  bottom: 0;
+  left: 0;
+  right: 0; }
+
+.bouton-ouverture {
+  position: relative;
+  justify-content: center;
+  cursor: pointer;
+  border: solid;
+  background-color: transparent;
+  text-transform: uppercase;
+  left: 45%;
+  margin-top: 3rem;
+  margin-bottom: 5rem; }
+
 .gouvernance {
   background-color: #000;
   color: #ffffff;
@@ -938,13 +968,17 @@ ul.pagination {
   padding-top: 2rem; }
 
 .mozaique_personnes {
-  background-color: #d5d2d1; }
+  background-color: #d5d2d1;
+  padding-bottom: 4rem; }
   .mozaique_personnes .equipe {
     display: flex !important;
     flex-direction: row;
     flex-wrap: wrap;
-    width: 54%;
-    margin: auto; }
+    width: 100%;
+    padding-left: 22%;
+    padding-right: 15%;
+    margin: auto;
+    justify-items: center; }
     .mozaique_personnes .equipe h3 {
       padding-top: 3rem;
       min-width: 100%;
@@ -1006,7 +1040,7 @@ ul.pagination {
   background-color: transparent;
   text-transform: uppercase;
   align-self: flex-end;
-  margin-right: 2rem; }
+  margin: auto; }
 
 .modal {
   position: fixed;
@@ -1042,6 +1076,56 @@ ul.pagination {
   .modal .container a.close:hover {
     color: black; }
 
+#new-footer {
+  display: flex;
+  flex-direction: column; }
+  #new-footer .tothetop {
+    position: absolute;
+    height: 1rem;
+    bottom: 16rem;
+    text-align: center;
+    left: 0;
+    right: 0; }
+    #new-footer .tothetop span {
+      font-size: 1.7rem;
+      line-height: 2,5rem;
+      background: #fff;
+      width: 4rem;
+      height: 5rem;
+      border-radius: 3px;
+      display: inline-block;
+      text-align: top; }
+  #new-footer .footer {
+    display: flex;
+    flex-direction: row; }
+    #new-footer .footer .footer-logos {
+      display: flex;
+      flex-direction: row;
+      flex-wrap: nowrap;
+      width: 70%;
+      align-items: center;
+      margin-left: 3rem; }
+      #new-footer .footer .footer-logos img {
+        min-height: 4rem;
+        max-height: 4rem;
+        padding-right: 1rem; }
+    #new-footer .footer .contact {
+      display: flex;
+      flex-direction: column;
+      width: 30%;
+      margin-top: 1.5rem;
+      align-items: flex-start; }
+      #new-footer .footer .contact img {
+        margin-bottom: 1rem;
+        max-height: 2rem; }
+      #new-footer .footer .contact svg {
+        margin-bottom: 1rem; }
+      #new-footer .footer .contact h6 {
+        margin: 0 !important;
+        font-weight: 600; }
+      #new-footer .footer .contact p {
+        margin: 0; }
+
 .modular.header-image #header {
   background-color: rgba(255, 255, 255, 0);
   box-shadow: none; }

user/themes/epau-antimatter/js/antimatter.js

@@ -27,6 +27,19 @@ function scrollHeader() {
 
 jQuery(document).ready(function($){
 
+//bouton "voir plus de ressources"
+    // $("a.bouton-ouverture").removeAttr("href"); // On supprime le lien de notre bouton
+
+    $('.bouton-ouverture').on('click', function(){ // lorsqu'on clique sur le bouton
+    $('.texte-cache').toggleClass('ouvert'); // On ajoute ou retire la classe CSS "ouvert"
+
+    if ($('.texte-cache').hasClass('ouvert')) { // Si le module texte a la classe "ouvert"
+      $('.bouton-ouverture').html('Voir MOINS'); // On affiche LIRE MOINS sur le bouton
+    } else {
+      $('.bouton-ouverture').html('Voir PLUS'); // Sinon on affiche LIRE PLUS
+    }
+  	});
+
 
 // jQuery('.your-class-here').one('inview', function (event, visible) {
 //     if (visible == true) {
@@ -116,6 +129,4 @@ jQuery(document).ready(function($){
     });
 
 
-
-
 });

user/themes/epau-antimatter/js/parallax.js

@@ -0,0 +1,412 @@
+/*!
+ * parallax.js v1.5.0 (http://pixelcog.github.io/parallax.js/)
+ * @copyright 2016 PixelCog, Inc.
+ * @license MIT (https://github.com/pixelcog/parallax.js/blob/master/LICENSE)
+ */
+
+;(function ( $, window, document, undefined ) {
+
+  // Polyfill for requestAnimationFrame
+  // via: https://gist.github.com/paulirish/1579671
+
+  (function() {
+    var lastTime = 0;
+    var vendors = ['ms', 'moz', 'webkit', 'o'];
+    for(var x = 0; x < vendors.length && !window.requestAnimationFrame; ++x) {
+      window.requestAnimationFrame = window[vendors[x]+'RequestAnimationFrame'];
+      window.cancelAnimationFrame = window[vendors[x]+'CancelAnimationFrame'] || window[vendors[x]+'CancelRequestAnimationFrame'];
+    }
+
+    if (!window.requestAnimationFrame)
+      window.requestAnimationFrame = function(callback) {
+        var currTime = new Date().getTime();
+        var timeToCall = Math.max(0, 16 - (currTime - lastTime));
+        var id = window.setTimeout(function() { callback(currTime + timeToCall); },
+          timeToCall);
+        lastTime = currTime + timeToCall;
+        return id;
+      };
+
+    if (!window.cancelAnimationFrame)
+      window.cancelAnimationFrame = function(id) {
+        clearTimeout(id);
+      };
+  }());
+
+
+  // Parallax Constructor
+
+  function Parallax(element, options) {
+    var self = this;
+
+    if (typeof options == 'object') {
+      delete options.refresh;
+      delete options.render;
+      $.extend(this, options);
+    }
+
+    this.$element = $(element);
+
+    if (!this.imageSrc && this.$element.is('img')) {
+      this.imageSrc = this.$element.attr('src');
+    }
+
+    var positions = (this.position + '').toLowerCase().match(/\S+/g) || [];
+
+    if (positions.length < 1) {
+      positions.push('center');
+    }
+    if (positions.length == 1) {
+      positions.push(positions[0]);
+    }
+
+    if (positions[0] == 'top' || positions[0] == 'bottom' || positions[1] == 'left' || positions[1] == 'right') {
+      positions = [positions[1], positions[0]];
+    }
+
+    if (this.positionX !== undefined) positions[0] = this.positionX.toLowerCase();
+    if (this.positionY !== undefined) positions[1] = this.positionY.toLowerCase();
+
+    self.positionX = positions[0];
+    self.positionY = positions[1];
+
+    if (this.positionX != 'left' && this.positionX != 'right') {
+      if (isNaN(parseInt(this.positionX))) {
+        this.positionX = 'center';
+      } else {
+        this.positionX = parseInt(this.positionX);
+      }
+    }
+
+    if (this.positionY != 'top' && this.positionY != 'bottom') {
+      if (isNaN(parseInt(this.positionY))) {
+        this.positionY = 'center';
+      } else {
+        this.positionY = parseInt(this.positionY);
+      }
+    }
+
+    this.position =
+      this.positionX + (isNaN(this.positionX)? '' : 'px') + ' ' +
+      this.positionY + (isNaN(this.positionY)? '' : 'px');
+
+    if (navigator.userAgent.match(/(iPod|iPhone|iPad)/)) {
+      if (this.imageSrc && this.iosFix && !this.$element.is('img')) {
+        this.$element.css({
+          backgroundImage: 'url(' + this.imageSrc + ')',
+          backgroundSize: 'cover',
+          backgroundPosition: this.position
+        });
+      }
+      return this;
+    }
+
+    if (navigator.userAgent.match(/(Android)/)) {
+      if (this.imageSrc && this.androidFix && !this.$element.is('img')) {
+        this.$element.css({
+          backgroundImage: 'url(' + this.imageSrc + ')',
+          backgroundSize: 'cover',
+          backgroundPosition: this.position
+        });
+      }
+      return this;
+    }
+
+    this.$mirror = $('<div />').prependTo(this.mirrorContainer);
+
+    var slider = this.$element.find('>.parallax-slider');
+    var sliderExisted = false;
+
+    if (slider.length == 0)
+      this.$slider = $('<img />').prependTo(this.$mirror);
+    else {
+      this.$slider = slider.prependTo(this.$mirror)
+      sliderExisted = true;
+    }
+
+    this.$mirror.addClass('parallax-mirror').css({
+      visibility: 'hidden',
+      zIndex: this.zIndex,
+      position: 'fixed',
+      top: 0,
+      left: 0,
+      overflow: 'hidden'
+    });
+
+    this.$slider.addClass('parallax-slider').one('load', function() {
+      if (!self.naturalHeight || !self.naturalWidth) {
+        self.naturalHeight = this.naturalHeight || this.height || 1;
+        self.naturalWidth  = this.naturalWidth  || this.width  || 1;
+      }
+      self.aspectRatio = self.naturalWidth / self.naturalHeight;
+
+      Parallax.isSetup || Parallax.setup();
+      Parallax.sliders.push(self);
+      Parallax.isFresh = false;
+      Parallax.requestRender();
+    });
+
+    if (!sliderExisted)
+      this.$slider[0].src = this.imageSrc;
+
+    if (this.naturalHeight && this.naturalWidth || this.$slider[0].complete || slider.length > 0) {
+      this.$slider.trigger('load');
+    }
+
+  }
+
+
+  // Parallax Instance Methods
+
+  $.extend(Parallax.prototype, {
+    speed:    0.2,
+    bleed:    0,
+    zIndex:   -100,
+    iosFix:   true,
+    androidFix: true,
+    position: 'center',
+    overScrollFix: false,
+    mirrorContainer: 'body',
+
+    refresh: function() {
+      this.boxWidth        = this.$element.outerWidth();
+      this.boxHeight       = this.$element.outerHeight() + this.bleed * 2;
+      this.boxOffsetTop    = this.$element.offset().top - this.bleed;
+      this.boxOffsetLeft   = this.$element.offset().left;
+      this.boxOffsetBottom = this.boxOffsetTop + this.boxHeight;
+
+      var winHeight = Parallax.winHeight;
+      var docHeight = Parallax.docHeight;
+      var maxOffset = Math.min(this.boxOffsetTop, docHeight - winHeight);
+      var minOffset = Math.max(this.boxOffsetTop + this.boxHeight - winHeight, 0);
+      var imageHeightMin = this.boxHeight + (maxOffset - minOffset) * (1 - this.speed) | 0;
+      var imageOffsetMin = (this.boxOffsetTop - maxOffset) * (1 - this.speed) | 0;
+      var margin;
+
+      if (imageHeightMin * this.aspectRatio >= this.boxWidth) {
+        this.imageWidth    = imageHeightMin * this.aspectRatio | 0;
+        this.imageHeight   = imageHeightMin;
+        this.offsetBaseTop = imageOffsetMin;
+
+        margin = this.imageWidth - this.boxWidth;
+
+        if (this.positionX == 'left') {
+          this.offsetLeft = 0;
+        } else if (this.positionX == 'right') {
+          this.offsetLeft = - margin;
+        } else if (!isNaN(this.positionX)) {
+          this.offsetLeft = Math.max(this.positionX, - margin);
+        } else {
+          this.offsetLeft = - margin / 2 | 0;
+        }
+      } else {
+        this.imageWidth    = this.boxWidth;
+        this.imageHeight   = this.boxWidth / this.aspectRatio | 0;
+        this.offsetLeft    = 0;
+
+        margin = this.imageHeight - imageHeightMin;
+
+        if (this.positionY == 'top') {
+          this.offsetBaseTop = imageOffsetMin;
+        } else if (this.positionY == 'bottom') {
+          this.offsetBaseTop = imageOffsetMin - margin;
+        } else if (!isNaN(this.positionY)) {
+          this.offsetBaseTop = imageOffsetMin + Math.max(this.positionY, - margin);
+        } else {
+          this.offsetBaseTop = imageOffsetMin - margin / 2 | 0;
+        }
+      }
+    },
+
+    render: function() {
+      var scrollTop    = Parallax.scrollTop;
+      var scrollLeft   = Parallax.scrollLeft;
+      var overScroll   = this.overScrollFix ? Parallax.overScroll : 0;
+      var scrollBottom = scrollTop + Parallax.winHeight;
+
+      if (this.boxOffsetBottom > scrollTop && this.boxOffsetTop <= scrollBottom) {
+        this.visibility = 'visible';
+        this.mirrorTop = this.boxOffsetTop  - scrollTop;
+        this.mirrorLeft = this.boxOffsetLeft - scrollLeft;
+        this.offsetTop = this.offsetBaseTop - this.mirrorTop * (1 - this.speed);
+      } else {
+        this.visibility = 'hidden';
+      }
+
+      this.$mirror.css({
+        transform: 'translate3d('+this.mirrorLeft+'px, '+(this.mirrorTop - overScroll)+'px, 0px)',
+        visibility: this.visibility,
+        height: this.boxHeight,
+        width: this.boxWidth
+      });
+
+      this.$slider.css({
+        transform: 'translate3d('+this.offsetLeft+'px, '+this.offsetTop+'px, 0px)',
+        position: 'absolute',
+        height: this.imageHeight,
+        width: this.imageWidth,
+        maxWidth: 'none'
+      });
+    }
+  });
+
+
+  // Parallax Static Methods
+
+  $.extend(Parallax, {
+    scrollTop:    0,
+    scrollLeft:   0,
+    winHeight:    0,
+    winWidth:     0,
+    docHeight:    1 << 30,
+    docWidth:     1 << 30,
+    sliders:      [],
+    isReady:      false,
+    isFresh:      false,
+    isBusy:       false,
+
+    setup: function() {
+      if (this.isReady) return;
+
+      var self = this;
+
+      var $doc = $(document), $win = $(window);
+
+      var loadDimensions = function() {
+        Parallax.winHeight = $win.height();
+        Parallax.winWidth  = $win.width();
+        Parallax.docHeight = $doc.height();
+        Parallax.docWidth  = $doc.width();
+      };
+
+      var loadScrollPosition = function() {
+        var winScrollTop  = $win.scrollTop();
+        var scrollTopMax  = Parallax.docHeight - Parallax.winHeight;
+        var scrollLeftMax = Parallax.docWidth  - Parallax.winWidth;
+        Parallax.scrollTop  = Math.max(0, Math.min(scrollTopMax,  winScrollTop));
+        Parallax.scrollLeft = Math.max(0, Math.min(scrollLeftMax, $win.scrollLeft()));
+        Parallax.overScroll = Math.max(winScrollTop - scrollTopMax, Math.min(winScrollTop, 0));
+      };
+
+      $win.on('resize.px.parallax load.px.parallax', function() {
+          loadDimensions();
+          self.refresh();
+          Parallax.isFresh = false;
+          Parallax.requestRender();
+        })
+        .on('scroll.px.parallax load.px.parallax', function() {
+          loadScrollPosition();
+          Parallax.requestRender();
+        });
+
+      loadDimensions();
+      loadScrollPosition();
+
+      this.isReady = true;
+
+      var lastPosition = -1;
+
+      function frameLoop() {
+        if (lastPosition == window.pageYOffset) {   // Avoid overcalculations
+          window.requestAnimationFrame(frameLoop);
+          return false;
+        } else lastPosition = window.pageYOffset;
+
+        self.render();
+        window.requestAnimationFrame(frameLoop);
+      }
+
+      frameLoop();
+    },
+
+    configure: function(options) {
+      if (typeof options == 'object') {
+        delete options.refresh;
+        delete options.render;
+        $.extend(this.prototype, options);
+      }
+    },
+
+    refresh: function() {
+      $.each(this.sliders, function(){ this.refresh(); });
+      this.isFresh = true;
+    },
+
+    render: function() {
+      this.isFresh || this.refresh();
+      $.each(this.sliders, function(){ this.render(); });
+    },
+
+    requestRender: function() {
+      var self = this;
+      self.render();
+      self.isBusy = false;
+    },
+    destroy: function(el){
+      var i,
+          parallaxElement = $(el).data('px.parallax');
+      parallaxElement.$mirror.remove();
+      for(i=0; i < this.sliders.length; i+=1){
+        if(this.sliders[i] == parallaxElement){
+          this.sliders.splice(i, 1);
+        }
+      }
+      $(el).data('px.parallax', false);
+      if(this.sliders.length === 0){
+        $(window).off('scroll.px.parallax resize.px.parallax load.px.parallax');
+        this.isReady = false;
+        Parallax.isSetup = false;
+      }
+    }
+  });
+
+
+  // Parallax Plugin Definition
+
+  function Plugin(option) {
+    return this.each(function () {
+      var $this = $(this);
+      var options = typeof option == 'object' && option;
+
+      if (this == window || this == document || $this.is('body')) {
+        Parallax.configure(options);
+      }
+      else if (!$this.data('px.parallax')) {
+        options = $.extend({}, $this.data(), options);
+        $this.data('px.parallax', new Parallax(this, options));
+      }
+      else if (typeof option == 'object')
+      {
+        $.extend($this.data('px.parallax'), options);
+      }
+      if (typeof option == 'string') {
+        if(option == 'destroy'){
+            Parallax.destroy(this);
+        }else{
+          Parallax[option]();
+        }
+      }
+    });
+  }
+
+  var old = $.fn.parallax;
+
+  $.fn.parallax             = Plugin;
+  $.fn.parallax.Constructor = Parallax;
+
+
+  // Parallax No Conflict
+
+  $.fn.parallax.noConflict = function () {
+    $.fn.parallax = old;
+    return this;
+  };
+
+
+  // Parallax Data-API
+
+  $( function () { 
+    $('[data-parallax="scroll"]').parallax(); 
+  });
+
+}(jQuery, window, document));

user/themes/epau-antimatter/scss/template/_custom.scss

@@ -16,8 +16,19 @@
   margin-top: -3rem;
 }
 
+#sb-site{
+  background: none !important;
 
+  #body{
+    background: none !important;
+    padding-bottom: 2rem !important;
+  }
+}
 
+#header.scrolled {
+  padding-left: 2rem;
+  padding-right: 2rem;
+}
 #header #navbar ul.navigation li a {
     font-family: "Sarabun", sans-serif;
     font-weight: 400;
@@ -57,13 +68,17 @@
       padding: 0.5rem;
       max-height: 3rem;
       margin:auto;
-
+    }
+    #gouv {
+      padding-right: 4rem;
     }
 }
 
 
 
-
+#body {
+  p:empty { display:none; }
+}
 
 
 
@@ -146,7 +161,7 @@
 
   display: flex;
   flex-wrap: wrap;
-
+  //
   // background-image:
   // url("/user/themes/epau-antimatter/images/14360_default_big.jpg") ,
   //   url("/user/themes/epau-antimatter/images/10361_web_01.jpg") ,
@@ -173,44 +188,49 @@
   padding-bottom: 8rem;
 }
 
-.paralax  {
-  position: absolute !important;
-  width: 100%;
-  display: flex;
-  flex-direction: row;
-  flex-wrap: wrap;
-  justify-content: space-between;
-
-  // transform: translate3d(0px, -128px, 0px);
-
-  #photo1 {
-    position: relative;
-    top: -60px;
-
-  }
-
-  #photo2 {
-    z-index: 0;
-    width:700px !important;
-    position: relative;
-    top: 260px;
-  }
-
-  #photo3 {
-    z-index: 0;
-    width:700px !important;
-    position: relative;
-    top: 500px;
-  }
-
-  #photo4 {
-    z-index: 0;
-    width:700px !important;
-    position: relative;
-    top: 300px;
-  }
+.parallax-window {
+    // min-height: 400px;
+    background: transparent;
+    // height: 1534px;
+    // overflow: hidden;
 }
 
+// .images-background {
+//   position: absolute !important;
+//   width: 100%;
+//   display: flex;
+//   flex-direction: row;
+//   flex-wrap: wrap;
+//   justify-content: space-between;
+//
+//   #photo1 {
+//     position: relative;
+//     top: -60px;
+//
+//   }
+//
+//   #photo2 {
+//     z-index: 0;
+//     width:700px !important;
+//     position: relative;
+//     top: 260px;
+//   }
+//
+//   #photo3 {
+//     z-index: 0;
+//     width:700px !important;
+//     position: relative;
+//     top: 300px;
+//   }
+//
+//   #photo4 {
+//     z-index: 0;
+//     width:700px !important;
+//     position: relative;
+//     top: 300px;
+//   }
+// }
+
 
 .programme {
   z-index: 1;
@@ -224,6 +244,7 @@
     h4 {
       text-transform: uppercase;
       line-height: 1.2;
+
     }
 
     img {
@@ -234,6 +255,7 @@
       font-family: $font-family-default;
       font-weight: 500;
       font-style: italic;
+      padding-bottom: 1.5rem;
     }
 }
 
@@ -251,66 +273,49 @@
   }
 }
 
-    // .parallax {
-    //   display: block;
-    // }
 
-//
-//     /* .titre_nsb {
-//       display: block;
-//       position: absolute;
-//       margin-right: 39%;
-//     } */
-//
-//
-// /* .ressources {
-//     display: flex;
-//     flex-wrap: wrap;
-//     justify-content: space-between;
-//     background-color: #ffffff;
-//     padding-top: 8rem;
-//     padding-right: 5rem;
-//     padding-left: 5rem;
-//   } */
-//
-//     /* .ressource {
-//       max-width: 20%;
-//       margin-block: 5rem;
-//       flex-wrap: wrap;
-//       flex: 0 1 15%;
-//     } */
-//
-//
-// /*
-// .ressources h1 {
-//   text-transform: uppercase;
-//   background-color: #fff;
-//   color: #000;
-//   padding-top: 5rem;
-//   padding-bottom: 6rem;
-// } */
-//
-// /* .ressources {
-//   display: grid;
-//   grid-template-columns: repeat(4, 1fr);
-//   grid-gap: 3rem;
-//   grid-auto-rows: auto;
-//   background-color: #ffffff;
-//   padding-top: 18rem;
-//   justify-items: center;
-//   position: relative;
-//   margin-right: 10%;
-//   margin-bottom: 6rem;
-//   margin-left: 10%;
-// } */
-//
-// /* .ressources img {
-//   max-width: 50%;
-// } */
-//
-// /* .ressource h1 h2 h3 h4 {
-//   margin: 0.2rem;
-// } */
+/*CSS pour afficher/masquer un texte via un bouton*/
+
+/*Style du module TEXTE*/
+.texte-cache {
+  position: relative;
+
+  max-height: 400px; /*Hauteur du texte visible avant le clic*/
+  overflow: hidden; /*On cache tout ce qui dépasse des 500px*/
+  transition: max-height 1s ease; /* Transition CSS entre l'ouverture et la fermeture*/
+}
+
+/*Style du module TEXTE lorsqu'il est ouvert*/
+.texte-cache.ouvert {
+    max-height: 100vh; /* On lui définit une hauteur max de tout l'écran si nécessaire pour qu'il affiche tout son contenu*/
+  }
+
+/*On stylise l'effet de flou lorsque le module TEXTE est fermé, donc il n'a pas la classe "ouvert"*/
+.texte-cache:not(.ouvert)::after {
+  content: '';
+  position: absolute;
+  top: 400px;
+  bottom: 0;
+  left: 0;
+  right: 0;
+  // background: linear-gradient(rgba(255, 255, 255, 0), rgba(255, 255, 255, 1)); /*Couleur de notre effet*/
+}
+
+.bouton-ouverture {
+    position: relative;
+    justify-content: center;
+    cursor: pointer;
+    border: solid;
+    background-color: transparent;
+    text-transform: uppercase;
+    left: 45%;
+    margin-top: 3rem;
+    margin-bottom: 5rem;
+    // align-self: flex-end;
+    // margin-right: 2rem;
+    // margin: auto;
+
+}
 
 .gouvernance {
   background-color: #000;
@@ -321,10 +326,9 @@
 
 }
 
-
-
 .mozaique_personnes {
   background-color: #d5d2d1;
+  padding-bottom: 4rem;
 
 
 
@@ -334,10 +338,11 @@
     flex-wrap: wrap;
     // margin-left: 15%;
     // padding-right: 15%;
-    width: 54%;
-
+    width: 100%;
+    padding-left: 22%;
+    padding-right: 15%;
     margin: auto;
-    // justify-items: center;
+    justify-items: center;
 
     h3 {
       // display: flex;
@@ -432,33 +437,17 @@
 }
 
 
-
-
-
-
-
-
 // .mozaique :hover {
 //   background-color: #000;
 //   color: #fff;
 // }
 
-
-// comment faire pour donner une largueur à .info 2 fois plus grande que .portrait? les img de .portrait ne semblent pas vouloir bouger...
-
-
-
-
-
-
-
-
 .bouton {
   border: solid;
   background-color: transparent;
   text-transform: uppercase;
   align-self: flex-end;
-  margin-right: 2rem;
+  margin:auto;
 }
 //
 // .bouton :hover {
@@ -539,3 +528,75 @@
 // .modal .container a.close:hover{
 // 	color: black;
 // }
+
+#new-footer {
+  // position:absolute;
+  display: flex;
+  flex-direction: column;
+
+  .tothetop {
+    position: absolute;
+    // align-self: center;
+    height: 1rem;
+    bottom: $footer-height + 10rem;
+		text-align: center;
+		left: 0;
+		right: 0;
+
+    span {
+      font-size: 1.7rem;
+      line-height: 2,5rem;
+      background: #fff;
+      width: 4rem;
+      height: 5rem;
+      border-radius: $border-radius;
+      display: inline-block;
+      text-align: top;
+    }
+  }
+
+
+  .footer {
+    display: flex;
+    flex-direction: row;
+
+    .footer-logos {
+      display: flex;
+      flex-direction: row;
+      flex-wrap: nowrap;
+      width: 70%;
+      align-items: center;
+      margin-left: 3rem;
+      img {
+        min-height: 4rem;
+        max-height: 4rem;
+        padding-right: 1rem;
+
+      }
+    }
+    .contact {
+      display: flex;
+      flex-direction: column;
+      width: 30%;
+      margin-top: 1.5rem;
+      align-items: flex-start;
+      img {
+        margin-bottom: 1rem;
+        max-height: 2rem;
+      }
+      svg {
+        margin-bottom: 1rem;
+      }
+      h6 {
+        margin: 0 !important;
+        font-weight: 600;
+      }
+      p {
+        margin: 0;
+      }
+    }
+  }
+
+
+
+}

user/themes/epau-antimatter/templates/modular.html.twig

@@ -6,6 +6,7 @@
 {% block javascripts %}
     {% if show_onpage_menu %}
         {% do assets.add('theme://js/singlePageNav.min.js') %}
+        
     {% endif %}
     {{ parent() }}
 {% endblock %}

user/themes/epau-antimatter/templates/modular/personnes.html.twig

@@ -1,6 +1,6 @@
 
 
-<div class="equipe"{{ page.header.class}}">
+<div class="equipe {{ page.header.class}}">
     {{ content|raw }}
 
 
@@ -49,21 +49,3 @@
 
 
 </div>
-<!--
-<script>
-
-// var .message = {{ personne.biographie }};
-$(".bouton").click(function(event){
-
-     $("#modal .message").html();
-
-     $("#modal").addClass("open");
-     // $("#body").addClass("grey");
-
-});
-
-$("#modal .mask, #modal a.close").click(function(){
-     $("#modal").removeClass("open");
-     return false;
-});
-</script> -->

user/themes/epau-antimatter/templates/modular/programmes.html.twig

@@ -1,13 +1,18 @@
 
-<div class="programmes{{ page.header.class}}">
+<div
+  class="programmes{{ page.header.class}} parallax-window"
+  data-parallax="scroll"
+  data-image-src="{{ url('theme://images/jeux-olypiques-paris-2024-village-athle-lot-e2.jpg') }}">
+<!-- <div class="parallax-window" data-parallax="scroll" data-image-src="/path/to/image.jpg"></div> -->
+
+
+<!-- <div class="images-background parallax parallax-window" data-parallax="scroll">
 
- <div class="background paralax">
     <img id="photo1" src="/user/themes/epau-antimatter/images/14360_default_big.jpg" alt="photo 1" />
     <img id="photo2" src="/user/themes/epau-antimatter/images/10361_web_01.jpg" alt="photo 2" />
     <img id="photo3" src="/user/themes/epau-antimatter/images/hyperliens_marseille_.PNG" alt="photo 3" />
     <img id="photo4" src="/user/themes/epau-antimatter/images/jeux-olypiques-paris-2024-village-athle-lot-e2.jpg" alt="photo 4" />
-
- </div>
+ </div>  -->
 
     {{ content|raw }}
 

user/themes/epau-antimatter/templates/modular/ressources.html.twig

@@ -22,25 +22,33 @@
 <div class="features {{ page.header.class}}">
 
   <div class="feature-items">
-    {% for rapport in page.header.rapports %}
+      <div class="texte-cache">
+        {% for rapport in page.header.rapports %}
 
-        <div class="feature">
+            <div class="feature ">
 
-            {% if rapport.couverture and rapport.pdf %}
-            <a href="{{page.media[rapport.pdf].url|e }}" download >
-              <img src="{{page.media[rapport.couverture].url|e }}" alt="couverture du {{rapport.titre_du_rapport}}" />
-            </a>
-            {% endif %}
-            {% if rapport.titre_du_rapport %}
-            <h4>{{ rapport.titre_du_rapport }}</h4>
-            {% endif %}
-            {% if rapport.texte_de_presentation %}
-            <p>{{ rapport.texte_de_presentation|markdown }}</p>
-            {% endif %}
+                {% if rapport.couverture and rapport.pdf %}
+                <a href="{{page.media[rapport.pdf].url|e }}" download >
+                  <img src="{{page.media[rapport.couverture].url|e }}" alt="couverture du {{rapport.titre_du_rapport}}" />
+                  {% endif %}
+                  {% if rapport.titre_du_rapport %}
+                  <h4>{{ rapport.titre_du_rapport }}</h4>
+                  {% endif %}
+                  {% if rapport.texte_de_presentation %}
+                  <p>{{ rapport.texte_de_presentation|markdown }}</p>
+                  {% endif %}
+                </a>
 
 
-        </div>
-    {% endfor %}
-  </div>
+
+            </div>
+        {% endfor %}
+      </div>
+    </div>
 
 </div>
+
+<!-- <a href=""> -->
+
+<button class="bouton-ouverture">Voir plus</button>
+<!-- </a> -->

user/themes/epau-antimatter/templates/modular/text.html.twig

@@ -1,9 +1,28 @@
-<div class="callout">
-    {% set image = page.media.images|first %}
-    {% if image %}
-        {{ image.cropResize(400,400).html('','','align-'~page.header.image_align)|raw }}
-    {% endif %}
+<div id="new-footer">
 
-  {{ content|raw }}
+      <div class="tothetop">
+          <span><a href="#" id="toTop"><i class="fa fa-arrow-up"></i></a></span>
+      </div>
+
+
+      <div class="footer">
+
+          <div class="footer-logos">
+            {{ content|raw }}
+          </div>
+
+          <div class="contact">
+              <img src="{{ url('theme://images/EPAU_logo_EPAU_vecto-seul.svg')}}" alt="logo EPAU">
+              <svg width="200" height="5" version="1.1" xmlns="http://www.w3.org/2000/svg">
+                <line x1="0" x2="30" stroke="black" fill="transparent" stroke-width="5"/>
+              </svg>
+              <h6>CONTACT :</h6>
+
+              <p>Fabienne.Dran@developpement-durable.gouv.fr</br>
+                +33 (0)1 40 81 9327</br>
+                +33 (0)7 86 5033 31.</p>
+
+          </div>
+      </div>
 
 </div>

user/themes/epau-antimatter/templates/partials/base.html.twig

@@ -32,7 +32,7 @@
         {% do assets.addJs('jquery', 101) %}
         {% do assets.addJs('theme://js/modernizr.custom.71422.js', 100) %}
         {% do assets.addJs('theme://js/antimatter.js') %}
-
+        {% do assets.addJs('theme://js/parallax.js') %}
         {% do assets.addJs('theme://js/slidebars.min.js') %}
 
     {% endblock %}
@@ -52,8 +52,8 @@
 
             <div id="logo">
 
-              <img src="/user/pages/01.home/Republique-francaise-logo-sans-text.svg" alt="logo République Française">
-              <img src="user/pages/01.home/EPAU_logo_EPAU_vecto-seul.svg" alt="logo EPAU">
+              <img id="gouv" src="/user/pages/01.home/Republique-francaise-logo-sans-text.svg" alt="logo République Française">
+              <img id="epau" src="user/pages/01.home/EPAU_logo_EPAU_vecto-seul.svg" alt="logo EPAU">
 
             </div>
 
@@ -81,14 +81,14 @@
         </section>
         {% endblock %}
 
-        {% block footer %}
+        <!-- {% block footer %}
         <footer id="footer">
             <div class="totop">
                 <span><a href="#" id="toTop"><i class="fa fa-arrow-up"></i></a></span>
             </div>
-            <p><a href="http://getgrav.org">Grav</a> was <i class="fa fa-code"></i> with <i class="fa fa-heart"></i> by <a href="http://www.rockettheme.com">RocketTheme</a>.</p>
+
         </footer>
-        {% endblock %}
+        {% endblock %} -->
     </div>
     {% block sidebar_navigation %}
         <div class="sb-slidebar sb-left sb-width-thin">

user/themes/epau-antimatter/templates/partials/navigation.html.twig

@@ -22,6 +22,8 @@
                     {{ p.menu }}
                 </a>
             </li>
+
+
         {% endif %}
     {% endfor %}
 {% endmacro %}
@@ -51,5 +53,5 @@
     {% if config.plugins.login.enabled and grav.user.username %}
         <li><i class="fa fa-lock"></i> {% include 'partials/login-status.html.twig' %}</li>
     {% endif %}
-</ul>
 
+</ul>