diff --git a/src/components/styled/views/Board.styled.jsx b/src/components/styled/views/Board.styled.jsx index 29378895..8a9d1a60 100644 --- a/src/components/styled/views/Board.styled.jsx +++ b/src/components/styled/views/Board.styled.jsx @@ -1734,7 +1734,7 @@ export const BoardForm = styled.div` ${({ selectedStyle }) => { switch (selectedStyle) { case 'Yotsuba': - return `.highlighted { + return `.highlighted, .highlighted-click, .highlighted-address { background-color: #f0c0b0 !important; border: 1px solid #d99f91 !important; border-left: none !important; @@ -1761,7 +1761,7 @@ export const BoardForm = styled.div` }`; case 'Yotsuba-B': - return `.highlighted { + return `.highlighted, .highlighted-click, .highlighted-address { background-color: #d6bad0 !important; border: 1px solid #ba9dbf !important; border-left: none !important; @@ -1788,7 +1788,7 @@ export const BoardForm = styled.div` }`; case 'Futaba': - return `.highlighted { + return `.highlighted, .highlighted-click, .highlighted-address { background-color: #f0c0b0 !important; } @@ -1812,7 +1812,7 @@ export const BoardForm = styled.div` }`; case 'Burichan': - return `.highlighted { + return `.highlighted, .highlighted-click, .highlighted-address { background-color: #d6bad0 !important; } @@ -1836,7 +1836,7 @@ export const BoardForm = styled.div` }`; case 'Tomorrow': - return `.highlighted { + return `.highlighted, .highlighted-click, .highlighted-address { background-color: #1d1d21 !important; outline: 1px solid #111 !important; } @@ -1860,7 +1860,7 @@ export const BoardForm = styled.div` }`; case 'Photon': - return `.highlighted { + return `.highlighted, .highlighted-click, .highlighted-address { background-color: #ccc !important; outline: 1px solid #ccc !important; } @@ -3228,32 +3228,32 @@ export const BoardForm = styled.div` ${({ selectedStyle }) => { switch (selectedStyle) { case 'Yotsuba': - return `.highlighted { + return `.highlighted, .highlighted-click, .highlighted-address { background-color: #f0c0b0 !important; }`; case 'Yotsuba-B': - return `.highlighted { + return `.highlighted, .highlighted-click, .highlighted-address { background-color: #d6bad0 !important; }`; case 'Futaba': - return `.highlighted { + return `.highlighted, .highlighted-click, .highlighted-address { background-color: #f0c0b0 !important; }`; case 'Burichan': - return `.highlighted { + return `.highlighted, .highlighted-click, .highlighted-address { background-color: #d6bad0 !important; }`; case 'Tomorrow': - return `.highlighted { + return `.highlighted, .highlighted-click, .highlighted-address { background-color: #1d1d21 !important; }`; case 'Photon': - return `.highlighted { + return `.highlighted, .highlighted-click, .highlighted-address { background-color: #ccc !important; }`; diff --git a/src/components/styled/views/Catalog.styled.jsx b/src/components/styled/views/Catalog.styled.jsx index 786a59da..ab2545db 100644 --- a/src/components/styled/views/Catalog.styled.jsx +++ b/src/components/styled/views/Catalog.styled.jsx @@ -114,7 +114,7 @@ export const PostMenuCatalog = styled.div` ${({ selectedStyle }) => { switch (selectedStyle) { case 'Yotsuba': - return `.highlighted { + return `.highlighted, .highlighted-click, .highlighted-address { background-color: #f0c0b0 !important; border: 1px solid #d99f91 !important; border-left: none !important; @@ -137,7 +137,7 @@ export const PostMenuCatalog = styled.div` }`; case 'Yotsuba-B': - return `.highlighted { + return `.highlighted, .highlighted-click, .highlighted-address { background-color: #d6bad0 !important; border: 1px solid #ba9dbf !important; border-left: none !important; @@ -160,7 +160,7 @@ export const PostMenuCatalog = styled.div` }`; case 'Futaba': - return `.highlighted { + return `.highlighted, .highlighted-click, .highlighted-address { background-color: #f0c0b0 !important; } @@ -180,7 +180,7 @@ export const PostMenuCatalog = styled.div` }`; case 'Burichan': - return `.highlighted { + return `.highlighted, .highlighted-click, .highlighted-address { background-color: #d6bad0 !important; } @@ -200,7 +200,7 @@ export const PostMenuCatalog = styled.div` }`; case 'Tomorrow': - return `.highlighted { + return `.highlighted, .highlighted-click, .highlighted-address { background-color: #1d1d21 !important; border: 1px solid #111 !important; } @@ -220,7 +220,7 @@ export const PostMenuCatalog = styled.div` }`; case 'Photon': - return `.highlighted { + return `.highlighted, .highlighted-click, .highlighted-address { background-color: #ccc !important; border: 1px solid #ccc !important; } diff --git a/src/components/styled/views/Thread.styled.jsx b/src/components/styled/views/Thread.styled.jsx index e7466fc3..48d9f22b 100644 --- a/src/components/styled/views/Thread.styled.jsx +++ b/src/components/styled/views/Thread.styled.jsx @@ -923,7 +923,7 @@ export const BoardForm = styled.div` ${({ selectedStyle }) => { switch (selectedStyle) { case 'Yotsuba': - return `.highlighted { + return `.highlighted, .highlighted-click, .highlighted-address { background-color: #f0c0b0 !important; border: 1px solid #d99f91 !important; border-left: none !important; @@ -948,7 +948,7 @@ export const BoardForm = styled.div` }`; case 'Yotsuba-B': - return `.highlighted { + return `.highlighted, .highlighted-click, .highlighted-address { background-color: #d6bad0 !important; border: 1px solid #ba9dbf !important; border-left: none !important; @@ -972,7 +972,7 @@ export const BoardForm = styled.div` }`; case 'Futaba': - return `.highlighted { + return `.highlighted, .highlighted-click, .highlighted-address { background-color: #f0c0b0 !important; } @@ -995,7 +995,7 @@ export const BoardForm = styled.div` }`; case 'Burichan': - return `.highlighted { + return `.highlighted, .highlighted-click, .highlighted-address { background-color: #d6bad0 !important; } @@ -1018,7 +1018,7 @@ export const BoardForm = styled.div` }`; case 'Tomorrow': - return `.highlighted { + return `.highlighted, .highlighted-click, .highlighted-address { background-color: #1d1d21 !important; outline: 1px solid #111 !important; } @@ -1040,7 +1040,7 @@ export const BoardForm = styled.div` }`; case 'Photon': - return `.highlighted { + return `.highlighted, .highlighted-click, .highlighted-address { background-color: #ccc !important; outline: 1px solid #ccc !important; } @@ -2372,32 +2372,32 @@ export const BoardForm = styled.div` ${({ selectedStyle }) => { switch (selectedStyle) { case 'Yotsuba': - return `.highlighted { + return `.highlighted, .highlighted-click, .highlighted-address { background-color: #f0c0b0 !important; }`; case 'Yotsuba-B': - return `.highlighted { + return `.highlighted, .highlighted-click, .highlighted-address { background-color: #d6bad0 !important; }`; case 'Futaba': - return `.highlighted { + return `.highlighted, .highlighted-click, .highlighted-address { background-color: #f0c0b0 !important; }`; case 'Burichan': - return `.highlighted { + return `.highlighted, .highlighted-click, .highlighted-address { background-color: #d6bad0 !important; }`; case 'Tomorrow': - return `.highlighted { + return `.highlighted, .highlighted-click, .highlighted-address { background-color: #1d1d21 !important; }`; case 'Photon': - return `.highlighted { + return `.highlighted, .highlighted-click, .highlighted-address { background-color: #ccc !important; }`; diff --git a/src/utils/handleAddressClick.js b/src/utils/handleAddressClick.js index 86ac561b..987e0e4d 100644 --- a/src/utils/handleAddressClick.js +++ b/src/utils/handleAddressClick.js @@ -13,16 +13,26 @@ function handleAddressClick(shortAddress) { return; } - const highlightedElements = document.querySelectorAll('.highlighted'); - highlightedElements.forEach(el => { - el.classList.remove('highlighted'); - }); + const highlightedElements = document.querySelectorAll('.highlighted-address'); + let allHighlighted = true; matchingElements.forEach(el => { - if (!el.classList.contains('op-mobile') && !el.classList.contains('op-desktop')) { - el.classList.add('highlighted'); + if (!el.classList.contains('highlighted-address')) { + allHighlighted = false; } }); + + highlightedElements.forEach(el => { + el.classList.remove('highlighted-address'); + }); + + if (!allHighlighted) { + matchingElements.forEach(el => { + if (!el.classList.contains('op-mobile') && !el.classList.contains('op-desktop')) { + el.classList.add('highlighted-address'); + } + }); + } } export default handleAddressClick; \ No newline at end of file diff --git a/src/utils/handleQuoteClick.js b/src/utils/handleQuoteClick.js index 41992187..4abc1d68 100644 --- a/src/utils/handleQuoteClick.js +++ b/src/utils/handleQuoteClick.js @@ -36,21 +36,20 @@ function handleQuoteClick(reply, parentCid, threadCid) { }); if (targetElement) { - const highlightedElements = document.querySelectorAll('.highlighted'); - + const highlightedElements = document.querySelectorAll('.highlighted-click'); + highlightedElements.forEach(el => { - el.classList.remove('highlighted'); + el.classList.remove('highlighted-click'); }); - + targetElement.scrollIntoView({ behavior: "auto", block: "start" }); - + if (!targetElement.classList.contains('op-mobile') && !targetElement.classList.contains('op-desktop')) { - targetElement.classList.add('highlighted'); + targetElement.classList.add('highlighted-click'); } - } else { return; - } + } }; export default handleQuoteClick; \ No newline at end of file