fix styling and positioning of post menu

This commit is contained in:
Tom
2023-05-25 13:27:09 +02:00
parent e392a1e584
commit 52b7243035
3 changed files with 29 additions and 43 deletions
+26 -40
View File
@@ -1721,15 +1721,13 @@ export const BoardForm = styled.div`
}
#post-menu {
ul {
background-color: #f0e0d6;
border: 1px solid #d9bfb7;
border-bottom: 1px solid #d9bfb7;
border-right-width: 2px;
}
border-right: 1px solid #d9bfb7;
border-bottom: 2px solid #d9bfb7;
li {
border-bottom: 1px solid #ccc;
border: 1px solid #d9bfb7;
border-bottom: none;
background-color: #f0e0d6;
:hover {
background-color: #ffe;
@@ -1746,14 +1744,13 @@ export const BoardForm = styled.div`
}
#post-menu {
ul {
background-color: #d6daf0;
border: 1px solid #b7c5d9;
border-right-width: 2px;
}
border-right: 1px solid #b7c5d9;
border-bottom: 2px solid #b7c5d9;
li {
border-bottom: 1px solid #b7c5d9;
border: 1px solid #b7c5d9;
border-bottom: none;
background-color: #d6daf0;
:hover {
background-color: #eef2ff;
@@ -1768,14 +1765,11 @@ export const BoardForm = styled.div`
#post-menu {
font-size: 13px !important;
ul {
background-color: #f0e0d6;
border: 1px solid #d9bfb7;
border-bottom: none;
}
border: 1px solid #d9bfb7;
border-bottom: none;
li {
background-color: #f0e0d6;
border-bottom: 1px solid #d9bfb7;
:hover {
@@ -1791,14 +1785,11 @@ export const BoardForm = styled.div`
#post-menu {
font-size: 13px !important;
ul {
background-color: #d6daf0;
border: 1px solid #b7c5d9;
border-bottom: none;
}
border: 1px solid #b7c5d9;
border-bottom: none;
li {
background-color: #d6daf0;
border-bottom: 1px solid #b7c5d9;
:hover {
@@ -1814,21 +1805,18 @@ export const BoardForm = styled.div`
}
#post-menu {
ul {
background-color: #282a2e;
border: 1px solid #000;
border-bottom: none;
}
border: 1px solid #000;
border-bottom: none;
li {
background-color: #282a2e;
border-bottom: 1px solid #000;
:hover {
background-color: #1d1f21;
}
}
}
`;
}`;
case 'Photon':
return `.highlighted {
@@ -1837,13 +1825,11 @@ export const BoardForm = styled.div`
}
#post-menu {
ul {
background-color: #ddd;
border: 1px solid #ccc;
border-bottom: none;
}
border: 1px solid #ccc;
border-bottom: none;
li {
background-color: #ddd;
border-bottom: 1px solid #ccc;
:hover {
+1 -1
View File
@@ -835,7 +835,7 @@ const Board = () => {
onClick={() => {
const rect = threadMenuRefs.current[thread.cid].getBoundingClientRect();
const menu = document.querySelector(`.post-menu-thread-${thread.cid}`);
menu.style.top = `calc(${rect.top}px + 17px)`;
menu.style.top = `calc(${rect.top + window.scrollY}px - 258px)`;
menu.style.left = `${rect.left}px`;
setRotatedStates(prevState => ({
+2 -2
View File
@@ -796,7 +796,7 @@ const Thread = () => {
onClick={() => {
const rect = threadMenuRefs.current[comment.cid].getBoundingClientRect();
const menu = document.querySelector(`.post-menu-thread-${comment.cid}`);
menu.style.top = `calc(${rect.top}px + 17px)`;
menu.style.top = `calc(${rect.top + window.scrollY}px + 17px)`;
menu.style.left = `${rect.left}px`;
setRotatedStates(prevState => ({
@@ -968,7 +968,7 @@ const Thread = () => {
onClick={() => {
const rect = replyMenuRefs.current[reply.cid].getBoundingClientRect();
const menu = document.querySelector(`.post-menu-reply-${reply.cid}`);
menu.style.top = `calc(${rect.top}px + 17px)`;
menu.style.top = `calc(${rect.top + window.scrollY}px + 17px)`;
menu.style.left = `${rect.left}px`;
setRotatedStates(prevState => ({