From 13f167eb000c1941b006ca5b1798b05331a5a391 Mon Sep 17 00:00:00 2001
From: Vincent Vanwaelscappel <vincent@cubedesigners.com>
Date: Fri, 15 Nov 2019 18:00:00 +0100
Subject: [PATCH] fix #3184 @1

---
 .../fluidbook/links/fluidbook.links.zoom.js   | 54 +++++++++++--------
 style/fluidbook.less                          |  4 ++
 2 files changed, 35 insertions(+), 23 deletions(-)

diff --git a/js/libs/fluidbook/links/fluidbook.links.zoom.js b/js/libs/fluidbook/links/fluidbook.links.zoom.js
index e2ad70a0..5b6a815e 100644
--- a/js/libs/fluidbook/links/fluidbook.links.zoom.js
+++ b/js/libs/fluidbook/links/fluidbook.links.zoom.js
@@ -285,7 +285,9 @@ FluidbookLinksZoom.prototype = {
     },
 
     resizeZoomLinkBackground: function (show) {
-        var top, left, bottom, right, width, height, padding;
+        var top, left, bottom, right, width, height, hpadding, vpadding;
+
+        var menuWidth = $("#zoomPopupMenu").outerWidth();
 
         var wrappers = $('.zoomPopupWrapper');
         if ($('html').hasClass('menu-burger')) {
@@ -293,29 +295,35 @@ FluidbookLinksZoom.prototype = {
             left = 0;
             width = this.fluidbook.resize.ww;
             height = this.fluidbook.resize.hh;
-        } else if (wrappers.length === 1) {
-            var box = $(wrappers).get(0).getBoundingClientRect();
-            top = box.top;
-            left = box.left;
-            width = box.width;
-            height = box.height;
         } else {
-            top = Number.MAX_VALUE;
-            left = Number.MAX_VALUE;
-            bottom = Number.MIN_VALUE;
-            right = Number.MIN_VALUE;
-            wrappers.each(function () {
-                var box = $(this).get(0).getBoundingClientRect();
-                top = Math.min(top, box.top);
-                left = Math.min(left, box.left);
-                right = Math.max(right, box.right);
-                bottom = Math.max(bottom, box.bottom);
-            });
-            padding = 20;
-            width = right - left + 2 * padding;
-            height = bottom - top + 2 * padding;
-            top -= padding;
-            left -= padding;
+            var box = $(wrappers).get(0).getBoundingClientRect();
+            if (wrappers.length === 1 && menuWidth < box.width) {
+                top = box.top;
+                left = box.left;
+                width = box.width;
+                height = box.height;
+            } else {
+                top = Number.MAX_VALUE;
+                left = Number.MAX_VALUE;
+                bottom = Number.MIN_VALUE;
+                right = Number.MIN_VALUE;
+                wrappers.each(function () {
+                    var box = $(this).get(0).getBoundingClientRect();
+                    top = Math.min(top, box.top);
+                    left = Math.min(left, box.left);
+                    right = Math.max(right, box.right);
+                    bottom = Math.max(bottom, box.bottom);
+                });
+                vpadding = hpadding = 20;
+                width = right - left + 2 * hpadding;
+                if (width < menuWidth) {
+                    hpadding = (menuWidth - (right - left)) / 2;
+                    width = right - left + 2 * hpadding;
+                }
+                height = bottom - top + 2 * vpadding;
+                top -= vpadding;
+                left -= hpadding;
+            }
         }
 
         $("#zoomPopupBackground").css({left: left, top: top, width: width, height: height, opacity: show ? 1 : 0});
diff --git a/style/fluidbook.less b/style/fluidbook.less
index 29dbadde..309c2efa 100644
--- a/style/fluidbook.less
+++ b/style/fluidbook.less
@@ -2772,6 +2772,10 @@ ul.chapters {
       width: auto;
       white-space: nowrap;
 
+      &:first-child{
+        margin-left: 0;
+      }
+
       .menu-burger & {
         padding: 10px 20px 10px 10px;
         height: 60px;
-- 
2.39.5