From 337c2e77ee81618eb878f1ecfd570a8523d0f25c Mon Sep 17 00:00:00 2001 From: cwm Date: Tue, 26 Dec 2017 13:49:53 -0600 Subject: Fix layout for RTL (tootsuite pr #6014, #6018) --- .../flavours/glitch/features/ui/components/columns_area.js | 8 ++++++-- 1 file changed, 6 insertions(+), 2 deletions(-) (limited to 'app/javascript/flavours/glitch/features/ui') diff --git a/app/javascript/flavours/glitch/features/ui/components/columns_area.js b/app/javascript/flavours/glitch/features/ui/components/columns_area.js index 4167ff693..91d4df93f 100644 --- a/app/javascript/flavours/glitch/features/ui/components/columns_area.js +++ b/app/javascript/flavours/glitch/features/ui/components/columns_area.js @@ -54,7 +54,10 @@ export default class ColumnsArea extends ImmutablePureComponent { if (!this.props.singleColumn) { this.node.addEventListener('wheel', this.handleWheel, detectPassiveEvents.hasSupport ? { passive: true } : false); } - this.lastIndex = getIndex(this.context.router.history.location.pathname); + + this.lastIndex = getIndex(this.context.router.history.location.pathname); + this.isRtlLayout = document.getElementsByTagName('body')[0].classList.contains('rtl'); + this.setState({ shouldAnimate: true }); } @@ -80,7 +83,8 @@ export default class ColumnsArea extends ImmutablePureComponent { handleChildrenContentChange() { if (!this.props.singleColumn) { - this._interruptScrollAnimation = scrollRight(this.node, this.node.scrollWidth - window.innerWidth); + const modifier = this.isRtlLayout ? -1 : 1; + this._interruptScrollAnimation = scrollRight(this.node, (this.node.scrollWidth - window.innerWidth) * modifier); } } -- cgit