From b33923a8756b0acb2bab8a7150320c4285710c5e Mon Sep 17 00:00:00 2001 From: PepijnSenders Date: Mon, 7 Jun 2021 12:07:44 -0400 Subject: [PATCH] [changed]: Updated and formatted example in README --- README.md | 74 +++++++++++++++++++++++++++---------------------------- 1 file changed, 37 insertions(+), 37 deletions(-) diff --git a/README.md b/README.md index 3d0d002c..69a4e9c7 100644 --- a/README.md +++ b/README.md @@ -45,22 +45,23 @@ import ReactDOM from 'react-dom'; import Modal from 'react-modal'; const customStyles = { - content : { - top : '50%', - left : '50%', - right : 'auto', - bottom : 'auto', - marginRight : '-50%', - transform : 'translate(-50%, -50%)' - } + content: { + top: '50%', + left: '50%', + right: 'auto', + bottom: 'auto', + marginRight: '-50%', + transform: 'translate(-50%, -50%)', + }, }; // Make sure to bind modal to your appElement (https://reactcommunity.org/react-modal/accessibility/) -Modal.setAppElement('#yourAppElement') +Modal.setAppElement('#yourAppElement'); + +function App() { + let subtitle; + const [modalIsOpen, setIsOpen] = React.useState(false); -function App(){ - var subtitle; - const [modalIsOpen,setIsOpen] = React.useState(false); function openModal() { setIsOpen(true); } @@ -70,34 +71,33 @@ function App(){ subtitle.style.color = '#f00'; } - function closeModal(){ + function closeModal() { setIsOpen(false); } - return ( -
- - - -

(subtitle = _subtitle)}>Hello

- -
I am a modal
-
- - - - - -
-
-
- ); + return ( +
+ + +

(subtitle = _subtitle)}>Hello

+ +
I am a modal
+
+ + + + + +
+
+
+ ); } ReactDOM.render(, appElement);