fix calculation

This commit is contained in:
plebeius.eth
2023-06-10 13:07:16 +02:00
parent 023d84c350
commit aa45e4c963
4 changed files with 74 additions and 70 deletions
+35 -34
View File
@@ -544,20 +544,20 @@ const All = () => {
const rect = backlinkRefs.current[reply.cid].getBoundingClientRect(); const rect = backlinkRefs.current[reply.cid].getBoundingClientRect();
const distanceToRight = window.innerWidth - rect.right; const distanceToRight = window.innerWidth - rect.right;
if (distanceToRight < 200) { if (distanceToRight < 200) {
setOutOfViewPosition({ setOutOfViewPosition({
top: rect.top + window.scrollY - rect.height / 2, top: rect.top + window.scrollY - rect.height / 2,
left: rect.left - rect.innerWidth - 5, right: window.innerWidth - rect.left - 10,
maxWidth: rect.left maxWidth: rect.left - 5
}); });
} else { } else {
setOutOfViewPosition({ setOutOfViewPosition({
top: rect.top + window.scrollY - rect.height / 2, top: rect.top + window.scrollY - rect.height / 2,
left: rect.left + rect.width - 5, left: rect.left + rect.width + 5,
maxWidth: window.innerWidth - rect.left - rect.width maxWidth: window.innerWidth - rect.left - rect.width + 5
}); });
} }
}); });
}} }}
onMouseLeave={() => { onMouseLeave={() => {
@@ -764,15 +764,15 @@ const All = () => {
if (distanceToRight < 200) { if (distanceToRight < 200) {
setOutOfViewPosition({ setOutOfViewPosition({
top: rect.top + window.scrollY - rect.height / 2, top: rect.top + window.scrollY - rect.height / 2,
left: rect.left - rect.innerWidth - 5, right: window.innerWidth - rect.left - 10,
maxWidth: rect.left maxWidth: rect.left - 5
}); });
} else { } else {
setOutOfViewPosition({ setOutOfViewPosition({
top: rect.top + window.scrollY - rect.height / 2, top: rect.top + window.scrollY - rect.height / 2,
left: rect.left + rect.width - 5, left: rect.left + rect.width + 5,
maxWidth: window.innerWidth - rect.left - rect.width maxWidth: window.innerWidth - rect.left - rect.width + 5
}); });
} }
}); });
@@ -862,20 +862,20 @@ const All = () => {
const rect = quoteRefs.current[shortParentCid].getBoundingClientRect(); const rect = quoteRefs.current[shortParentCid].getBoundingClientRect();
const distanceToRight = window.innerWidth - rect.right; const distanceToRight = window.innerWidth - rect.right;
if (distanceToRight < 200) { if (distanceToRight < 200) {
setOutOfViewPosition({ setOutOfViewPosition({
top: rect.top + window.scrollY - rect.height / 2, top: rect.top + window.scrollY - rect.height / 2,
left: rect.left - rect.innerWidth - 5, right: window.innerWidth - rect.left - 10,
maxWidth: rect.left maxWidth: rect.left - 5
}); });
} else { } else {
setOutOfViewPosition({ setOutOfViewPosition({
top: rect.top + window.scrollY - rect.height / 2, top: rect.top + window.scrollY - rect.height / 2,
left: rect.left + rect.width - 5, left: rect.left + rect.width + 5,
maxWidth: window.innerWidth - rect.left - rect.width maxWidth: window.innerWidth - rect.left - rect.width + 5
}); });
} }
} }
}); });
}} }}
@@ -912,15 +912,15 @@ const All = () => {
if (distanceToRight < 200) { if (distanceToRight < 200) {
setOutOfViewPosition({ setOutOfViewPosition({
top: rect.top + window.scrollY - rect.height / 2, top: rect.top + window.scrollY - rect.height / 2,
left: rect.left - rect.innerWidth - 5, right: window.innerWidth - rect.left - 10,
maxWidth: rect.left maxWidth: rect.left - 5
}); });
} else { } else {
setOutOfViewPosition({ setOutOfViewPosition({
top: rect.top + window.scrollY - rect.height / 2, top: rect.top + window.scrollY - rect.height / 2,
left: rect.left + rect.width - 5, left: rect.left + rect.width + 5,
maxWidth: window.innerWidth - rect.left - rect.width maxWidth: window.innerWidth - rect.left - rect.width + 5
}); });
} }
} }
@@ -1303,6 +1303,7 @@ const All = () => {
position: "absolute", position: "absolute",
top: outOfViewPosition.top - postOnHoverHeight / 2 + 10, top: outOfViewPosition.top - postOnHoverHeight / 2 + 10,
left: outOfViewPosition.left, left: outOfViewPosition.left,
right: outOfViewPosition.right,
maxWidth: outOfViewPosition.maxWidth, maxWidth: outOfViewPosition.maxWidth,
}} }}
> >
+26 -25
View File
@@ -997,15 +997,15 @@ const Board = () => {
if (distanceToRight < 200) { if (distanceToRight < 200) {
setOutOfViewPosition({ setOutOfViewPosition({
top: rect.top + window.scrollY - rect.height / 2, top: rect.top + window.scrollY - rect.height / 2,
left: rect.left - rect.innerWidth - 5, right: window.innerWidth - rect.left - 10,
maxWidth: rect.left maxWidth: rect.left - 5
}); });
} else { } else {
setOutOfViewPosition({ setOutOfViewPosition({
top: rect.top + window.scrollY - rect.height / 2, top: rect.top + window.scrollY - rect.height / 2,
left: rect.left + rect.width - 5, left: rect.left + rect.width + 5,
maxWidth: window.innerWidth - rect.left - rect.width maxWidth: window.innerWidth - rect.left - rect.width + 5
}); });
} }
setOutOfViewCid(reply.cid); setOutOfViewCid(reply.cid);
@@ -1247,15 +1247,15 @@ const Board = () => {
if (distanceToRight < 200) { if (distanceToRight < 200) {
setOutOfViewPosition({ setOutOfViewPosition({
top: rect.top + window.scrollY - rect.height / 2, top: rect.top + window.scrollY - rect.height / 2,
left: rect.left - rect.innerWidth - 5, right: window.innerWidth - rect.left - 10,
maxWidth: rect.left maxWidth: rect.left - 5
}); });
} else { } else {
setOutOfViewPosition({ setOutOfViewPosition({
top: rect.top + window.scrollY - rect.height / 2, top: rect.top + window.scrollY - rect.height / 2,
left: rect.left + rect.width - 5, left: rect.left + rect.width + 5,
maxWidth: window.innerWidth - rect.left - rect.width maxWidth: window.innerWidth - rect.left - rect.width + 5
}); });
} }
}); });
@@ -1344,20 +1344,20 @@ const Board = () => {
const rect = quoteRefs.current[shortParentCid].getBoundingClientRect(); const rect = quoteRefs.current[shortParentCid].getBoundingClientRect();
const distanceToRight = window.innerWidth - rect.right; const distanceToRight = window.innerWidth - rect.right;
if (distanceToRight < 200) { if (distanceToRight < 200) {
setOutOfViewPosition({ setOutOfViewPosition({
top: rect.top + window.scrollY - rect.height / 2, top: rect.top + window.scrollY - rect.height / 2,
left: rect.left - rect.innerWidth - 5, right: window.innerWidth - rect.left - 10,
maxWidth: rect.left maxWidth: rect.left - 5
}); });
} else { } else {
setOutOfViewPosition({ setOutOfViewPosition({
top: rect.top + window.scrollY - rect.height / 2, top: rect.top + window.scrollY - rect.height / 2,
left: rect.left + rect.width - 5, left: rect.left + rect.width + 5,
maxWidth: window.innerWidth - rect.left - rect.width maxWidth: window.innerWidth - rect.left - rect.width + 5
}); });
} }
} }
}); });
}} }}
@@ -1401,15 +1401,15 @@ const Board = () => {
if (distanceToRight < 200) { if (distanceToRight < 200) {
setOutOfViewPosition({ setOutOfViewPosition({
top: rect.top + window.scrollY - rect.height / 2, top: rect.top + window.scrollY - rect.height / 2,
left: rect.left - rect.innerWidth - 5, right: window.innerWidth - rect.left - 10,
maxWidth: rect.left maxWidth: rect.left - 5
}); });
} else { } else {
setOutOfViewPosition({ setOutOfViewPosition({
top: rect.top + window.scrollY - rect.height / 2, top: rect.top + window.scrollY - rect.height / 2,
left: rect.left + rect.width - 5, left: rect.left + rect.width + 5,
maxWidth: window.innerWidth - rect.left - rect.width maxWidth: window.innerWidth - rect.left - rect.width + 5
}); });
} }
} }
@@ -1800,6 +1800,7 @@ const Board = () => {
position: "absolute", position: "absolute",
top: outOfViewPosition.top - postOnHoverHeight / 2 + 10, top: outOfViewPosition.top - postOnHoverHeight / 2 + 10,
left: outOfViewPosition.left, left: outOfViewPosition.left,
right: outOfViewPosition.right,
maxWidth: outOfViewPosition.maxWidth, maxWidth: outOfViewPosition.maxWidth,
}} }}
> >
+1
View File
@@ -1308,6 +1308,7 @@ const Subscriptions = () => {
position: "absolute", position: "absolute",
top: outOfViewPosition.top - postOnHoverHeight / 2 + 10, top: outOfViewPosition.top - postOnHoverHeight / 2 + 10,
left: outOfViewPosition.left, left: outOfViewPosition.left,
right: outOfViewPosition.right,
maxWidth: outOfViewPosition.maxWidth, maxWidth: outOfViewPosition.maxWidth,
}} }}
> >
+10 -9
View File
@@ -953,15 +953,15 @@ const Thread = () => {
if (distanceToRight < 200) { if (distanceToRight < 200) {
setOutOfViewPosition({ setOutOfViewPosition({
top: rect.top + window.scrollY - rect.height / 2, top: rect.top + window.scrollY - rect.height / 2,
left: rect.left - rect.innerWidth - 5, right: window.innerWidth - rect.left - 10,
maxWidth: rect.left maxWidth: rect.left - 5
}); });
} else { } else {
setOutOfViewPosition({ setOutOfViewPosition({
top: rect.top + window.scrollY - rect.height / 2, top: rect.top + window.scrollY - rect.height / 2,
left: rect.left + rect.width + 5, left: rect.left + rect.width + 5,
maxWidth: window.innerWidth - rect.left - rect.width maxWidth: window.innerWidth - rect.left - rect.width + 5
}); });
} }
}); });
@@ -1165,15 +1165,15 @@ const Thread = () => {
if (distanceToRight < 200) { if (distanceToRight < 200) {
setOutOfViewPosition({ setOutOfViewPosition({
top: rect.top + window.scrollY - rect.height / 2, top: rect.top + window.scrollY - rect.height / 2,
left: rect.left - rect.innerWidth - 5, right: window.innerWidth - rect.left - 10,
maxWidth: rect.left maxWidth: rect.left - 5
}); });
} else { } else {
setOutOfViewPosition({ setOutOfViewPosition({
top: rect.top + window.scrollY - rect.height / 2, top: rect.top + window.scrollY - rect.height / 2,
left: rect.left + rect.width + 5, left: rect.left + rect.width + 5,
maxWidth: window.innerWidth - rect.left - rect.width maxWidth: window.innerWidth - rect.left - rect.width + 5
}); });
} }
}); });
@@ -1259,15 +1259,15 @@ const Thread = () => {
if (distanceToRight < 200) { if (distanceToRight < 200) {
setOutOfViewPosition({ setOutOfViewPosition({
top: rect.top + window.scrollY - rect.height / 2, top: rect.top + window.scrollY - rect.height / 2,
left: rect.left - rect.innerWidth - 5, right: window.innerWidth - rect.left - 10,
maxWidth: rect.left maxWidth: rect.left - 5
}); });
} else { } else {
setOutOfViewPosition({ setOutOfViewPosition({
top: rect.top + window.scrollY - rect.height / 2, top: rect.top + window.scrollY - rect.height / 2,
left: rect.left + rect.width + 5, left: rect.left + rect.width + 5,
maxWidth: window.innerWidth - rect.left - rect.width maxWidth: window.innerWidth - rect.left - rect.width + 5
}); });
} }
} }
@@ -1680,6 +1680,7 @@ const Thread = () => {
position: "absolute", position: "absolute",
top: outOfViewPosition.top - postOnHoverHeight / 2 + 10, top: outOfViewPosition.top - postOnHoverHeight / 2 + 10,
left: outOfViewPosition.left, left: outOfViewPosition.left,
right: outOfViewPosition.right,
maxWidth: outOfViewPosition.maxWidth, maxWidth: outOfViewPosition.maxWidth,
}} }}
> >