From d45866eb5c2cc8b4fadc03a0fe863701975822a6 Mon Sep 17 00:00:00 2001 From: Penar Musaraj Date: Sun, 6 Oct 2019 16:10:08 -0400 Subject: [PATCH] UX: Fix topic progress placement in iOS app Fixes placement issues introduced in #45a55a3 Fixes topic progress placement when composer is collapsed with a draft --- .../discourse/components/topic-progress.js.es6 | 16 ++++++++++++---- 1 file changed, 12 insertions(+), 4 deletions(-) diff --git a/app/assets/javascripts/discourse/components/topic-progress.js.es6 b/app/assets/javascripts/discourse/components/topic-progress.js.es6 index cb5d89aaf24..e37d5821c23 100644 --- a/app/assets/javascripts/discourse/components/topic-progress.js.es6 +++ b/app/assets/javascripts/discourse/components/topic-progress.js.es6 @@ -161,7 +161,7 @@ export default Ember.Component.extend({ : $("#topic-progress").outerHeight(); const maximumOffset = $("#topic-bottom").offset().top + progressHeight; const windowHeight = $(window).height(); - const composerHeight = $("#reply-control").height() || 0; + let composerHeight = $("#reply-control").height() || 0; const isDocked = offset >= maximumOffset - windowHeight + composerHeight; let bottom = $("body").height() - maximumOffset; @@ -170,8 +170,15 @@ export default Ember.Component.extend({ bottom += $iPadFooterNav.outerHeight(); } const wrapperDir = $html.hasClass("rtl") ? "left" : "right"; + const draftComposerHeight = 40; if (composerHeight > 0) { + const $iPhoneFooterNav = $(".footer-nav-visible .footer-nav"); + const $replyDraft = $("#reply-control.draft"); + if ($iPhoneFooterNav.outerHeight() && $replyDraft.outerHeight()) { + composerHeight = + $replyDraft.outerHeight() + $iPhoneFooterNav.outerHeight(); + } $wrapper.css("bottom", isDocked ? bottom : composerHeight); } else { $wrapper.css("bottom", isDocked ? bottom : ""); @@ -186,9 +193,10 @@ export default Ember.Component.extend({ $wrapper.css(wrapperDir, "1em"); } - if (!isDocked) { - $wrapper.css("margin-bottom", "0px"); - } + $wrapper.css( + "margin-bottom", + !isDocked && composerHeight > draftComposerHeight ? "0px" : "" + ); }, click(e) {