Discource-C
/
discourse
mirror of https://github.com/discourse/discourse.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

FIX: Ensure floating quote button is not positioned under sidebar (#15634) 

If themes/plugins introduce a sidebar on the left of the screen, the quote button would sometimes be positioned underneath. This commit ensures that the positioning logic keeps the floating buttons within the width of `.topic-area`
This commit is contained in:
David Taylor 2022-01-18 12:05:36 +00:00 committed by GitHub
parent b725b7f1fa
commit 7329b766cb
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
1 changed files with 9 additions and 7 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

16
app/assets/javascripts/discourse/app/components/quote-button.js
View File

@ -246,7 +246,12 @@ export default Component.extend(KeyEnterEscape, {
left = boundaryPosition.left; left = boundaryPosition.left;
const safeRadius = 50; const safeRadius = 50;
const viewportEdgeMargin = 10;
const topicArea = document
.querySelector(".topic-area")
.getBoundingClientRect();
topicArea.x += document.documentElement.scrollLeft;
topicArea.y += document.documentElement.scrollTop;
const endHandlePosition = boundaryPosition; const endHandlePosition = boundaryPosition;
const width = this.element.clientWidth; const width = this.element.clientWidth;
@ -270,12 +275,9 @@ export default Component.extend(KeyEnterEscape, {
]; ];
for (const pos of possiblePositions) { for (const pos of possiblePositions) {
// Ensure buttons are entirely within the viewport // Ensure buttons are entirely within the .topic-area
pos.left = Math.max(viewportEdgeMargin, pos.left); pos.left = Math.max(topicArea.left, pos.left);
pos.left = Math.min( pos.left = Math.min(topicArea.right - width, pos.left);
window.innerWidth - viewportEdgeMargin - width,
pos.left
);
let clearOfStartHandle = true; let clearOfStartHandle = true;
if (isAndroid) { if (isAndroid) {