classic template: fix donors carousel

ot_templating/Configuration/TypoScript/constants.txt

@@ -54,7 +54,7 @@ plugin.tx_ottemplating {
             # >> Ces paramètres doivent pouvoir être modifiés via l'onglet Page Configuration du backend
 
             # Tout afficher en statique plutôt que de faire defiler
-            static = 1
+            static = 0
         }
         news {
             limit = 5

ot_templating/Resources/Private/Partials/Classic/Assets.html

@@ -49,7 +49,7 @@ Assets included with the VHS viewhelpers
 
 <v:asset.script name="classic-slick"
                 path="{assets_dir}/script/slick.min.js"
-                dependencies="jquery"
+                dependencies="classic-jquery"
                 defer="1"/>
 
 <v:asset.script name="classic-leaflet"
@@ -58,6 +58,6 @@ Assets included with the VHS viewhelpers
 
 <v:asset.script name="classic-main"
                 path="{assets_dir}/script/main.js"
-                dependencies="jquery,datepicker,slick,leaflet"
+                dependencies="classic-jquery,classic-datepicker,classic-slick,classic-leaflet"
                 standalone="1"
                 defer="1"/>

ot_templating/Resources/Public/assets/Classic/script/main.js

@@ -85,7 +85,7 @@ $(document).ready(function(){
         $(window).scroll(function() {
 
             // Not for little screens
-            if ($('#menu-container .toggle-menu').isVisible()) {
+            if ($('#menu-container .toggle-menu').is(":visible")) {
                 return;
             }
 
@@ -153,7 +153,16 @@ $(document).ready(function(){
         arrows: true,
         dots: true,
         autoplay: true,
-        autoplaySpeed: 2400,
+        autoplaySpeed: 5000,
+        draggable: false,
+        speed: 700
+    });
+
+    $('.ot-donors .carousel').slick({
+        arrows: false,
+        dots: false,
+        autoplay: true,
+        autoplaySpeed: 4800,
         draggable: false,
         speed: 700
     });

ot_templating/Resources/Public/assets/Classic/style/classic-blue.css

@@ -1212,7 +1212,6 @@ header .slick-track {
 }
 
 .ot-donors .donor-card {
-  height: 80px;
   width: 100%;
   /* OLD - iOS 6-, Safari 3.1-6 */
   display: -webkit-box;
@@ -1232,8 +1231,9 @@ header .slick-track {
 
 .ot-donors .donor-card img {
   width: auto;
-  max-height: 100%;
-  max-width: 95%;
+  min-height: 50px;
+  max-height: 130px;
+  max-width: 120px;
   margin: auto;
   /* Style the alt text */
   font-size: 1.1em;

ot_templating/Resources/Public/assets/Classic/style/classic-green.css

@@ -1212,7 +1212,6 @@ header .slick-track {
 }
 
 .ot-donors .donor-card {
-  height: 80px;
   width: 100%;
   /* OLD - iOS 6-, Safari 3.1-6 */
   display: -webkit-box;
@@ -1232,8 +1231,9 @@ header .slick-track {
 
 .ot-donors .donor-card img {
   width: auto;
-  max-height: 100%;
-  max-width: 95%;
+  min-height: 50px;
+  max-height: 130px;
+  max-width: 120px;
   margin: auto;
   /* Style the alt text */
   font-size: 1.1em;

ot_templating/Resources/Public/assets/Classic/style/classic-grey.css

@@ -1212,7 +1212,6 @@ header .slick-track {
 }
 
 .ot-donors .donor-card {
-  height: 80px;
   width: 100%;
   /* OLD - iOS 6-, Safari 3.1-6 */
   display: -webkit-box;
@@ -1232,8 +1231,9 @@ header .slick-track {
 
 .ot-donors .donor-card img {
   width: auto;
-  max-height: 100%;
-  max-width: 95%;
+  min-height: 50px;
+  max-height: 130px;
+  max-width: 120px;
   margin: auto;
   /* Style the alt text */
   font-size: 1.1em;

ot_templating/Resources/Public/assets/Classic/style/classic-light-blue.css

@@ -1212,7 +1212,6 @@ header .slick-track {
 }
 
 .ot-donors .donor-card {
-  height: 80px;
   width: 100%;
   /* OLD - iOS 6-, Safari 3.1-6 */
   display: -webkit-box;
@@ -1232,8 +1231,9 @@ header .slick-track {
 
 .ot-donors .donor-card img {
   width: auto;
-  max-height: 100%;
-  max-width: 95%;
+  min-height: 50px;
+  max-height: 130px;
+  max-width: 120px;
   margin: auto;
   /* Style the alt text */
   font-size: 1.1em;

ot_templating/Resources/Public/assets/Classic/style/classic-light-red.css

@@ -1212,7 +1212,6 @@ header .slick-track {
 }
 
 .ot-donors .donor-card {
-  height: 80px;
   width: 100%;
   /* OLD - iOS 6-, Safari 3.1-6 */
   display: -webkit-box;
@@ -1232,8 +1231,9 @@ header .slick-track {
 
 .ot-donors .donor-card img {
   width: auto;
-  max-height: 100%;
-  max-width: 95%;
+  min-height: 50px;
+  max-height: 130px;
+  max-width: 120px;
   margin: auto;
   /* Style the alt text */
   font-size: 1.1em;

ot_templating/Resources/Public/assets/Classic/style/classic-orange.css

@@ -1212,7 +1212,6 @@ header .slick-track {
 }
 
 .ot-donors .donor-card {
-  height: 80px;
   width: 100%;
   /* OLD - iOS 6-, Safari 3.1-6 */
   display: -webkit-box;
@@ -1232,8 +1231,9 @@ header .slick-track {
 
 .ot-donors .donor-card img {
   width: auto;
-  max-height: 100%;
-  max-width: 95%;
+  min-height: 50px;
+  max-height: 130px;
+  max-width: 120px;
   margin: auto;
   /* Style the alt text */
   font-size: 1.1em;

ot_templating/Resources/Public/assets/Classic/style/classic-purple.css

@@ -1212,7 +1212,6 @@ header .slick-track {
 }
 
 .ot-donors .donor-card {
-  height: 80px;
   width: 100%;
   /* OLD - iOS 6-, Safari 3.1-6 */
   display: -webkit-box;
@@ -1232,8 +1231,9 @@ header .slick-track {
 
 .ot-donors .donor-card img {
   width: auto;
-  max-height: 100%;
-  max-width: 95%;
+  min-height: 50px;
+  max-height: 130px;
+  max-width: 120px;
   margin: auto;
   /* Style the alt text */
   font-size: 1.1em;

ot_templating/Resources/Public/assets/Classic/style/classic-red.css

@@ -1212,7 +1212,6 @@ header .slick-track {
 }
 
 .ot-donors .donor-card {
-  height: 80px;
   width: 100%;
   /* OLD - iOS 6-, Safari 3.1-6 */
   display: -webkit-box;
@@ -1232,8 +1231,9 @@ header .slick-track {
 
 .ot-donors .donor-card img {
   width: auto;
-  max-height: 100%;
-  max-width: 95%;
+  min-height: 50px;
+  max-height: 130px;
+  max-width: 120px;
   margin: auto;
   /* Style the alt text */
   font-size: 1.1em;

ot_templating/Resources/Public/assets/Classic/style/module/_donors-box.scss

@@ -6,7 +6,7 @@
 }
 
 .ot-donors .donor-card {
-  height: 80px;
+  //height: 80px;
   width: 100%;
   @include flex;
   flex-direction: row;
@@ -17,8 +17,10 @@
 
 .ot-donors .donor-card img {
   width: auto;
-  max-height: 100%;
-  max-width: 95%;
+  min-height: 50px;
+  max-height: 130px;
+  max-width: 120px;
+
   margin: auto;
 
   /* Style the alt text */