UX: Prevent topic progress bar from overlapping (#12780)

This commit is contained in:
Kris 2021-04-21 22:53:23 -04:00 committed by GitHub
parent 95223938a5
commit e0d17c8d19
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
5 changed files with 10 additions and 10 deletions

View File

@ -151,10 +151,7 @@ export default Component.extend({
const $html = $("html");
const offset = window.pageYOffset || $html.scrollTop();
const progressHeight = this.site.mobileView
? 0
: $("#topic-progress").outerHeight();
const maximumOffset = $("#topic-bottom").offset().top + progressHeight;
const maximumOffset = $("#topic-bottom").offset().top;
const windowHeight = $(window).height();
let composerHeight = $("#reply-control").height() || 0;
const isDocked = offset >= maximumOffset - windowHeight + composerHeight;

View File

@ -62,6 +62,13 @@
}
}
@media screen and (max-width: 924px) {
.post-stream {
// make space for the topic progress bar to dock
padding-bottom: 2em;
}
}
.progress-back-container {
z-index: z("dropdown");
margin-right: 0;
@ -80,6 +87,7 @@
#topic-progress-wrapper {
display: flex;
right: 9px; // 8px padding on #main-outlet + 1px right border
.topic-admin-menu-button-container {
display: flex;
> span {

View File

@ -85,7 +85,6 @@
#topic-progress-wrapper {
position: fixed;
right: 2em;
bottom: 0;
left: 0;
margin: 0 auto;

View File

@ -14,10 +14,6 @@
padding: 15px 0 8px 0;
}
.post-stream {
padding-bottom: 3em;
}
span.badge-posts {
margin-right: 5px;
}

View File

@ -43,7 +43,7 @@
#topic-progress-wrapper {
position: fixed;
right: 1em;
right: 10px; // match 10px padding on .wrap
bottom: 0;
z-index: z("timeline");
&:not(.docked) {