mirror of
https://github.com/bitsocialnet/5chan.git
synced 2026-08-03 07:41:04 +02:00
rename author delete modal to alert modal
This commit is contained in:
@@ -0,0 +1,77 @@
|
||||
import styled from 'styled-components';
|
||||
|
||||
export const AlertModal = styled.div`
|
||||
.author-delete-alert {
|
||||
padding: 20px;
|
||||
border: 1px solid #ccc;
|
||||
position: fixed;
|
||||
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 '';
|
||||
}
|
||||
}}
|
||||
`;
|
||||
@@ -3235,82 +3235,6 @@ export const Footer = styled.div`
|
||||
}
|
||||
}`;
|
||||
|
||||
default:
|
||||
return '';
|
||||
}
|
||||
}}
|
||||
`;
|
||||
|
||||
export const AuthorDeleteAlert = styled.div`
|
||||
.author-delete-alert {
|
||||
padding: 20px;
|
||||
border: 1px solid #ccc;
|
||||
position: fixed;
|
||||
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 '';
|
||||
}
|
||||
|
||||
@@ -9,8 +9,9 @@ import { useAccount, useAccountComments, useFeed, usePublishCommentEdit, useSubp
|
||||
import { flattenCommentsPages } from '@plebbit/plebbit-react-hooks/dist/lib/utils'
|
||||
import { debounce } from 'lodash';
|
||||
import { Container, NavBar, Header, Break, TopBar, BoardForm, PostMenu } from '../styled/views/Board.styled';
|
||||
import { AuthorDeleteAlert, Footer } from '../styled/views/Thread.styled';
|
||||
import { Footer } from '../styled/views/Thread.styled';
|
||||
import { PostMenuCatalog } from '../styled/views/Catalog.styled';
|
||||
import { AlertModal } from '../styled/modals/AlertModal.styled';
|
||||
import EditModal from '../modals/EditModal';
|
||||
import EditLabel from '../EditLabel';
|
||||
import ImageBanner from '../ImageBanner';
|
||||
@@ -419,7 +420,7 @@ const All = () => {
|
||||
confirmAlert({
|
||||
customUI: ({ onClose }) => {
|
||||
return (
|
||||
<AuthorDeleteAlert selectedStyle={selectedStyle}>
|
||||
<AlertModal selectedStyle={selectedStyle}>
|
||||
<div className='author-delete-alert'>
|
||||
<p>Are you sure you want to delete this post?</p>
|
||||
<div className="author-delete-buttons">
|
||||
@@ -442,7 +443,7 @@ const All = () => {
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</AuthorDeleteAlert>
|
||||
</AlertModal>
|
||||
);
|
||||
}
|
||||
});
|
||||
|
||||
@@ -9,7 +9,8 @@ import { useAccount, useFeed, usePublishCommentEdit, useSubplebbit, useSubplebbi
|
||||
import { debounce } from 'lodash';
|
||||
import { Container, NavBar, Header, Break, PostMenu, BoardForm } from '../styled/views/Board.styled';
|
||||
import { Threads, PostMenuCatalog } from '../styled/views/Catalog.styled';
|
||||
import { TopBar, Footer, AuthorDeleteAlert } from '../styled/views/Thread.styled';
|
||||
import { TopBar, Footer } from '../styled/views/Thread.styled';
|
||||
import { AlertModal } from '../styled/modals/AlertModal.styled';
|
||||
import CatalogLoader from '../CatalogLoader';
|
||||
import EditModal from '../modals/EditModal';
|
||||
import ImageBanner from '../ImageBanner';
|
||||
@@ -116,7 +117,7 @@ const CatalogPost = ({post}) => {
|
||||
confirmAlert({
|
||||
customUI: ({ onClose }) => {
|
||||
return (
|
||||
<AuthorDeleteAlert selectedStyle={selectedStyle}>
|
||||
<AlertModal selectedStyle={selectedStyle}>
|
||||
<div className='author-delete-alert'>
|
||||
<p>Are you sure you want to delete this post?</p>
|
||||
<div className="author-delete-buttons">
|
||||
@@ -139,7 +140,7 @@ const CatalogPost = ({post}) => {
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</AuthorDeleteAlert>
|
||||
</AlertModal>
|
||||
);
|
||||
}
|
||||
});
|
||||
|
||||
@@ -9,7 +9,8 @@ import { useAccount, useAccountComments, useFeed, usePublishComment, usePublishC
|
||||
import { flattenCommentsPages } from '@plebbit/plebbit-react-hooks/dist/lib/utils'
|
||||
import { debounce } from 'lodash';
|
||||
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 { Footer } from '../styled/views/Thread.styled';
|
||||
import { AlertModal } from '../styled/modals/AlertModal.styled';
|
||||
import { PostMenuCatalog } from '../styled/views/Catalog.styled';
|
||||
import EditModal from '../modals/EditModal';
|
||||
import EditLabel from '../EditLabel';
|
||||
@@ -573,7 +574,7 @@ const Board = () => {
|
||||
confirmAlert({
|
||||
customUI: ({ onClose }) => {
|
||||
return (
|
||||
<AuthorDeleteAlert selectedStyle={selectedStyle}>
|
||||
<AlertModal selectedStyle={selectedStyle}>
|
||||
<div className='author-delete-alert'>
|
||||
<p>Are you sure you want to delete this post?</p>
|
||||
<div className="author-delete-buttons">
|
||||
@@ -596,7 +597,7 @@ const Board = () => {
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</AuthorDeleteAlert>
|
||||
</AlertModal>
|
||||
);
|
||||
}
|
||||
});
|
||||
|
||||
@@ -9,7 +9,8 @@ import { useAccount, useFeed, usePublishComment, usePublishCommentEdit, useSubpl
|
||||
import { debounce } from 'lodash';
|
||||
import { Container, NavBar, Header, Break, PostForm, PostFormLink, PostFormTable, PostMenu, BoardForm } from '../styled/views/Board.styled';
|
||||
import { Threads, PostMenuCatalog } from '../styled/views/Catalog.styled';
|
||||
import { TopBar, Footer, AuthorDeleteAlert } from '../styled/views/Thread.styled';
|
||||
import { TopBar, Footer } from '../styled/views/Thread.styled';
|
||||
import { AlertModal } from '../styled/modals/AlertModal.styled';
|
||||
import CatalogLoader from '../CatalogLoader';
|
||||
import EditModal from '../modals/EditModal';
|
||||
import ImageBanner from '../ImageBanner';
|
||||
@@ -111,7 +112,7 @@ const CatalogPost = ({post}) => {
|
||||
confirmAlert({
|
||||
customUI: ({ onClose }) => {
|
||||
return (
|
||||
<AuthorDeleteAlert selectedStyle={selectedStyle}>
|
||||
<AlertModal selectedStyle={selectedStyle}>
|
||||
<div className='author-delete-alert'>
|
||||
<p>Are you sure you want to delete this post?</p>
|
||||
<div className="author-delete-buttons">
|
||||
@@ -134,7 +135,7 @@ const CatalogPost = ({post}) => {
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</AuthorDeleteAlert>
|
||||
</AlertModal>
|
||||
);
|
||||
}
|
||||
});
|
||||
|
||||
@@ -10,7 +10,8 @@ import { flattenCommentsPages } from '@plebbit/plebbit-react-hooks/dist/lib/util
|
||||
import { debounce } from 'lodash';
|
||||
import useGeneralStore from '../../hooks/stores/useGeneralStore';
|
||||
import { Container, NavBar, Header, Break, TopBar, BoardForm, PostMenu } from '../styled/views/Board.styled';
|
||||
import { AuthorDeleteAlert, Footer } from '../styled/views/Thread.styled';
|
||||
import { Footer } from '../styled/views/Thread.styled';
|
||||
import { AlertModal } from '../styled/modals/AlertModal.styled';
|
||||
import { PostMenuCatalog } from '../styled/views/Catalog.styled';
|
||||
import EditModal from '../modals/EditModal';
|
||||
import EditLabel from '../EditLabel';
|
||||
@@ -421,7 +422,7 @@ const Subscriptions = () => {
|
||||
confirmAlert({
|
||||
customUI: ({ onClose }) => {
|
||||
return (
|
||||
<AuthorDeleteAlert selectedStyle={selectedStyle}>
|
||||
<AlertModal selectedStyle={selectedStyle}>
|
||||
<div className='author-delete-alert'>
|
||||
<p>Are you sure you want to delete this post?</p>
|
||||
<div className="author-delete-buttons">
|
||||
@@ -444,7 +445,7 @@ const Subscriptions = () => {
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</AuthorDeleteAlert>
|
||||
</AlertModal>
|
||||
);
|
||||
}
|
||||
});
|
||||
|
||||
@@ -9,7 +9,8 @@ import { useAccount, useFeed, usePublishCommentEdit, useSubplebbit, useSubplebbi
|
||||
import { debounce } from 'lodash';
|
||||
import { Container, NavBar, Header, Break, PostMenu, BoardForm } from '../styled/views/Board.styled';
|
||||
import { Threads, PostMenuCatalog } from '../styled/views/Catalog.styled';
|
||||
import { TopBar, Footer, AuthorDeleteAlert } from '../styled/views/Thread.styled';
|
||||
import { TopBar, Footer } from '../styled/views/Thread.styled';
|
||||
import { AlertModal } from '../styled/modals/AlertModal.styled';
|
||||
import CatalogLoader from '../CatalogLoader';
|
||||
import EditModal from '../modals/EditModal';
|
||||
import ImageBanner from '../ImageBanner';
|
||||
@@ -116,7 +117,7 @@ const CatalogPost = ({post}) => {
|
||||
confirmAlert({
|
||||
customUI: ({ onClose }) => {
|
||||
return (
|
||||
<AuthorDeleteAlert selectedStyle={selectedStyle}>
|
||||
<AlertModal selectedStyle={selectedStyle}>
|
||||
<div className='author-delete-alert'>
|
||||
<p>Are you sure you want to delete this post?</p>
|
||||
<div className="author-delete-buttons">
|
||||
@@ -139,7 +140,7 @@ const CatalogPost = ({post}) => {
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</AuthorDeleteAlert>
|
||||
</AlertModal>
|
||||
);
|
||||
}
|
||||
});
|
||||
|
||||
@@ -8,7 +8,8 @@ import { useAccount, useAccountComments, useComment, usePublishComment, usePubli
|
||||
import { flattenCommentsPages } from '@plebbit/plebbit-react-hooks/dist/lib/utils'
|
||||
import { debounce } from 'lodash';
|
||||
import { Container, NavBar, Header, Break, PostForm, PostFormTable, PostMenu } from '../styled/views/Board.styled';
|
||||
import { ReplyFormLink, TopBar, BottomBar, BoardForm, Footer, AuthorDeleteAlert } from '../styled/views/Thread.styled';
|
||||
import { ReplyFormLink, TopBar, BottomBar, BoardForm, Footer } from '../styled/views/Thread.styled';
|
||||
import { AlertModal } from '../styled/modals/AlertModal.styled';
|
||||
import { PostMenuCatalog } from '../styled/views/Catalog.styled';
|
||||
import EditModal from '../modals/EditModal';
|
||||
import EditLabel from '../EditLabel';
|
||||
@@ -513,7 +514,7 @@ const Thread = () => {
|
||||
confirmAlert({
|
||||
customUI: ({ onClose }) => {
|
||||
return (
|
||||
<AuthorDeleteAlert selectedStyle={selectedStyle}>
|
||||
<AlertModal selectedStyle={selectedStyle}>
|
||||
<div className='author-delete-alert'>
|
||||
<p>Are you sure you want to delete this post?</p>
|
||||
<div className="author-delete-buttons">
|
||||
@@ -536,7 +537,7 @@ const Thread = () => {
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</AuthorDeleteAlert>
|
||||
</AlertModal>
|
||||
);
|
||||
}
|
||||
});
|
||||
|
||||
Reference in New Issue
Block a user