diff --git a/app/components/ChannelForm/ChannelForm.js b/app/components/ChannelForm/ChannelForm.js index b1a98f65..5b25cde0 100644 --- a/app/components/ChannelForm/ChannelForm.js +++ b/app/components/ChannelForm/ChannelForm.js @@ -51,7 +51,7 @@ const ChannelForm = ({ className={styles.modal} >
- +
diff --git a/app/components/ChannelForm/ChannelForm.scss b/app/components/ChannelForm/ChannelForm.scss index d6a06f91..4e7ecdce 100644 --- a/app/components/ChannelForm/ChannelForm.scss +++ b/app/components/ChannelForm/ChannelForm.scss @@ -1,7 +1,6 @@ @import '../../variables.scss'; .modal { - position: relative; width: 40%; margin: 50px auto; position: absolute; @@ -38,21 +37,21 @@ } .header { - padding: 20px; - background: $lightgrey; - text-align: center; - font-family: 'Jigsaw Light'; - text-transform: uppercase; - position: relative; - z-index: -2; + padding: 20px; + background: $lightgrey; + text-align: center; + font-family: 'Jigsaw Light'; + text-transform: uppercase; + position: relative; + z-index: -2; } .progress { - transition: all 0.2s ease; - background: $main; - position: absolute; - height: 100%; - top: 0; - left: 0; - z-index: -1; + transition: all 0.2s ease; + background: $main; + position: absolute; + height: 100%; + top: 0; + left: 0; + z-index: -1; } diff --git a/app/components/Form/Form.js b/app/components/Form/Form.js index dfc9476b..ba97fdb1 100644 --- a/app/components/Form/Form.js +++ b/app/components/Form/Form.js @@ -1,7 +1,7 @@ import React from 'react' import PropTypes from 'prop-types' -import { MdClose } from 'react-icons/lib/md' +import { FaClose } from 'react-icons/lib/fa' import PayForm from './PayForm' import RequestForm from './RequestForm' @@ -21,7 +21,7 @@ const Form = ({ formType, formProps, closeForm }) => {
- +
diff --git a/app/components/ModalRoot/ModalRoot.js b/app/components/ModalRoot/ModalRoot.js index b7e9a6ae..4e6abae1 100644 --- a/app/components/ModalRoot/ModalRoot.js +++ b/app/components/ModalRoot/ModalRoot.js @@ -1,6 +1,6 @@ import React from 'react' import PropTypes from 'prop-types' -import { MdClose } from 'react-icons/lib/md' +import { FaClose } from 'react-icons/lib/fa' import SuccessfulSendCoins from './SuccessfulSendCoins' import SuccessfulSendPayment from './SuccessfulSendPayment' import WalletDetails from './WalletDetails' @@ -21,7 +21,7 @@ const ModalRoot = ({ modalType, modalProps, hideModal, currentTicker, currency }
- +
{ @@ -20,6 +21,10 @@ const PeerForm = ({ form, setForm, connect }) => { parentSelector={() => document.body} className={styles.modal} > +
setForm({ isOpen: false })} className={styles.modalClose}> + +
+
event.charCode === 13 && submit()}>

Connect to a peer

diff --git a/app/components/Peers/PeerForm.scss b/app/components/Peers/PeerForm.scss index 74b11929..3c3df00f 100644 --- a/app/components/Peers/PeerForm.scss +++ b/app/components/Peers/PeerForm.scss @@ -16,6 +16,28 @@ border: 1px solid $darkgrey; } +.modalClose { + position: absolute; + top: -13px; + right: -13px; + display: block; + font-size: 16px; + line-height: 27px; + width: 32px; + height: 32px; + background: $white; + border-radius: 50%; + color: $darkestgrey; + cursor: pointer; + text-align: center; + z-index: 2; + transition: all 0.25s; +} + +.modalClose:hover { + background: $darkgrey; +} + .title { text-align: center; font-size: 24px; diff --git a/app/components/Peers/PeerModal.js b/app/components/Peers/PeerModal.js index 1d6ea161..5a957f9a 100644 --- a/app/components/Peers/PeerModal.js +++ b/app/components/Peers/PeerModal.js @@ -2,7 +2,7 @@ import React from 'react' import PropTypes from 'prop-types' import ReactModal from 'react-modal' -import { MdClose } from 'react-icons/lib/md' +import { FaClose } from 'react-icons/lib/fa' import styles from './PeerModal.scss' @@ -36,7 +36,7 @@ const PeerModal = ({ isOpen, resetPeer, peer, disconnect }) => { >
resetPeer(null)}> - +
{ diff --git a/app/components/Wallet/ReceiveModal.js b/app/components/Wallet/ReceiveModal.js index 6274e827..42adfd23 100644 --- a/app/components/Wallet/ReceiveModal.js +++ b/app/components/Wallet/ReceiveModal.js @@ -4,8 +4,7 @@ import ReactModal from 'react-modal' import copy from 'copy-to-clipboard' import QRCode from 'qrcode.react' import { showNotification } from 'notifications' -import { MdClose } from 'react-icons/lib/md' -import { FaCopy } from 'react-icons/lib/fa' +import { FaCopy, FaClose } from 'react-icons/lib/fa' import styles from './ReceiveModal.scss' const ReceiveModal = ({ isOpen, hideActivityModal, pubkey, address, newAddress, qrCodeType, changeQrCode }) => { @@ -42,7 +41,7 @@ const ReceiveModal = ({ isOpen, hideActivityModal, pubkey, address, newAddress, >
hideActivityModal()}> - +
diff --git a/app/routes/activity/components/components/Modal/Modal.js b/app/routes/activity/components/components/Modal/Modal.js index 223b8045..4ec34da6 100644 --- a/app/routes/activity/components/components/Modal/Modal.js +++ b/app/routes/activity/components/components/Modal/Modal.js @@ -1,7 +1,7 @@ import React from 'react' import PropTypes from 'prop-types' import ReactModal from 'react-modal' -import { MdClose } from 'react-icons/lib/md' +import { FaClose } from 'react-icons/lib/fa' import Transaction from './Transaction' import Payment from './Payment' @@ -48,7 +48,7 @@ const Modal = ({ modalType, modalProps, hideActivityModal, ticker, currentTicker >
hideActivityModal()}> - +