header fix

web/sites/development.services.yml

@@ -5,7 +5,7 @@
 parameters:
   http.response.debug_cacheability_headers: true
   twig.config:
-    debug: false
+    debug: true
     auto_reload: true
 services:
   cache.backend.null:

web/themes/custom/popsu_colloque/css/components/footer/footer.scss

@@ -3,6 +3,7 @@ footer{
   width: 100%;
   height: auto;
   padding: 2rem 0;
+  margin-top:2rem;
   h2{
     font-size: 1rem;
     text-transform: uppercase;

web/themes/custom/popsu_colloque/css/components/forms/filter.scss

@@ -85,7 +85,7 @@
 /* style the items (options), including the selected item: */
 .select-items div,.select-selected {
   color: #ffffff;
-  padding: 8px 16px;
+  padding: 8px 30px 8px 16px;
   border: 1px solid transparent;
   border-color: transparent transparent rgba(0, 0, 0, 0.1) transparent;
   cursor: pointer;

web/themes/custom/popsu_colloque/css/components/header/header.scss

@@ -1,76 +1,138 @@
 header{
-  padding: 0;
-  height: 100px;
-  // display: none;
-  div {
-    height: inherit;
-  }
-}
-
-#block-popsu-colloque-branding{
-  width: 100%;
-  position: relative;
-  // z-index: 999;
-  padding:0;
-  @media screen and (min-width: 992px) {
-    padding:0 1rem;
-  }
-  &.is-active{
-    z-index: 10000;
-  }
-  & > div {
-    display: flex;
-    padding:1rem 0.5rem;
-    & > a{
-      display: inline-block;
-      position: relative;
-      img{
-        width: auto;
-        height: 100%;
-        object-fit: contain;
-        @media screen and (min-width: 768px) {
-          width: 100%;
+  max-height: 100px;
+  .row{
+    background: white;
+    max-height: inherit;
+    justify-content: space-between;
+    #block-popsu-colloque-branding{
+      max-height: inherit;
+      & > div{
+        max-height: inherit;
+        a{
+          display: block;
+          max-height: inherit;
+          img{
+            width: 100%;
+            max-height: inherit;
+            object-fit: contain;
+            padding-bottom: 0.5rem;
+            padding-top: 0.5rem;
+            @media screen and (min-width: 450px) {
+              width: auto;
+            }
+          }
         }
       }
+      &.is-active{
+        z-index: 10000;
+      }
     }
-  }
-}
-
-#block-renderedsitesettingsblock-2{
-  width: auto;
-  border-left: 1px solid $color1;
-  padding: 0;
-  display: none;
-  min-width: 520px;
-  @media screen and (min-width: 768px) {
-    display: block;
-  }
-  .site_setting_entity{
-    display: flex;
-    align-items: center;
-    justify-content: center;
-    padding: 0 1rem;
-    h1{
-      max-width: 100%;
-      color: $color2;
-      padding-right: 1rem;
-      text-transform: uppercase;
-      text-align: right;
-      align-self: stretch;
-      margin: auto 0;
-      width: 100%;
+    #block-renderedsitesettingsblock-2{
+      width: auto;
+      border-left: 1px solid $color1;
+      padding: 0;
+      display: none;
+      @media screen and (min-width: 1200px) {
+        display: flex;
+      }
+      .site_setting_entity{
+        display: flex;
+        align-items: center;
+        justify-content: center;
+        padding: 0 1rem 0 0rem;
+        h1{
+          max-width: 100%;
+          color: $color2;
+          padding-right: 1rem;
+          text-transform: uppercase;
+          text-align: right;
+          align-self: stretch;
+          margin: auto 0;
+          width: 100%;
 
+        }
+        .__info_colloque{
+          width: 100%;
+          align-self: stretch;
+          margin: auto 0;
+          height: 7vw;
+          height: auto;
+          &>div{
+            &:first-child{
+              white-space: nowrap;
+              border-bottom: 2px solid $color1;
+            }
+          }
+        }
+      }
     }
-    .__info_colloque{
-      width: 100%;
-      align-self: stretch;
-      margin: auto 0;
-      height: 7vw;
-      height: auto;
-      &>div{
-        &:first-child{
-          white-space: nowrap;
-          border-bottom: 2px solid $color1;
+    #block-mainnavigation{
+      max-width: max-content;
+      width: max-content;
+      .burger{
+        padding-top: 0.25rem;
+        z-index: 9999;
+      }
+      .nav-main{
+        display: none;
+        @media screen and (min-width: 1200px) {
+        display: block;
+          ul{
+            margin-bottom: 0;
+            li{
+              margin: 0 0.5rem;
+            }
+          }
+        }
+        &.is-active{
+          display: block;
+          position: fixed;
+          width: 100vw;
+          height: 100vh;
+          left: 0;
+          top: 0;
+          background: white;
+          z-index: 9999;
+          @media screen and (min-width: 576px) {
+            height: auto;
+            ul{
+              margin: 130px 0 50px 0;
+            }
+            li{
+              font-size: 1.7rem;
+              line-height: 3rem;
+              padding: 0 15px;
+            }
+          }
+          ul{
+            display: flex;
+            justify-content: center;
+            flex-direction: column;
+            height: 100%;
+            align-items: center;
+            li{
+              font-size: 1.5rem;
+              line-height: 3rem;
+              padding: 0 15px;
+              @media screen and (min-width: 360px) {
+                width: 100%;
+                &::before{
+                  display: inline-block;
+                  content: " ";
+                  width: 0%;
+                  transition: width 1s ease;
+                  height: 1px;
+                  background: $color1;
+                }
+                &:hover{
+                  &::before{
+                    width: 10%;
+                    transition: all 1s ease;
+                  }
+                }
+              }
+            }
+          }
         }
       }
     }
@@ -78,18 +140,13 @@ header{
 }
 
 #block-mainnavigation{
-  width: 100%;
   border-left: 1px solid $color1;
-  padding: 0rem;
   display: flex;
   align-items: center;
   justify-content: flex-end;
-  @media screen and (min-width: 1200px) {
-    min-width: auto;
-    padding: 2rem;
-  }
   .burger{
     display: block;
+    margin: auto;
     @media screen and (min-width: 1200px) {
       display: none;
     }
@@ -103,84 +160,25 @@ header{
     @media screen and (min-width: 1200px) {
       display: flex;
     }
-    @media screen and (max-width: 1200px) {
-      &.is-active{
-        display: block;
-        position: fixed;
-        top: 0;
-        left: 0;
-        width: 100%;
-        height: 100%;
-        background: white;
-        z-index: 999;
-        ul{
-          display: flex;
-          justify-content: center;
-          flex-direction: column;
-          height: 100%;
-          align-items: center;
-          li{
-            width: 100%;
-            font-size: 2rem;
-            line-height: 3rem;
-            display: inline-flex;
-            align-items: center;
-            padding: 0 5%;
-            &::before{
-              display: block;
-              content: " ";
-              width: 0%;
-              transition: width 1s ease;
-              height: 1px;
-              background: $color1;
-            }
-            &:hover{
-              &::before{
-                width: 10%;
-                transition: all 1s ease;
-              }
-            }
-            a{
-              min-width: max-content;
-              margin: 0 1rem;
-            }
-          }
-        }
-      }
-    }
-    ul{
-      flex-wrap: nowrap;
-      li{
-        padding: 0 0.5rem;
-        &:not(:last-child){
-          border-right: 1px solid $col_black;
-        }
-        a{
-          white-space: nowrap;
-        }
-      }
-    }
   }
 }
 
 header.front{
   #block-popsu-colloque-branding{
-    width: 100%;
+    width: 21rem;
     position: relative;
-    z-index: 999;
-    padding: 1rem 0 0 0;
-    & > div {
-      & > a{
-        display: inline-block;
-        height: 8rem;
-        max-height: 150px;
-        position: relative;
-        img{
-          width: auto;
-          height: 100%;
-          object-fit: contain;
-        }
+    z-index: 9999;
+    a{
+      max-height: 8rem!important;
+    }
+    &.is-active{
+      overflow: inherit;
+      &>div{
+        max-height: 115px;
       }
     }
   }
+  #block-renderedsitesettingsblock-2{
+    display: none;
+  }
 }

web/themes/custom/popsu_colloque/css/components/header/sub_menu.scss

@@ -4,14 +4,25 @@
     padding: 0;
     margin: 0;
     li{
-      margin-right: 1rem;
+      // margin-right: 1rem;
+      width: 100%;
+      text-align: center;
+      @media screen and (min-width: 576px) {
+        width: auto!important;
+      }
+      &:first-child{
+        margin-right: 1rem;
+      }
       a{
         display: block;
-        padding: 1rem 1rem;
+        padding: 0.5rem 1rem;
         border: 1px solid $color2;
         color: $color2;
         background: white;
         transition: color 0.3s ease, background 0.3s ease;
+        @media screen and (min-width: 576px) {
+          // padding: 1rem 1rem;
+        }
         &:hover{
           text-decoration: none;
           color: white;

web/themes/custom/popsu_colloque/css/components/layout.scss

@@ -20,7 +20,7 @@ main{
 }
 
 main:not(.home){
-  padding-top: 0rem;
+  padding-top: 2rem;
   @media screen and (min-width: 768px) {
     padding: 5rem 0!important;
   }
@@ -77,7 +77,7 @@ article{
   .__head{
     div{
       & > div{
-        // padding: 0 0.5rem;
+        padding: 0 0.5rem;
       }
     }
   }

web/themes/custom/popsu_colloque/css/components/slides/slides.scss

@@ -15,9 +15,49 @@
 }
 
 #block-views-block-slide-programme-block-1{
+  .date{
+    font-size: 1.5rem;
+    font-family: 'truenoregular';
+    text-transform: uppercase;
+  }
   .__slide{
+    .flickity-viewport{
+      overflow: initial;
+    }
+    a{
+      height: 100%;
+      background: white;
+      @include shadow;
+    }
     article{
-      min-height: calc(100% - 30px );
+      height: 325px;
+      background: none;
+      display: flex;
+      margin-top: 3rem;
+      margin-bottom: 1.5rem;
+      &.__wrap{
+        background: white;
+      }
+      &.last::after{
+        display: inline-block;
+        content: " ";
+        width: 3px;
+        height: auto;
+        margin: -2.5rem 0 0 0;
+        background: $color1;
+        position: relative;
+        left: 0.5rem;
+      }
+      &.first{
+        flex-direction: column;
+        span{
+          position: absolute;
+          top: -2.5rem;
+          width: max-content;
+          font-size: 1.5rem;
+          font-family: 'truenoregular';
+        }
+      }
     }
   }
 }
@@ -33,7 +73,31 @@
         display: block;
       }
       .flickity-slider{
-        margin-left: 1rem;
+        // margin-left: 1rem;
+      }
+    }
+  }
+}
+
+
+.paragraph--type--role-de-l-intervenant{
+  margin-bottom: 2rem;
+  .__slide{
+    &:after {
+      content: 'flickity';
+      display: none;
+      @media screen and ( min-width: 768px ) {
+        content: '';
+      }
+    }
+    .flickity-viewport{
+      overflow: initial;
+    }
+    .flickity-slider > div{
+      width: 70%;
+      padding: 0 0.5rem;
+      @media screen and ( min-width: 768px ) {
+        width: 100%;
       }
     }
   }

web/themes/custom/popsu_colloque/css/components/thumbnails/thumbnails.scss

@@ -1,10 +1,18 @@
 // thumbnails global
+section{
+  & > div:not(.__slide){
+    article.thumbnails.programme{
+      @include shadow;
+    }
+  }
+}
+
 .thumbnails{
   width: 100%;
   height: auto;
   background: white;
   margin: $gutter1;
-  &:not(.bibliographie){
+  &:not(.bibliographie):not(.programme){
     @include shadow;
   }
   figure{
@@ -38,6 +46,11 @@
   }
 
   &.bibliographie{
+    background: white!important;
+    padding: 0.5rem;
+    &.link_ext{
+      @include shadow;
+    }
     @media screen and (min-width: 768px) {
       width: calc(100% / 2 - #{$gutter1} * 2);
     }
@@ -47,12 +60,18 @@
     @media screen and (min-width: 1200px) {
       width: calc(100% / 4 - #{$gutter1} * 2);
     }
-    a{
-      & > div  * {
-        display: inline;
-        background: white;
-        color: $color2;
+    & > div  * {
+      color: $col_black;
+      &.__auteur *{
+        font-size: 1.4rem;
       }
+      &.__body{
+        margin:1rem 0;
+      }
+    }
+    a{
+      text-decoration: underline;
+      color: $color1;
     }
   }
 }
@@ -60,7 +79,11 @@
 // thumbnails slides
 .__slide{
   .thumbnails{
-    max-width: 380px;
+    // max-width: 380px;
+    width: calc(100% - 30px);
+    a{
+      width: calc(100%);
+    }
     @media screen and (min-width: 768px) {
       width: calc(100% / 2 - #{$gutter1} * 2);
     }

web/themes/custom/popsu_colloque/css/hamburgers/hamburgers.scss

@@ -9,8 +9,8 @@
 
 // Settings
 // ==================================================
-$hamburger-padding-x           : 15px !default;
-$hamburger-padding-y           : 15px !default;
+$hamburger-padding-x           : 0px !default;
+$hamburger-padding-y           : 0px !default;
 $hamburger-layer-width         : 30px !default;
 $hamburger-layer-height        : 3px !default;
 $hamburger-layer-spacing       : 6px !default;

web/themes/custom/popsu_colloque/css/typography.scss

@@ -8,16 +8,14 @@
 
 @font-face {
     font-family: 'cormorantBold';
-    src: url('../fonts/Cormorant-Bold-webfont.woff2') format('woff2'),
-         url('../fonts/Cormorant-Bold-webfont.woff') format('woff');
+    src: url('../fonts/Cormorant-Bold-webfont.woff') format('woff');
     font-weight: normal;
     font-style: normal;
 }
 
 @font-face {
     font-family: 'cormorantBoldItalic';
-    src: url('../fonts/Cormorant-BoldItalic-webfont.woff2') format('woff2'),
-         url('../fonts/Cormorant-BoldItalic-webfont.woff') format('woff');
+    src: url('../fonts/Cormorant-BoldItalic-webfont.woff') format('woff');
     font-weight: lighter;
     font-style: normal;
 }
@@ -145,7 +143,7 @@ main{
     letter-spacing: $letter_spacingH;
     color: $lightgrey;
   }
-  
+
   .__ressources{
     h4{
       text-transform: uppercase;

web/themes/custom/popsu_colloque/js/script.js

@@ -54,12 +54,58 @@
   }
 
   function slide() {
-    var $slide = $('main .__slide');
+    var $slide = $('main section .__slide');
+
+    var thumbnails = $('.__slide article.programme.is-selected');
+    var $head_date =  $('#block-views-block-slide-programme-block-1 section.first:before');
+
     $slide.each(function() {
       $(this).flickity({
         cellAlign: 'left',
         pageDots: false,
-        contain: true
+        contain: true,
+        on: {
+          ready: function() {
+
+            var dates = {},
+            date;
+            var $cells = this.cells;
+
+            // console.log('$cells',$cells);
+
+        $('.__slide article.programme[data-date]').each(function(i, el){
+            date = $(el).data('date');
+
+            if (dates.hasOwnProperty(date)) {
+              dates[date] += 1;
+              $(this).addClass('last');
+            }
+            else {
+                dates[date] = 1;
+                $(this).addClass('first');
+                var dateValue = $(this).data('date');
+                console.log('dateValue',dateValue);
+                // $(this).html(dateValue );
+                $("<span>"+dateValue+"</span>").prependTo($(this));
+            }
+        });
+
+            // var date = this.cells.element.dataset.date;
+        //     var date = this.cells;
+        //     for (var i = 0; i < date.length; i++) {
+        //       console.log("cc",date[i].element.dataset.date);
+        //       $head_date.append( "<div>"+date[i].element.dataset.date+"</div>" );
+        //     }
+          },
+          // change: function(index, e) {
+          //   var date_change = this.cells[index].element.dataset.date;
+          //
+          //   if ($head_date.html() != date_change) {
+          //     $head_date.html( "<div>"+date_change+"</div>" );
+          //   }
+          //
+          // }
+        }
       })
     });
 
@@ -75,6 +121,25 @@
       })
     });
 
+    var $slide_paragrpahe = $('main .paragraph .__slide');
+    $slide_paragrpahe.each(function() {
+      $(this).flickity({
+        cellAlign: 'left',
+        pageDots: false,
+        prevNextButtons: false,
+        contain: true,
+        watchCSS: true,
+      })
+    });
+
+    // function date() {
+    //   var thumbnails = $('.__slide article.programme');
+    //   $.each(thumbnails, function(i){
+    //     date = thumbnails[i].dataset.date;
+    //   })
+    // }
+    // date();
+
   }
 
   function burger() {
@@ -89,12 +154,27 @@
   }
 
   function replaceAny(){
-    var $any_value = $('#edit-field-theme-target-id option').attr('value');
-    if ($any_value == "All") {
-      var $any_content = $('#edit-field-theme-target-id option:first-child').html();
-      var newhtml = $any_content.replace("- Any -", "Thèmes");
-      $('#edit-field-theme-target-id option:first-child').html(newhtml);
-    }
+    var $selects = $(".js-form-type-select .form-select");
+
+    $.each( $selects , function(i) {
+      var selectOptionAll = $(this).find("option[value='All']");
+      var optionContent = selectOptionAll.html();
+
+      if ($(this).attr('id') == 'edit-field-theme-target-id') {
+
+        var newhtml = optionContent.replace("- Any -", "Thèmes");
+
+      } else if ($(this).attr('id') == 'edit-field-type-de-publication-target-id' ) {
+
+        var newhtml = optionContent.replace("- Any -", "Publications");
+
+      } else {
+        // nothing
+      }
+
+      selectOptionAll.html(newhtml);
+    });
+
   }
 
   function select_custom() {
@@ -182,12 +262,24 @@
 
 }
 
+  function remove_isactive() {
+
+    $( window ).resize(function() {
+      var width = $(window).width();
+      if (width <= '1185') {
+        $('header .is-active').removeClass("is-active");
+        $('body.is-active').removeClass("is-active");
+      }
+    });
+  }
+
   $( document ).ready(function() {
     notes();
     slide();
     burger();
     replaceAny();
     select_custom();
+    remove_isactive();
   });
 
 })(jQuery);

web/themes/custom/popsu_colloque/template/block/block--mainnavigation.html.twig

@@ -27,7 +27,7 @@
  * @ingroup themeable
  */
 #}
-<div{{ attributes }}>
+<div{{ attributes }} class="col-3 col-sm-2 col-xl">
   {% block content %}
   <div class="nav-main">
     {{ content }}

web/themes/custom/popsu_colloque/template/block/block--popsu-colloque-branding.html.twig

@@ -27,7 +27,7 @@
  * @ingroup themeable
  */
 #}
-<div{{ attributes }} class="col-md-3 col-lg-3 col-xl-2">
+<div{{ attributes }} class="col-9 col-sm-10 col-xl-auto">
   {{ title_prefix }}
   {% if label %}
     <h2{{ title_attributes }}>{{ label }}</h2>

web/themes/custom/popsu_colloque/template/components/header_slide.html.twig

@@ -1,5 +1,5 @@
 <div class="head">
-  <h3>{{ header }}</h3>
+  {{ header }}
   <div class="more_link">
     <a class="blue" href="{{more['#url']}}">{{ more['#title'] }}<span>+</span></a>
   </div>

web/themes/custom/popsu_colloque/template/components/share_rs.html.twig

@@ -4,25 +4,32 @@
     {% set class = "d-flex d-md-block" %}
 {% endif %}
 
+{% set url = url('<current>') %}
+{% set title = label[0]['#context']['value'] %}
+
 <div class="__rs {{class}}">
   <div class="__mail">
-    <a href="#">
+    <a target="_blank" href="mailto:?Subject= {{title}} {{url}}">
       <img src="/themes/custom/popsu_colloque/images/mail.svg" alt="Mail">
     </a>
   </div>
+
   <div class="__facebook">
-    <a href="#">
+    <a target="_blank" href="https://www.facebook.com/sharer/sharer.php?u={{url}}">
       <img src="/themes/custom/popsu_colloque/images/facebook.svg" alt="facebook">
     </a>
   </div>
+
   <div class="__twitter">
-    <a href="#">
-      <img src="/themes/custom/popsu_colloque/images/twitter.svg" alt="twitter">
-    </a>
+    <a target="_blank" href="https://twitter.com/intent/tweet?text={{title}}%20{{url}}%20@popsu_colloque">
+    <img src="/themes/custom/popsu_colloque/images/twitter.svg" alt="twitter">
+  </a>
   </div>
+
   <div class="__linkedin">
-    <a href="#">
+    <a target="_blank" href="https://www.linkedin.com/shareArticle?mini=true&url={{url}}/&title=&summary=&source=">
       <img src="/themes/custom/popsu_colloque/images/linkedin.svg" alt="linkedin">
     </a>
   </div>
+
 </div>

web/themes/custom/popsu_colloque/template/fields/field--node--field-bibliographie.html.twig

@@ -45,7 +45,7 @@
 %}
 
 <h4>{{ label }}</h4>
-<div class="d-lg-flex flex-wrap d-block pb-4">
+<div class="row flex-wrap pb-4 col-12 px-0 mx-auto">
   {% for item in items %}
     {{ item.content }}
   {% endfor %}

web/themes/custom/popsu_colloque/template/fields/field--paragraph--field-intervenants--role-de-l-intervenant.html.twig

@@ -0,0 +1,72 @@
+{#
+/**
+ * @file
+ * Default theme implementation for a field.
+ *
+ * To override output, copy the "field.html.twig" from the templates directory
+ * to your theme's directory and customize it, just like customizing other
+ * Drupal templates such as page.html.twig or node.html.twig.
+ *
+ * Instead of overriding the theming for all fields, you can also just override
+ * theming for a subset of fields using
+ * @link themeable Theme hook suggestions. @endlink For example,
+ * here are some theme hook suggestions that can be used for a field_foo field
+ * on an article node type:
+ * - field--node--field-foo--article.html.twig
+ * - field--node--field-foo.html.twig
+ * - field--node--article.html.twig
+ * - field--field-foo.html.twig
+ * - field--text-with-summary.html.twig
+ * - field.html.twig
+ *
+ * Available variables:
+ * - attributes: HTML attributes for the containing element.
+ * - label_hidden: Whether to show the field label or not.
+ * - title_attributes: HTML attributes for the title.
+ * - label: The label for the field.
+ * - multiple: TRUE if a field can contain multiple items.
+ * - items: List of all the field items. Each item contains:
+ *   - attributes: List of HTML attributes for each item.
+ *   - content: The field item's content.
+ * - entity_type: The entity type to which the field belongs.
+ * - field_name: The name of the field.
+ * - field_type: The type of the field.
+ * - label_display: The display settings for the label.
+ *
+ * @see template_preprocess_field()
+ *
+ * @ingroup themeable
+ */
+#}
+{%
+  set title_classes = [
+    label_display == 'visually_hidden' ? 'visually-hidden',
+  ]
+%}
+
+{% if label_hidden %}
+  {% if multiple %}
+    <div{{ attributes }} class="__slide">
+      {% for item in items %}
+        <div{{ item.attributes }}>{{ item.content }}</div>
+      {% endfor %}
+    </div>
+  {% else %}
+    {% for item in items %}
+      <div{{ attributes }}>{{ item.content }}</div>
+    {% endfor %}
+  {% endif %}
+{% else %}
+  <div{{ attributes }}>
+    <div{{ title_attributes.addClass(title_classes) }}>{{ label }}</div>
+    {% if multiple %}
+      <div>
+    {% endif %}
+    {% for item in items %}
+      <div{{ item.attributes }}>{{ item.content }}</div>
+    {% endfor %}
+    {% if multiple %}
+      </div>
+    {% endif %}
+  </div>
+{% endif %}

web/themes/custom/popsu_colloque/template/html.html.twig

@@ -33,7 +33,7 @@
     <css-placeholder token="{{ placeholder_token }}">
     <js-placeholder token="{{ placeholder_token }}">
   </head>
-  <body{{ attributes }} class="container-fluid px-0">
+  <body{{ attributes }}>
     {#
       Keyboard navigation/accessibility link to main content section in
       page.html.twig.

web/themes/custom/popsu_colloque/template/menu/menu--main.html.twig

@@ -32,7 +32,7 @@
   {% import _self as menus %}
   {% if items %}
     {% if menu_level == 0 %}
-      <ul{{ attributes }} class="row m-0 pl-0">
+      <ul{{ attributes }} class="d-flex px-0">
     {% else %}
       <ul>
     {% endif %}

web/themes/custom/popsu_colloque/template/node/node--moments.html.twig

@@ -77,7 +77,7 @@
 
 
 <article{{ attributes }} class="row">
-  <div class="__wrapper col-sm-12 col-md-9">
+  <div class="__wrapper col-sm-12 col-md-9 px-0">
     <div class="__img-hero">
       {{content.field_image}}
     </div>
@@ -87,11 +87,11 @@
         <h2>{{label}}</h2>
       </div>
 
-      <div class="__wrap_side col-md-12 col-lg-2 mt-3">
+      <div class="__wrap_side col-md-12 col-lg-1 mt-3">
         {% include 'themes/custom/popsu_colloque/template/components/share_rs.html.twig' with { page : 'moments' } %}
       </div>
 
-      <div class="__wrap_content col-12 col-lg-10 my-3">
+      <div class="__wrap_content col-12 col-lg-11 my-3">
         <div class="__head mb-5">
           <div class="d-flex flex-wrap">
             {{ content.field_date_du_programme }} |

web/themes/custom/popsu_colloque/template/node/node--publications--full.html.twig

@@ -80,13 +80,13 @@
 
   <div class="__wrapper col-sm-12 col-md-9 col-lg-8">
     {% if content.field_ajouter_un_media[0]['#paragraph'].field_video %}
-      <div class="__hero">
+      <div class="__hero mb-4">
         {{content.field_ajouter_un_media}}
       </div>
     {% endif %}
-    <div class="__wrap_content d-flex">
+    <div class="__wrap_content d-flex flex-wrap flex-lg-nowrap">
       {% if content.field_ajouter_un_media[0]['#paragraph'].field_image %}
-        <div class="__hero">
+        <div class="__hero col-12 col-md-12 col-lg-4 px-0 pr-lg-4 m-0 my-4 mx-sm-0 my-lg-0">
           {{content.field_ajouter_un_media}}
         </div>
       {% endif %}

web/themes/custom/popsu_colloque/template/node/node--thumbnails-bilbiographie.html.twig

@@ -72,19 +72,29 @@
  * @ingroup themeable
  */
 #}
-<article{{ attributes }} class="thumbnails bibliographie">
-<div>
-  <a href="{{url}}">
-  <div>
-    {{content.field_auteur}}
-  </div>
-  <div>
-    {{ label }}
-  </div>
-  <div>
-    {{ content|without('field_auteur') }}
-  </div>
 
-  </a>
+{% set urlExt = content.field_lien_externe[0]['#title'] %}
+
+{% if urlExt %}
+  {% set class = 'link_ext' %}
+{% endif %}
+
+<article{{ attributes }} class="thumbnails bibliographie {{class}}">
+<div>
+{% if urlExt %}
+  <a target="_blank" href="{{urlExt}}">
+{% endif %}
+    <div class="__auteur">
+      {{content.field_auteur}}
+    </div>
+    <div>
+      {{ label }}
+    </div>
+    <div class="__body">
+      {{ content.body }}
+    </div>
+  {% if urlExt %}
+    </a>
+  {% endif %}
 </div>
 </article>

web/themes/custom/popsu_colloque/template/node/node--thumbnails-publications.html.twig

@@ -82,6 +82,7 @@
         </div>
         <div class="__wrap">
           <div class="__content">
+            {{content.field_auteur|raw}}
             {{ label|raw }}
             {{content.field_complement_d_info|raw}}
           </div>

web/themes/custom/popsu_colloque/template/page--front.html.twig

@@ -46,7 +46,7 @@
  */
 #}
 <div class="layout-container">
-  <header role="banner" class="front">
+  <header role="banner" class="front container-fluid">
     {{ page.header }}
   </header>
 

web/themes/custom/popsu_colloque/template/regions/region--header.html.twig

@@ -15,7 +15,7 @@
  */
 #}
 {% if content %}
-  <div{{ attributes }} class="d-flex align-items-stretch">
+  <div{{ attributes }} class="row">
     {{ content }}
   </div>
 {% endif %}

web/themes/custom/popsu_colloque/template/views/lists/views-view-unformatted--programme.html.twig

@@ -37,9 +37,9 @@
           default_row_class ? 'thumbnails programme',
         ]
       %}
-      <div{{ row.attributes.addClass(row_classes) }}>
+      <article{{ row.attributes.addClass(row_classes) }}>
         {{- row.content -}}
-      </div>
+      </article>
     {% endfor %}
   </div>
 </section>

web/themes/custom/popsu_colloque/template/views/lists/views-view-unformatted--slide_programme.html.twig

@@ -17,14 +17,16 @@
  * @ingroup themeable
  */
 #}
+{% if title %}
 
+{% endif %}
 {% for row in rows %}
   {%
     set row_classes = [
       default_row_class ? 'views-row',
     ]
   %}
-  <article class="thumbnails programme">
+  <article class="thumbnails programme" data-date="{{title}}">
     {{- row.content -}}
   </article>
 {% endfor %}

web/themes/custom/popsu_colloque/template/views/views-view--dernieres_publications.html.twig

@@ -34,7 +34,7 @@
 #}
 
 
-<div class="views col">
+<div class="views col px-0">
 
   {{ title_prefix }}
   {{ title }}

web/themes/custom/popsu_colloque/template/views/views-view--slide_programme.html.twig

@@ -34,7 +34,7 @@
 #}
 
 
-<div class="views col">
+<div class="views col px-0">
 
   {{ title_prefix }}
   {{ title }}
@@ -51,9 +51,9 @@
 
   {% if rows -%}
     <section>
-    <div class="__slide">
-      {{ rows }}
-    </div>
+      <div class="__slide">
+        {{ rows }}
+      </div>
     </section>
   {% elseif empty -%}
     {{ empty }}