Skip to content

Commit 1520830

Browse files
committed
[chore] update readme and docs demos
1 parent 1a8f562 commit 1520830

9 files changed

+18
-22
lines changed

README.md

Lines changed: 7 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -122,10 +122,10 @@ local development server using `npm start` or `yarn run start`.
122122
There are several demos hosted on [CodePen](https://codepen.io) which
123123
demonstrate various features of react-modal:
124124

125-
* [Minimal example](https://codepen.io/claydiffrient/pen/KNxgav)
126-
* [Using setAppElement](https://codepen.io/claydiffrient/pen/ENegGJ)
127-
* [Using onRequestClose](https://codepen.io/claydiffrient/pen/KNjVBx)
128-
* [Using shouldCloseOnOverlayClick](https://codepen.io/claydiffrient/pen/woLzwo)
129-
* [Using inline styles](https://codepen.io/claydiffrient/pen/ZBmyKz)
130-
* [Using CSS classes for styling](https://codepen.io/claydiffrient/pen/KNjVrG)
131-
* [Customizing the default styles](https://codepen.io/claydiffrient/pen/pNXgqQ)
125+
* [Minimal example](https://codepen.io/neilhsmith/pen/QWVVEEg)
126+
* [Using onRequestClose](https://codepen.io/neilhsmith/pen/OJooXBg)
127+
* [Using shouldCloseOnOverlayClick](https://codepen.io/neilhsmith/pen/wvEYxKa)
128+
* [Using inline styles](https://codepen.io/neilhsmith/pen/gOdZPPP)
129+
* [Using CSS classes for styling](https://codepen.io/neilhsmith/pen/abaPNYm)
130+
* [Using styled-components](https://codepen.io/neilhsmith/pen/gOdJGxp)
131+
* [Customizing the default styles](https://codepen.io/neilhsmith/pen/abaPNGm)

docs/examples/css_classes.md

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -4,4 +4,4 @@ If you prefer to use CSS to handle styling the modal you can.
44

55
One thing to note is that by using the className property you will override all default styles.
66

7-
[CSS classes example](https://codepen.io/claydiffrient/pen/KNjVrG)
7+
[CSS classes example](https://codepen.io/neilhsmith/pen/abaPNYm)

docs/examples/global_overrides.md

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -2,4 +2,4 @@
22

33
If you'll be using several modals and want to adjust styling for all of them in one location you can by modifying `Modal.defaultStyles`.
44

5-
[Global overrides example](https://codepen.io/claydiffrient/pen/pNXgqQ)
5+
[Global overrides example](https://codepen.io/neilhsmith/pen/abaPNGm)

docs/examples/inline_styles.md

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -2,4 +2,4 @@
22

33
This example shows how to use inline styles to adjust the modal.
44

5-
[inline styles example](https://codepen.io/claydiffrient/pen/ZBmyKz)
5+
[inline styles example](https://codepen.io/neilhsmith/pen/gOdZPPP)

docs/examples/minimal.md

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -2,4 +2,4 @@
22

33
This example shows the minimal needed to get React Modal to work.
44

5-
[Minimal example](https://codepen.io/claydiffrient/pen/KNxgav)
5+
[Minimal example](https://codepen.io/neilhsmith/pen/QWVVEEg)

docs/examples/on_request_close.md

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -6,4 +6,4 @@ This is especially important for handling closing the modal via the escape key.
66

77
Also more important if `shouldCloseOnOverlayClick` is set to `true`, when clicked on overlay it calls `onRequestClose`.
88

9-
[onRequestClose example](https://codepen.io/claydiffrient/pen/KNjVBx)
9+
[onRequestClose example](https://codepen.io/neilhsmith/pen/OJooXBg)

docs/examples/set_app_element.md

Lines changed: 0 additions & 7 deletions
This file was deleted.

docs/examples/should_close_on_overlay_click.md

Lines changed: 1 addition & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -5,6 +5,4 @@ it requires the `onRequestClose` to be defined in order to close the <Modal/>.
55
This is due to the fact that the `react-modal` doesn't store the `isOpen`
66
on its state (only for the internal `portal` (see [ModalPortal.js](https://github.com/reactjs/react-modal/blob/master/src/components/ModalPortal.js)).
77

8-
[disable 'close on overlay click', codepen by claydiffrient](https://codepen.io/claydiffrient/pen/woLzwo)
9-
10-
[enable 'close on overlay click', codepen by sbgriffi](https://codepen.io/sbgriffi/pen/WMyBaR)
8+
[shouldCloseOnOverlayClick example](https://codepen.io/neilhsmith/pen/wvEYxKa)

docs/examples/styled_components.md

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
# styled-components
2+
3+
To use styled-components you must override the default inline styles by providing a className and/or overlayClassName. You can then provide your own styled component to the contentElement and overlayElement props.
4+
5+
[styled-components example](https://codepen.io/neilhsmith/pen/gOdJGxp?editors=1011)

0 commit comments

Comments
 (0)