FIX: iPad DiscourseHub app layout issues (#11048)

- fixes height of user dropdown menu
- fixes offset when jumping to a post
- removes landscape-specific CSS padding (following a fix in the app repo)
This commit is contained in:
Penar Musaraj 2020-10-27 15:12:24 -04:00 committed by GitHub
parent 586dd064c6
commit 12724ac6e4
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 15 additions and 18 deletions

View File

@ -347,11 +347,19 @@ const SiteHeaderComponent = MountWidget.extend(Docking, PanEvents, {
height = winHeight - menuTop;
}
const isIPadApp = document.body.classList.contains("footer-nav-ipad"),
heightProp = isIPadApp ? "max-height" : "height",
iPadOffset = 10;
if (isIPadApp) {
height = winHeight - menuTop - iPadOffset;
}
if ($panelBody.prop("style").height !== "100%") {
$panelBody.height("100%");
}
if (style.top !== menuTop + "px" || style.height !== height) {
$panel.css({ top: menuTop + "px", height });
if (style.top !== menuTop + "px" || style[heightProp] !== height) {
$panel.css({ top: menuTop + "px", [heightProp]: height });
$(".header-cloak").css({ top: menuTop + "px" });
}
$("body").removeClass("drop-down-mode");

View File

@ -3,8 +3,11 @@ export function scrollTopFor(y) {
}
export function minimumOffset() {
const header = document.querySelector("header.d-header");
return header ? header.offsetHeight : 0;
const header = document.querySelector("header.d-header"),
iPadNav = document.querySelector(".footer-nav-ipad .footer-nav"),
iPadNavHeight = iPadNav ? iPadNav.offsetHeight : 0;
return header ? header.offsetHeight + iPadNavHeight : 0;
}
export default function offsetCalculator() {

View File

@ -86,18 +86,4 @@ body.footer-nav-ipad {
&.docked .d-header-wrap {
top: $footer-nav-height;
}
@media only screen and (orientation: landscape) {
$status-bar-padding: 12px;
padding-top: $footer-nav-height + $status-bar-padding;
.footer-nav {
padding-top: $status-bar-padding;
}
&.docked .d-header-wrap {
top: $footer-nav-height + $status-bar-padding;
}
}
}