collection in mobile is ok

sites/all/themes/custom/edlptheme/assets/dist/scripts/main.min.js

@@ -16,6 +16,7 @@
       end:0
     };
     var _corpus_promise;
+    var _is_mobile =  edlp_mobile.device_is_mobile;
 
     //  ___      _ _
     // |_ _|_ _ (_) |_
@@ -24,19 +25,29 @@
     function init(){
       console.log("EdlpTheme init()");
 
+
       // if(!drupalSettings.path.isFront)
       //   return;
 
-      initEvents();
+      if(!_is_mobile){
+        initEvents();
 
-      _audioPlayer = new AudioPlayer();
+        _audioPlayer = new AudioPlayer();
-      _compoPlayer = new CompoPlayer();
+        _compoPlayer = new CompoPlayer();
 
-      checkLayout();
 
-      initAjaxLinks();
+        checkLayout();
 
-      initHistory();
+        initAjaxLinks();
+
+        initHistory();
+      }else{
+        if(drupalSettings.path.isFront){
+          initHomeMobile();
+
+        }
+        _$body.attr('booted', 'booted');
+      }
 
 
       // if(!drupalSettings.path.isFront)
@@ -45,6 +56,32 @@
       // initEvents();
     };
 
+    function initHomeMobile(){
+      $('.field--name-field-notice, .index', '.entrees .taxonomy-term.vocabulary-entrees')
+        .addClass('closed');
+      $('.field--name-field-notice>.field__label', '.entrees .taxonomy-term.vocabulary-entrees')
+        .on('click', onClickHomeMobileNotice);
+      $('.index>.field__label', '.entrees .taxonomy-term.vocabulary-entrees')
+        .on('click', onClickHomeMobileIndex);
+    };
+
+    function onClickHomeMobileNotice(e){
+      // console.log('onClickHomeMobileNotice');
+      // var $part = $(this).parent();//parents('.taxonomy-term');
+      toggleEntreeOpening($(this).parent(), 'notice');
+    };
+
+    function onClickHomeMobileIndex(e){
+      // console.log('onClickHomeMobileIndex');
+      // var $part = $(this).parent();//parents('.taxonomy-term');
+      toggleEntreeOpening($(this).parent(), 'index');
+    };
+
+    function toggleEntreeOpening($e, part){
+      $e.toggleClass('closed')
+        .parents('.taxonomy-term.vocabulary-entrees.home_mobile').toggleClass(part+'-opened');
+    }
+
     //  ___             _
     // | __|_ _____ _ _| |_ ___
     // | _|\ V / -_) ' \  _(_-<
@@ -1750,7 +1787,7 @@
   } // end EdlpTheme()
 
   $(document).ready(function($) {
-    if(drupalSettings.path.isFront && !edlp_mobile.device_is_mobile){
+    if(drupalSettings.path.isFront){
       var edlptheme = new EdlpTheme();
     }else{
       $('body').attr('booted', 'booted');

sites/all/themes/custom/edlptheme/assets/dist/styles/app.min.css

@@ -1375,8 +1375,8 @@ main[role="main"] div.taxonomy-term {
     display: none; }
   main[role="main"] div.taxonomy-term.home_mobile h2 {
     margin: 0;
-    font-size: 1.3em;
+    font-size: 0.9em;
-    font-weight: 500;
+    font-weight: normal;
     text-transform: uppercase; }
   main[role="main"] div.taxonomy-term:not(.home_mobile).field__label {
     display: none; }
@@ -1384,9 +1384,10 @@ main[role="main"] div.taxonomy-term {
     margin-bottom: 1em; }
   main[role="main"] div.taxonomy-term.home_mobile .field__label {
     margin: 0;
-    font-size: 0.9em;
+    font-size: 0.82em;
-    font-weight: normal;
+    font-weight: 600;
-    text-transform: uppercase; }
+    line-height: 1.6;
+    text-transform: none; }
   main[role="main"] div.taxonomy-term article.node--type-enregistrement h2.node-title {
     font-size: 0.82em;
     font-weight: 600;
@@ -1395,8 +1396,20 @@ main[role="main"] div.taxonomy-term {
     margin: 0.9em 0 0 0; }
 
 main[role="main"] div.taxonomy-term.vocabulary-entrees.home_mobile {
+  padding-bottom: 1em;
   border-bottom: 1px solid red; }
+  main[role="main"] div.taxonomy-term.vocabulary-entrees.home_mobile .field--name-field-notice > .field__label, main[role="main"] div.taxonomy-term.vocabulary-entrees.home_mobile .index > .field__label {
+    cursor: pointer; }
   main[role="main"] div.taxonomy-term.vocabulary-entrees.home_mobile .field--name-field-notice .field__item, main[role="main"] div.taxonomy-term.vocabulary-entrees.home_mobile .field--name-field-notice .item-list, main[role="main"] div.taxonomy-term.vocabulary-entrees.home_mobile .index .field__item, main[role="main"] div.taxonomy-term.vocabulary-entrees.home_mobile .index .item-list {
+    height: auto;
+    -webkit-transition: height 0.3s ease-in-out;
+    transition: height 0.3s ease-in-out; }
+  main[role="main"] div.taxonomy-term.vocabulary-entrees.home_mobile .field--name-field-notice.closed .field__item, main[role="main"] div.taxonomy-term.vocabulary-entrees.home_mobile .field--name-field-notice.closed .item-list, main[role="main"] div.taxonomy-term.vocabulary-entrees.home_mobile .index.closed .field__item, main[role="main"] div.taxonomy-term.vocabulary-entrees.home_mobile .index.closed .item-list {
+    overflow: hidden;
+    height: 1px;
+    -webkit-transition: height 0.01s ease-in-out;
+    transition: height 0.01s ease-in-out; }
+  main[role="main"] div.taxonomy-term.vocabulary-entrees.home_mobile.notice-opened .field--name-description, main[role="main"] div.taxonomy-term.vocabulary-entrees.home_mobile.index-opened .field--name-description {
     overflow: hidden;
     height: 1px; }
 
@@ -1494,6 +1507,14 @@ main[role="main"] span.close-col-btn {
   background-position: center;
   background-size: contain; }
 
+html.is-mobile main[role="main"] .node--type-enregistrement.node--view-mode-full h2.node-title {
+  font-size: 0.9em;
+  font-weight: normal;
+  text-transform: uppercase; }
+
+html.is-mobile main[role="main"] .node--type-enregistrement.node--view-mode-full .audiofield label {
+  display: none; }
+
 #audio-player {
   position: absolute;
   -webkit-box-sizing: border-box;

sites/all/themes/custom/edlptheme/assets/scripts/main.js

@@ -16,6 +16,7 @@
       end:0
     };
     var _corpus_promise;
+    var _is_mobile =  edlp_mobile.device_is_mobile;
 
     //  ___      _ _
     // |_ _|_ _ (_) |_
@@ -24,19 +25,29 @@
     function init(){
       console.log("EdlpTheme init()");
 
+
       // if(!drupalSettings.path.isFront)
       //   return;
 
-      initEvents();
+      if(!_is_mobile){
+        initEvents();
 
-      _audioPlayer = new AudioPlayer();
+        _audioPlayer = new AudioPlayer();
-      _compoPlayer = new CompoPlayer();
+        _compoPlayer = new CompoPlayer();
 
-      checkLayout();
 
-      initAjaxLinks();
+        checkLayout();
 
-      initHistory();
+        initAjaxLinks();
+
+        initHistory();
+      }else{
+        if(drupalSettings.path.isFront){
+          initHomeMobile();
+
+        }
+        _$body.attr('booted', 'booted');
+      }
 
 
       // if(!drupalSettings.path.isFront)
@@ -45,6 +56,32 @@
       // initEvents();
     };
 
+    function initHomeMobile(){
+      $('.field--name-field-notice, .index', '.entrees .taxonomy-term.vocabulary-entrees')
+        .addClass('closed');
+      $('.field--name-field-notice>.field__label', '.entrees .taxonomy-term.vocabulary-entrees')
+        .on('click', onClickHomeMobileNotice);
+      $('.index>.field__label', '.entrees .taxonomy-term.vocabulary-entrees')
+        .on('click', onClickHomeMobileIndex);
+    };
+
+    function onClickHomeMobileNotice(e){
+      // console.log('onClickHomeMobileNotice');
+      // var $part = $(this).parent();//parents('.taxonomy-term');
+      toggleEntreeOpening($(this).parent(), 'notice');
+    };
+
+    function onClickHomeMobileIndex(e){
+      // console.log('onClickHomeMobileIndex');
+      // var $part = $(this).parent();//parents('.taxonomy-term');
+      toggleEntreeOpening($(this).parent(), 'index');
+    };
+
+    function toggleEntreeOpening($e, part){
+      $e.toggleClass('closed')
+        .parents('.taxonomy-term.vocabulary-entrees.home_mobile').toggleClass(part+'-opened');
+    }
+
     //  ___             _
     // | __|_ _____ _ _| |_ ___
     // | _|\ V / -_) ' \  _(_-<
@@ -1750,7 +1787,7 @@
   } // end EdlpTheme()
 
   $(document).ready(function($) {
-    if(drupalSettings.path.isFront && !edlp_mobile.device_is_mobile){
+    if(drupalSettings.path.isFront){
       var edlptheme = new EdlpTheme();
     }else{
       $('body').attr('booted', 'booted');

sites/all/themes/custom/edlptheme/assets/styles/app.scss

@@ -434,7 +434,7 @@ main[role="main"]{
     }
     &.home_mobile h2{
       margin:0;
-      @include content_big_titles;
+      @include content_titles;
     }
     >.content{
     }
@@ -449,7 +449,7 @@ main[role="main"]{
     }
     &.home_mobile .field__label{
       margin: 0;
-      @include content_titles;
+      @include content_subtitles;
     }
     article.node--type-enregistrement{
       h2.node-title{
@@ -457,17 +457,34 @@ main[role="main"]{
         margin:0.9em 0 0 0;
       }
     }
-
   }
 
   div.taxonomy-term.vocabulary-entrees.home_mobile{
     // &:not(:first-of-type){
-      border-bottom: 1px solid red;
+    padding-bottom: 1em;
+    border-bottom: 1px solid red;
     // }
     .field--name-field-notice, .index{
+      >.field__label{
+        cursor: pointer;
+      }
       .field__item, .item-list{
+        height: auto;
+        transition: height 0.3s ease-in-out;
+      }
+      &.closed{
+
+        .field__item, .item-list{
+          overflow: hidden;
+          height:1px;
+          transition: height 0.01s ease-in-out;
+        }
+      }
+    }
+    &.notice-opened, &.index-opened{
+      .field--name-description{
         overflow: hidden;
-        height:1px;
+        height: 1px;
       }
     }
   }
@@ -569,6 +586,14 @@ main[role="main"]{
     background-position: center;
     background-size: contain;
   }
+
+  html.is-mobile & .node--type-enregistrement.node--view-mode-full{
+    h2.node-title{
+      @include content_titles;
+    }
+    .audiofield label{display: none;}
+
+  }
 }