diff --git a/src/coming-soon.js b/src/coming-soon.js index e7974e7..03ed96f 100644 --- a/src/coming-soon.js +++ b/src/coming-soon.js @@ -1,8 +1,3 @@ -/** - * Styles. - */ -import './styles/app.scss'; - /** * WordPress dependencies */ diff --git a/src/components/Modal.jsx b/src/components/Modal.jsx index 2dced53..7b9415f 100644 --- a/src/components/Modal.jsx +++ b/src/components/Modal.jsx @@ -1,33 +1,27 @@ /** * External dependencies */ -import { useState } from 'react'; +import { useState } from '@wordpress/element'; /** * WordPress dependencies */ -import { Modal as WP2Modal, Button, Icon } from '@wordpress/components'; +import { Modal as WP2Modal, Button } from '@wordpress/components'; import { useDispatch, useSelect } from '@wordpress/data'; -import { useEffect } from '@wordpress/element'; -import { store as editPostStore } from '@wordpress/edit-post'; import { __ } from '@wordpress/i18n'; /** * Internal dependencies */ -import { launch } from './Icons'; import { store as nfdComingSoonStore } from '../store'; import { setComingSoon } from '../utils/api/comingSoon'; - const Modal = () => { const { setIsModalOpen } = useDispatch(nfdComingSoonStore); - const [isComingSoonActive, setIsComingSoonActive] = useState(true); + const [isComingSoonActive, setIsComingSoonActive] = useState(true); - const { isModalOpen } = useSelect( - (select) => ({ - isModalOpen: select(nfdComingSoonStore).isModalOpen(), - }) - ); + const { isModalOpen } = useSelect((select) => ({ + isModalOpen: select(nfdComingSoonStore).isModalOpen(), + })); const handlePublishAndLaunch = () => { setComingSoon(false); @@ -40,27 +34,31 @@ const Modal = () => { } const title = __('Ready to launch your Site?', 'nfd-coming-soon'); - const heading = __('Pages and posts you publish will not be visible to the public until you launch your site.', 'nfd-coming-soon'); + const heading = __( + 'Pages and posts you publish will not be visible to the public until you launch your site.', + 'nfd-coming-soon' + ); const launchButtonText = __('Publish & Launch Site', 'nfd-coming-soon'); - const withoutLaunchButtonText = __('Publish without launching', 'nfd-coming-soon'); + const withoutLaunchButtonText = __( + 'Publish Without Launching', + 'nfd-coming-soon' + ); return ( - setIsModalOpen(false)} - > + setIsModalOpen(false)}>

{heading}

-
- - -
+
+ +   +
); diff --git a/src/styles/_mixins.scss b/src/styles/_mixins.scss deleted file mode 100644 index 8a38f2d..0000000 --- a/src/styles/_mixins.scss +++ /dev/null @@ -1,15 +0,0 @@ -/* -------------------------------------------------------------------------- */ -/* Mixins */ -/* -------------------------------------------------------------------------- */ - -/** - * Responsive mixin - * @param {string} $breakpoint - breakpoint name. Possible values are: small -*/ -@mixin responsive($breakpoint) { - @if $breakpoint == small { - @media only screen and (max-width: 600px) { - @content; - } - } -} diff --git a/src/styles/app.scss b/src/styles/app.scss deleted file mode 100644 index 4b50cdd..0000000 --- a/src/styles/app.scss +++ /dev/null @@ -1,4 +0,0 @@ -@use "modal"; - -@tailwind components; -@tailwind utilities; diff --git a/src/styles/modal.scss b/src/styles/modal.scss deleted file mode 100644 index fa86d29..0000000 --- a/src/styles/modal.scss +++ /dev/null @@ -1,26 +0,0 @@ -@use "mixins" as m; - -.modal-buttons { - - @include m.responsive(small) { - flex-direction: column; - align-items: stretch; - } - - display: flex; - justify-content: flex-end; - margin-top: 30px; - - svg { - margin-top: 5px; - } - - .is-primary { - margin-right: 5px; - box-shadow: none; - } - - .is-secondary { - box-shadow: none; - } -}