fix board AuthorDeleteAlert

This commit is contained in:
Tom
2023-05-24 12:27:54 +02:00
parent 148fe8ff0c
commit 9279d5cc9e
3 changed files with 21 additions and 94 deletions
@@ -3944,80 +3944,4 @@ export const PostMenu = styled.div`
cursor: pointer;
transition: transform 0.1s;
transform: ${props => props.rotated ? 'rotate(90deg)' : 'none'};
`;
export const AuthorDeleteAlert = styled.div`
.author-delete-alert {
padding: 20px;
border: 1px solid #ccc;
position: absolute;
top: 40%;
left: 50%;
transform: translate(-50%, -50%);
.author-delete-buttons {
display: flex;
justify-content: center;
& > button {
margin-top: 10px;
}
& > button:first-child {
margin-right: 20px;
}
}
}
${({ selectedStyle }) => {
switch (selectedStyle) {
case 'Yotsuba':
return `
.author-delete-alert {
background-color: #f0e0d6;
border: 1px solid #d9bfb7;
}`;
case 'Yotsuba-B':
return `
.author-delete-alert {
background-color: #d6daf0;
border: 1px solid #b7c5d9;
}`;
case 'Futaba':
return `
.author-delete-alert {
background-color: #f0e0d6;
border: 1px solid #d9bfb7;
}`;
case 'Burichan':
return `
.author-delete-alert {
background-color: #d6daf0;
border: 1px solid #b7c5d9;
}`;
case 'Tomorrow':
return `
.author-delete-alert {
background-color: #282a2e;
border: 1px solid #111;
}`;
case 'Photon':
return `
.author-delete-alert {
background-color: #ddd;
border: 1px solid #ccc;
}`;
default:
return '';
}
}}
`;
@@ -3210,7 +3210,7 @@ export const AuthorDeleteAlert = styled.div`
.author-delete-alert {
padding: 20px;
border: 1px solid #ccc;
position: absolute;
position: fixed;
top: 40%;
left: 50%;
transform: translate(-50%, -50%);
+20 -17
View File
@@ -8,8 +8,8 @@ import { useAccount, useAccountComments, useFeed, usePublishComment, usePublishC
import { flattenCommentsPages } from '@plebbit/plebbit-react-hooks/dist/lib/utils'
import { debounce } from 'lodash';
import useGeneralStore from '../../hooks/stores/useGeneralStore';
import { Container, NavBar, Header, Break, PostFormLink, PostFormTable, PostForm, TopBar, BoardForm, PostMenu, AuthorDeleteAlert} from '../styled/views/Board.styled';
import { Footer } from '../styled/views/Thread.styled';
import { Container, NavBar, Header, Break, PostFormLink, PostFormTable, PostForm, TopBar, BoardForm, PostMenu} from '../styled/views/Board.styled';
import { Footer, AuthorDeleteAlert } from '../styled/views/Thread.styled';
import EditModal from '../modals/EditModal';
import ImageBanner from '../ImageBanner';
import ModerationModal from '../modals/ModerationModal';
@@ -396,21 +396,24 @@ const Board = () => {
customUI: ({ onClose }) => {
return (
<AuthorDeleteAlert selectedStyle={selectedStyle}>
<div className="author-delete-buttons">
<button onClick={onClose}>No</button>
<button
onClick={() => {
setCommentCid(commentCid);
setPublishCommentEditOptions(prevOptions => ({
...prevOptions,
deleted: true,
}));
setTriggerPublishCommentEdit(true);
onClose();
}}
>
Yes
</button>
<div className='author-delete-alert'>
<p>Are you sure you want to delete this post?</p>
<div className="author-delete-buttons">
<button onClick={onClose}>No</button>
<button
onClick={() => {
setCommentCid(commentCid);
setPublishCommentEditOptions(prevOptions => ({
...prevOptions,
deleted: true,
}));
setTriggerPublishCommentEdit(true);
onClose();
}}
>
Yes
</button>
</div>
</div>
</AuthorDeleteAlert>
);