github-mirror/discourse
2
0
Fork 0
mirror of https://github.com/discourse/discourse.git synced 2024-11-28 02:53:45 +08:00
Code Issues Actions 1 Packages Projects Releases Wiki Activity

DEV: Account for below-site-header and above-site-header outlets when positioning timeline and usercards (#10434)

Browse Source
This commit is contained in:
Kris 2020-11-12 05:45:09 -05:00 committed by GitHub
parent ec49394bd1
commit a90c18e033
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 30 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
app/assets/javascripts/discourse/app/components/topic-timeline.js
View File

@ -3,6 +3,7 @@ import MountWidget from "discourse/components/mount-widget";
import Docking from "discourse/mixins/docking";
import { observes } from "discourse-common/utils/decorators";
import optionalService from "discourse/lib/optional-service";
import outletHeights from "discourse/lib/header-outlet-height";
const headerPadding = () => {
let topPadding = parseInt($("#main-outlet").css("padding-top"), 10) + 3;
@ -67,13 +68,16 @@ export default MountWidget.extend(Docking, {
const prev = this.dockAt;
const posTop = headerPadding() + info.offset();
const pos = posTop + timelineHeight;
const pos = posTop + timelineHeight - outletHeights();
this.dockBottom = false;
if (posTop < topicTop) {
this.dockAt = parseInt(topicTop, 10);
} else if (pos > topicBottom + footerHeight) {
this.dockAt = parseInt(topicBottom - timelineHeight + footerHeight, 10);
this.dockAt = parseInt(
topicBottom - timelineHeight + footerHeight + outletHeights(),
10
);
this.dockBottom = true;
if (this.dockAt < 0) {
this.dockAt = 0;

22
app/assets/javascripts/discourse/app/lib/header-outlet-height.js Normal file
View File

@ -0,0 +1,22 @@
export default function() {
const outletSelector = [
".above-site-header-outlet",
".below-site-header-outlet"
];
// If these outlets have height they impact timeline and usercard positioning
let outletHeights = 0;
outletSelector.forEach(function(outletClass) {
if (document.querySelector(outletClass)) {
let outlets = document.querySelectorAll(outletClass);
outlets.forEach(outlet => {
if (outlet.offsetHeight) {
outletHeights += parseInt(outlet.offsetHeight, 10);
}
});
}
});
return outletHeights;
}

3
app/assets/javascripts/discourse/app/mixins/card-contents-base.js
View File

@ -5,6 +5,7 @@ import afterTransition from "discourse/lib/after-transition";
import DiscourseURL from "discourse/lib/url";
import Mixin from "@ember/object/mixin";
import { escapeExpression } from "discourse/lib/utilities";
import outletHeights from "discourse/lib/header-outlet-height";
import { inject as service } from "@ember/service";
export default Mixin.create({
@ -211,7 +212,7 @@ export default Mixin.create({
}
}
position.top -= $("#main-outlet").offset().top;
position.top -= $("#main-outlet").offset().top - outletHeights();
if (isFixed) {
position.top -= $("html").scrollTop();
//if content is fixed and will be cut off on the bottom, display it above...