mirror of
https://github.com/discourse/discourse.git
synced 2024-11-26 02:40:53 -06:00
UX: Prevent topic progress bar from overlapping (#12780)
This commit is contained in:
parent
95223938a5
commit
e0d17c8d19
@ -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;
|
||||
|
@ -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 {
|
||||
|
@ -85,7 +85,6 @@
|
||||
|
||||
#topic-progress-wrapper {
|
||||
position: fixed;
|
||||
right: 2em;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
margin: 0 auto;
|
||||
|
@ -14,10 +14,6 @@
|
||||
padding: 15px 0 8px 0;
|
||||
}
|
||||
|
||||
.post-stream {
|
||||
padding-bottom: 3em;
|
||||
}
|
||||
|
||||
span.badge-posts {
|
||||
margin-right: 5px;
|
||||
}
|
||||
|
@ -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) {
|
||||
|
Loading…
Reference in New Issue
Block a user