From e11c5f3b1ca4b460bc2ffbb0d04b16b7312d241d Mon Sep 17 00:00:00 2001
From: Vincent Vanwaelscappel <vincent@cubedesigners.com>
Date: Wed, 19 Aug 2020 18:34:34 +0200
Subject: [PATCH] fix #3842 @2

---
 js/libs/fluidbook/fluidbook.articles.js |  8 +++--
 js/libs/fluidbook/fluidbook.stats.js    |  6 +++-
 style/articles.less                     | 41 +++++++++++++++++++++++++
 style/articles/atlantic.less            |  2 ++
 style/articles/harmonie-mutuelle.less   | 35 ++++++++++++++++++---
 style/variables.less                    |  1 +
 6 files changed, 85 insertions(+), 8 deletions(-)

diff --git a/js/libs/fluidbook/fluidbook.articles.js b/js/libs/fluidbook/fluidbook.articles.js
index d907675e..1398fe89 100644
--- a/js/libs/fluidbook/fluidbook.articles.js
+++ b/js/libs/fluidbook/fluidbook.articles.js
@@ -75,13 +75,17 @@ FluidbookArticles.prototype = {
     },
 
     resize: function () {
+        var $this=this;
         $(".mview article").each(function () {
             var w = $(this).width();
             var aw = $(this).find('.actions').outerWidth();
+            if ($this.fluidbook.resize.ww < 800) {
+                aw += 20;
+            }
             $(this).find('h3').eq(0).css('width', w - aw);
-            var $this = this;
+            var $thisart = this;
             setTimeout(function () {
-                $($this).closest('.mview').addClass('visible');
+                $($thisart).closest('.mview').addClass('visible');
             }, 10);
         });
     },
diff --git a/js/libs/fluidbook/fluidbook.stats.js b/js/libs/fluidbook/fluidbook.stats.js
index 934a7421..370b3923 100644
--- a/js/libs/fluidbook/fluidbook.stats.js
+++ b/js/libs/fluidbook/fluidbook.stats.js
@@ -57,7 +57,11 @@ FluidbookStats.prototype = {
             if ($this.fluidbook.settings.tagcommander_plan[hash]) {
                 window.tc_vars = {};
                 $.extend(window.tc_vars, $this.fluidbook.settings.tagcommander_default_vars, $this.fluidbook.settings.tagcommander_plan[hash]);
-                tC.container.reload({events: {page: [{}, {}]}});
+                try {
+                    tC.container.reload({events: {page: [{}, {}]}});
+                } catch (e) {
+
+                }
             }
         });
     },
diff --git a/style/articles.less b/style/articles.less
index fc751cf0..ba308846 100644
--- a/style/articles.less
+++ b/style/articles.less
@@ -1,4 +1,7 @@
 @import "book-variables";
+@import "variables";
+
+@articles-mobile-ratio: 0.75;
 
 * {
   box-sizing: border-box;
@@ -25,12 +28,21 @@ article {
   font-weight: 300;
   text-align: left;
 
+  @media @medium {
+    padding: 20px;
+    font-size: unit(20*@articles-mobile-ratio, px);
+  }
+
   .actions {
     position: absolute;
     top: 55px;
     right: 45px;
     color: @articles-title-color;
 
+    @media @medium {
+      top: 23px;
+    }
+
     a {
       width: 20px;
       height: 20px;
@@ -51,6 +63,10 @@ article {
     padding: 5px 10px;
     font-weight: 300;
     text-transform: uppercase;
+
+    @media @medium {
+      font-size: unit(14*@articles-mobile-ratio, px);
+    }
   }
 
   h2 {
@@ -60,10 +76,19 @@ article {
     margin: 20px 0;
     font-weight: 300;
 
+    @media @medium {
+      font-size: unit(16*@articles-mobile-ratio, px);
+    }
+
     &.inter {
       font-size: 18px;
       text-transform: none;
       font-weight: 600;
+
+      @media @medium {
+        font-size: unit(18*@articles-mobile-ratio, px);
+      }
+
     }
   }
 
@@ -73,6 +98,10 @@ article {
     font-size: 50px;
     line-height: 40px;
     font-weight: 600;
+
+    @media @medium {
+      font-size: unit(50*@articles-mobile-ratio, px);
+    }
   }
 
   figure {
@@ -88,6 +117,10 @@ article {
       color: #fff;
       font-size: 16px;
       padding: 15px;
+
+      @media @medium {
+        font-size: unit(16*@articles-mobile-ratio, px);
+      }
     }
   }
 
@@ -104,6 +137,10 @@ article {
   .note {
     margin: -10px 0 20px;
     font-size: 12px;
+
+    @media @medium {
+      font-size: unit(12*@articles-mobile-ratio, px);
+    }
   }
 
   blockquote {
@@ -114,6 +151,10 @@ article {
   .author {
     font-size: 16px;
     margin: 20px 0;
+
+    @media @medium {
+      font-size: unit(16*@articles-mobile-ratio, px);
+    }
   }
 }
 
diff --git a/style/articles/atlantic.less b/style/articles/atlantic.less
index e69de29b..d63826be 100644
--- a/style/articles/atlantic.less
+++ b/style/articles/atlantic.less
@@ -0,0 +1,2 @@
+@import "variables";
+@import "book-variables";
\ No newline at end of file
diff --git a/style/articles/harmonie-mutuelle.less b/style/articles/harmonie-mutuelle.less
index fc5419e4..0a07a961 100644
--- a/style/articles/harmonie-mutuelle.less
+++ b/style/articles/harmonie-mutuelle.less
@@ -1,4 +1,5 @@
 @import "book-variables";
+@import "variables";
 
 * {
   box-sizing: border-box;
@@ -6,30 +7,51 @@
   padding: 0;
 }
 
+@articles-mobile-ratio: 0.75;
+
 article {
   @color: #333;
-  color:@color;
+  color: @color;
   font-size: 18px;
 
-  h1{
+  @media @medium {
+    font-size: unit(22*@articles-mobile-ratio, px);
+  }
+
+  h1 {
     text-transform: uppercase;
     font-size: 36px;
+
+    @media @medium {
+      font-size: unit(36*@articles-mobile-ratio, px);
+    }
   }
 
   div.chapo {
     color: @color !important;
     font-size: 30px;
+    @media @medium {
+      font-size: unit(30*@articles-mobile-ratio, px);
+    }
   }
 
-  h2.inter{
+  h2.inter {
     font-size: 24px;
     font-weight: 600;
+
+    @media @medium {
+      font-size: unit(24*@articles-mobile-ratio, px);
+    }
   }
 
-  blockquote{
+  blockquote {
     font-style: italic;
     font-size: 24px;
 
+    @media @medium {
+      font-size: unit(24*@articles-mobile-ratio, px);
+    }
+
   }
 
   figcaption {
@@ -37,8 +59,11 @@ article {
     color: @color;
   }
 
-  div.author{
+  div.author {
     font-style: italic;
     font-size: 16px;
+    @media @medium {
+      font-size: unit(18*@articles-mobile-ratio, px);
+    }
   }
 }
\ No newline at end of file
diff --git a/style/variables.less b/style/variables.less
index 3ecc0ba8..30728781 100644
--- a/style/variables.less
+++ b/style/variables.less
@@ -2,4 +2,5 @@
 
 @font: 'Open Sans', Arial, Helvetica, sans-serif;
 @small: ~"screen and (max-width: 640px)";
+@medium: ~"screen and (max-width: 800px)";
 @large: ~"screen and (min-width: 1280px)";
\ No newline at end of file
-- 
2.39.5