correction reco

user/themes/lecampus/js/site.js

@@ -125,6 +125,7 @@ function addclass() {
   $reco_click.on('click', function() {
     $reco_txt.toggleClass('open');
     $(this).toggleClass('open');
+    $('html, body').animate({scrollTop:$('#reco').position().top}, 'slow');
   })
 
   var $out = $('.opt-out .txt');

user/themes/lecampus/scss/theme/_blog.scss

@@ -732,13 +732,9 @@
   }
   .txt{
     z-index: -1;
-    position: absolute;
+    position: relative;
     width: 100%;
-    padding-top: 20px;
-    @include inlineflex;
-    justify-content: center;
-    -webkit-transform: translateY(-100%);
-            transform: translateY(-100%);
+    display: none;
     p{
       color: white;
       width: 300px;
@@ -748,6 +744,9 @@
       }
     }
     &.open{
+      @include inlineflex;
+      justify-content: center;
+      padding-top: 20px;
       z-index: 999;
       background: $dark-blue;
       .item{
@@ -759,7 +758,6 @@
     }
   }
   .item{
-    display: none;
     margin: 0 0px 20px 20px;
     border-left: 1px solid white;
     padding-left: 20px;

user/themes/lecampus/templates/partials/reco.html.twig

@@ -3,22 +3,23 @@
 
 <div id="reco">
   {% for p in page.collection(options)%}
+
+    <div class="title">
+      <{{h5}}>{{p.title}}</{{h5}}>
+    </div>
+
     <div class="txt">
       {% for item in p.collection %}
       {% set image = item.media.images|first %}
       <div class="item">
-      {% if image %}
+        {% if image %}
         {{ image.html('','logo') }}
-      {% endif %}
+        {% endif %}
         <h3>{{item.title}}</h3>
         {{item.content}}
       </div>
       {% endfor %}
     </div>
 
-    <div class="title">
-      <{{h5}}>{{p.title}}</{{h5}}>
-    </div>
-
   {% endfor %}
 </div>