mirror of
https://github.com/bitsocialnet/5chan.git
synced 2026-08-03 07:41:04 +02:00
add highlight distinction
This commit is contained in:
@@ -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;
|
||||
}`;
|
||||
|
||||
|
||||
@@ -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;
|
||||
}
|
||||
|
||||
@@ -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;
|
||||
}`;
|
||||
|
||||
|
||||
@@ -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;
|
||||
@@ -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;
|
||||
Reference in New Issue
Block a user