diff --git a/src/components/styled/modals/AlertModal.styled.jsx b/src/components/styled/modals/AlertModal.styled.jsx new file mode 100644 index 00000000..9ec3df6a --- /dev/null +++ b/src/components/styled/modals/AlertModal.styled.jsx @@ -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 ''; + } + }} +`; \ No newline at end of file diff --git a/src/components/styled/views/Thread.styled.jsx b/src/components/styled/views/Thread.styled.jsx index 09b9c343..534bd5d8 100644 --- a/src/components/styled/views/Thread.styled.jsx +++ b/src/components/styled/views/Thread.styled.jsx @@ -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 ''; } diff --git a/src/components/views/All.jsx b/src/components/views/All.jsx index 919affbb..01a647c5 100755 --- a/src/components/views/All.jsx +++ b/src/components/views/All.jsx @@ -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 ( - +

Are you sure you want to delete this post?

@@ -442,7 +443,7 @@ const All = () => {
-
+ ); } }); diff --git a/src/components/views/AllCatalog.jsx b/src/components/views/AllCatalog.jsx index 19d98acb..4f55504e 100755 --- a/src/components/views/AllCatalog.jsx +++ b/src/components/views/AllCatalog.jsx @@ -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 ( - +

Are you sure you want to delete this post?

@@ -139,7 +140,7 @@ const CatalogPost = ({post}) => {
-
+ ); } }); diff --git a/src/components/views/Board.jsx b/src/components/views/Board.jsx index 334428a8..4c39ceec 100755 --- a/src/components/views/Board.jsx +++ b/src/components/views/Board.jsx @@ -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 ( - +

Are you sure you want to delete this post?

@@ -596,7 +597,7 @@ const Board = () => {
-
+ ); } }); diff --git a/src/components/views/Catalog.jsx b/src/components/views/Catalog.jsx index a07a139c..af75dba7 100755 --- a/src/components/views/Catalog.jsx +++ b/src/components/views/Catalog.jsx @@ -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 ( - +

Are you sure you want to delete this post?

@@ -134,7 +135,7 @@ const CatalogPost = ({post}) => {
-
+ ); } }); diff --git a/src/components/views/Subscriptions.jsx b/src/components/views/Subscriptions.jsx index d6f97629..40829f72 100755 --- a/src/components/views/Subscriptions.jsx +++ b/src/components/views/Subscriptions.jsx @@ -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 ( - +

Are you sure you want to delete this post?

@@ -444,7 +445,7 @@ const Subscriptions = () => {
-
+ ); } }); diff --git a/src/components/views/SubscriptionsCatalog.jsx b/src/components/views/SubscriptionsCatalog.jsx index 883fcc68..0dea1769 100755 --- a/src/components/views/SubscriptionsCatalog.jsx +++ b/src/components/views/SubscriptionsCatalog.jsx @@ -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 ( - +

Are you sure you want to delete this post?

@@ -139,7 +140,7 @@ const CatalogPost = ({post}) => {
-
+ ); } }); diff --git a/src/components/views/Thread.jsx b/src/components/views/Thread.jsx index 374c617d..baf00ec2 100755 --- a/src/components/views/Thread.jsx +++ b/src/components/views/Thread.jsx @@ -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 ( - +

Are you sure you want to delete this post?

@@ -536,7 +537,7 @@ const Thread = () => {
-
+ ); } }); diff --git a/yarn.lock b/yarn.lock index 4f1184eb..ab7eeb01 100644 --- a/yarn.lock +++ b/yarn.lock @@ -1445,10 +1445,10 @@ resolved "https://registry.yarnpkg.com/@eslint-community/regexpp/-/regexpp-4.6.2.tgz#1816b5f6948029c5eaacb0703b850ee0cb37d8f8" integrity sha512-pPTNuaAG3QMH+buKyBIGJs3g/S5y0caxw0ygM3YyE6yJFySwiGGSzA+mM3KJ8QQvzeLh3blwgSonkFjgQdxzMw== -"@eslint/eslintrc@^2.0.1", "@eslint/eslintrc@^2.1.1": - version "2.1.1" - resolved "https://registry.yarnpkg.com/@eslint/eslintrc/-/eslintrc-2.1.1.tgz#18d635e24ad35f7276e8a49d135c7d3ca6a46f93" - integrity sha512-9t7ZA7NGGK8ckelF0PQCfcxIUzs1Md5rrO6U/c+FIQNanea5UZC0wqKXH4vHBccmu4ZJgZ2idtPeW7+Q2npOEA== +"@eslint/eslintrc@^2.0.1", "@eslint/eslintrc@^2.1.2": + version "2.1.2" + resolved "https://registry.yarnpkg.com/@eslint/eslintrc/-/eslintrc-2.1.2.tgz#c6936b4b328c64496692f76944e755738be62396" + integrity sha512-+wvgpDsrB1YqAMdEUCcnTlpfVBH7Vqn6A/NT3D8WVXFIaKMlErPIZT3oCIAVCOtarRpMtelZLqJeU3t7WY6X6g== dependencies: ajv "^6.12.4" debug "^4.3.2" @@ -1465,10 +1465,10 @@ resolved "https://registry.yarnpkg.com/@eslint/js/-/js-8.36.0.tgz#9837f768c03a1e4a30bd304a64fb8844f0e72efe" integrity sha512-lxJ9R5ygVm8ZWgYdUweoq5ownDlJ4upvoWmO4eLxBYHdMo+vZ/Rx0EN6MbKWDJOSUGrqJy2Gt+Dyv/VKml0fjg== -"@eslint/js@^8.46.0": - version "8.46.0" - resolved "https://registry.yarnpkg.com/@eslint/js/-/js-8.46.0.tgz#3f7802972e8b6fe3f88ed1aabc74ec596c456db6" - integrity sha512-a8TLtmPi8xzPkCbp/OGFUo5yhRkHM2Ko9kOWP4znJr0WAhWyThaw3PnwX4vOTWOAMsV2uRt32PPDcEz63esSaA== +"@eslint/js@^8.47.0": + version "8.47.0" + resolved "https://registry.yarnpkg.com/@eslint/js/-/js-8.47.0.tgz#5478fdf443ff8158f9de171c704ae45308696c7d" + integrity sha512-P6omY1zv5MItm93kLM8s2vr1HICJH8v0dvddDhysbIuZ+vcjOHg5Zbkf1mTkcmi2JA9oBG2anOkRnW8WJTS8Og== "@ethersproject/abi@5.6.4": version "5.6.4" @@ -3391,9 +3391,9 @@ form-data "^3.0.0" "@types/node@*", "@types/node@>=13.7.0": - version "20.4.9" - resolved "https://registry.yarnpkg.com/@types/node/-/node-20.4.9.tgz#c7164e0f8d3f12dfae336af0b1f7fdec8c6b204f" - integrity sha512-8e2HYcg7ohnTUbHk8focoklEQYvemQmu9M/f43DZVx43kHn0tE3BY/6gSDxS7k0SprtS0NHvj+L80cGLnoOUcQ== + version "20.4.10" + resolved "https://registry.yarnpkg.com/@types/node/-/node-20.4.10.tgz#73c9480791e3ddeb4887a660fc93a7f59353ad45" + integrity sha512-vwzFiiy8Rn6E0MtA13/Cxxgpan/N6UeNYR9oUu6kuJWxu6zCk98trcDp8CBhbtaeuq9SykCmXkFr2lWLoPcvLg== "@types/node@18.15.13": version "18.15.13" @@ -4963,9 +4963,9 @@ caniuse-api@^3.0.0: lodash.uniq "^4.5.0" caniuse-lite@^1.0.0, caniuse-lite@^1.0.30001464, caniuse-lite@^1.0.30001517: - version "1.0.30001519" - resolved "https://registry.yarnpkg.com/caniuse-lite/-/caniuse-lite-1.0.30001519.tgz#3e7b8b8a7077e78b0eb054d69e6edf5c7df35601" - integrity sha512-0QHgqR+Jv4bxHMp8kZ1Kn8CH55OikjKJ6JmKkZYP1F3D7w+lnFXF70nG5eNfsZS89jadi5Ywy5UCSKLAglIRkg== + version "1.0.30001520" + resolved "https://registry.yarnpkg.com/caniuse-lite/-/caniuse-lite-1.0.30001520.tgz#62e2b7a1c7b35269594cf296a80bdf8cb9565006" + integrity sha512-tahF5O9EiiTzwTUqAeFjIZbn4Dnqxzz7ktrgGlMYNLH43Ul26IgTMH/zvL3DG0lZxBYnlT04axvInszUsZULdA== captcha-canvas@3.2.1: version "3.2.1" @@ -6854,10 +6854,10 @@ eslint-visitor-keys@^2.1.0: resolved "https://registry.yarnpkg.com/eslint-visitor-keys/-/eslint-visitor-keys-2.1.0.tgz#f65328259305927392c938ed44eb0a5c9b2bd303" integrity sha512-0rSmRBzXgDzIsD6mGdJgevzgezI534Cer5L/vyMX0kHzT/jiB43jRhd9YUlMGYLQy2zprNmoT8qasCGtY+QaKw== -eslint-visitor-keys@^3.3.0, eslint-visitor-keys@^3.4.1, eslint-visitor-keys@^3.4.2: - version "3.4.2" - resolved "https://registry.yarnpkg.com/eslint-visitor-keys/-/eslint-visitor-keys-3.4.2.tgz#8c2095440eca8c933bedcadf16fefa44dbe9ba5f" - integrity sha512-8drBzUEyZ2llkpCA67iYrgEssKDUu68V8ChqqOfFupIaG/LCVPUT+CoGJpT77zJprs4T/W7p07LP7zAIMuweVw== +eslint-visitor-keys@^3.3.0, eslint-visitor-keys@^3.4.1, eslint-visitor-keys@^3.4.3: + version "3.4.3" + resolved "https://registry.yarnpkg.com/eslint-visitor-keys/-/eslint-visitor-keys-3.4.3.tgz#0cd72fe8550e3c2eae156a96a4dddcd1c8ac5800" + integrity sha512-wpc+LXeiyiisxPlEkUzU6svyS1frIO3Mgxj1fdy7Pm8Ygzguax2N3Fa/D/ag1WqbOprdI+uY6wMUl8/a2G+iag== eslint-webpack-plugin@^3.1.1: version "3.2.0" @@ -6917,14 +6917,14 @@ eslint@8.36.0: text-table "^0.2.0" eslint@^8.3.0: - version "8.46.0" - resolved "https://registry.yarnpkg.com/eslint/-/eslint-8.46.0.tgz#a06a0ff6974e53e643acc42d1dcf2e7f797b3552" - integrity sha512-cIO74PvbW0qU8e0mIvk5IV3ToWdCq5FYG6gWPHHkx6gNdjlbAYvtfHmlCMXxjcoVaIdwy/IAt3+mDkZkfvb2Dg== + version "8.47.0" + resolved "https://registry.yarnpkg.com/eslint/-/eslint-8.47.0.tgz#c95f9b935463fb4fad7005e626c7621052e90806" + integrity sha512-spUQWrdPt+pRVP1TTJLmfRNJJHHZryFmptzcafwSvHsceV81djHOdnEeDmkdotZyLNjDhrOasNK8nikkoG1O8Q== dependencies: "@eslint-community/eslint-utils" "^4.2.0" "@eslint-community/regexpp" "^4.6.1" - "@eslint/eslintrc" "^2.1.1" - "@eslint/js" "^8.46.0" + "@eslint/eslintrc" "^2.1.2" + "@eslint/js" "^8.47.0" "@humanwhocodes/config-array" "^0.11.10" "@humanwhocodes/module-importer" "^1.0.1" "@nodelib/fs.walk" "^1.2.8" @@ -6935,7 +6935,7 @@ eslint@^8.3.0: doctrine "^3.0.0" escape-string-regexp "^4.0.0" eslint-scope "^7.2.2" - eslint-visitor-keys "^3.4.2" + eslint-visitor-keys "^3.4.3" espree "^9.6.1" esquery "^1.4.2" esutils "^2.0.2" @@ -7753,9 +7753,9 @@ globals@^11.1.0: integrity sha512-WOBp/EEGUiIsJSp7wcv/y6MO+lV9UoncWqxuFfm8eBwzWNgyfBd6Gz+IeKQ9jCmyhoH99g15M3T+QaVHFjizVA== globals@^13.19.0: - version "13.20.0" - resolved "https://registry.yarnpkg.com/globals/-/globals-13.20.0.tgz#ea276a1e508ffd4f1612888f9d1bad1e2717bf82" - integrity sha512-Qg5QtVkCy/kv3FUSlu4ukeZDVf9ee0iXLAUYX13gbR17bnejFTzr4iS9bY7kwCf1NztRNm1t91fjOiyx4CSwPQ== + version "13.21.0" + resolved "https://registry.yarnpkg.com/globals/-/globals-13.21.0.tgz#163aae12f34ef502f5153cfbdd3600f36c63c571" + integrity sha512-ybyme3s4yy/t/3s35bewwXKOf7cvzfreG2lH0lZl0JB7I4GxRP2ghxOK/Nb9EkRXdbBXZLfq/p/0W2JUONB/Gg== dependencies: type-fest "^0.20.2" @@ -12118,9 +12118,9 @@ proto-list@~1.2.1: integrity sha512-vtK/94akxsTMhe0/cbfpR+syPuszcuwhqVjJq26CuNDgFGj682oRBXOP5MJpv2r7JtE8MsiepGIqvvOTBwn2vA== protobufjs@^6.10.2, protobufjs@^6.11.2: - version "6.11.3" - resolved "https://registry.yarnpkg.com/protobufjs/-/protobufjs-6.11.3.tgz#637a527205a35caa4f3e2a9a4a13ddffe0e7af74" - integrity sha512-xL96WDdCZYdU7Slin569tFX712BxsxslWwAfAhCYjQKGTq7dAU91Lomy6nLLhh/dyGhk/YH4TwTSRxTzhuHyZg== + version "6.11.4" + resolved "https://registry.yarnpkg.com/protobufjs/-/protobufjs-6.11.4.tgz#29a412c38bf70d89e537b6d02d904a6f448173aa" + integrity sha512-5kQWPaJHi1WoCpjTGszzQ32PG2F4+wRY6BmAT4Vfw56Q2FZ4YZzK20xUYQH4YkfehY1e6QSICrJquM6xXZNcrw== dependencies: "@protobufjs/aspromise" "^1.1.2" "@protobufjs/base64" "^1.1.2"