External/5chan
1
0
Fork 0
mirror of https://github.com/bitsocialnet/5chan.git synced 2026-08-03 07:41:04 +02:00
Code Issues Packages Projects Releases Wiki Activity

feat(post): enable highlighting an already highlighted post by using a different color

Browse Source
This commit is contained in:
Tom (plebeius.eth)
2024-12-21 16:32:14 +01:00
parent 53638b023d
commit 5a498cbcb6
4 changed files with 43 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/components/reply-quote-preview/reply-quote-preview.tsx
+14 -2
View File
@@ -33,10 +33,20 @@ const handleQuoteHover = (cid: string, onElementOutOfView: () => void) => {
targetElements.forEach((element) => {
const htmlElement = element as HTMLElement;
if (isInViewport(htmlElement)) {
htmlElement.classList.add('highlight');
const hasHighlight = Array.from(htmlElement.classList).some((className) => className.includes('highlight') && !className.includes('double-highlight'));
if (hasHighlight) {
console.log('contains highlight');
htmlElement.classList.remove('highlight');
htmlElement.classList.add('double-highlight');
} else {
console.log("doesn't contain highlight", htmlElement.classList);
htmlElement.classList.remove('double-highlight');
htmlElement.classList.add('highlight');
}
anyInView = true;
} else {
htmlElement.classList.remove('highlight');
// If not in view, remove both classes
htmlElement.classList.remove('highlight', 'double-highlight');
}
});
@@ -112,6 +122,7 @@ const DesktopQuotePreview = ({ backlinkReply, quotelinkReply, isBacklinkReply, i
const targetElements = document.querySelectorAll(`[data-cid="${cid}"]`);
targetElements.forEach((element) => {
element.classList.remove('highlight');
element.classList.remove('double-highlight');
});
}
setHoveredCid(null);
@@ -215,6 +226,7 @@ const MobileQuotePreview = ({ backlinkReply, quotelinkReply, isBacklinkReply, is
const targetElements = document.querySelectorAll(`[data-cid="${cid}"]`);
targetElements.forEach((element) => {
element.classList.remove('highlight');
element.classList.remove('double-highlight');
});
}
setHoveredCid(null);