From 89d8af74f5bdd63810030b29fe9eb2af41094053 Mon Sep 17 00:00:00 2001 From: Stephen Cameron Date: Wed, 6 Sep 2017 11:31:00 +0200 Subject: [PATCH] Fix #1632 @0.5 --- js/libs/fluidbook/fluidbook.resize.js | 8 ++++---- style/fluidbook.less | 2 ++ 2 files changed, 6 insertions(+), 4 deletions(-) diff --git a/js/libs/fluidbook/fluidbook.resize.js b/js/libs/fluidbook/fluidbook.resize.js index 2f5a1153..28efa5ad 100644 --- a/js/libs/fluidbook/fluidbook.resize.js +++ b/js/libs/fluidbook/fluidbook.resize.js @@ -24,6 +24,10 @@ function FluidbookResize(fluidbook) { FluidbookResize.prototype = { init: function () { + // Manage transform origins based on text direction + // This is important for the elements to have the correct position after scaling + // Note: the #logo is handled in the CSS because it is also affected by the .menu-inverted class + var left = this.fluidbook.l10n.dir == 'ltr' ? '0%' : '100%'; var right = this.fluidbook.l10n.dir == 'ltr' ? '100%' : '0%'; @@ -31,10 +35,6 @@ FluidbookResize.prototype = { origin: [left, '0%'] }); - $("#logo").transform({ - origin: [right, '0%'] - }); - $("#footer").transform({ origin: [right, '100%'] }); diff --git a/style/fluidbook.less b/style/fluidbook.less index 2a89fb59..d140382e 100644 --- a/style/fluidbook.less +++ b/style/fluidbook.less @@ -734,12 +734,14 @@ header { .ltr &, .rtl.menu-inverted & { right: 0; left: auto; + transform-origin: 100% 0; // Top right transform origin so positioning is correct after scaling } // Positioning for right-to-left Fluidbooks + inverted menu on LTR .rtl &, .ltr.menu-inverted & { left: 0; right: auto; + transform-origin: 0 0; // Top left transform origin so positioning is correct after scaling } } -- 2.39.5