File tree 1 file changed +13
-4
lines changed
1 file changed +13
-4
lines changed Original file line number Diff line number Diff line change @@ -9,12 +9,13 @@ Accessible modal dialog component for React.JS
9
9
isOpen ={bool}
10
10
onRequestClose ={fn}
11
11
closeTimeoutMS ={n}
12
- style ={customStyle}>
13
-
12
+ style ={customStyle}
13
+ >
14
14
<h1 >Modal Content</h1 >
15
15
<p >Etc.</p >
16
16
</Modal >
17
17
```
18
+
18
19
## Styles
19
20
Styles are passed as an object with 2 keys, 'overlay' and 'content' like so
20
21
``` js
@@ -48,9 +49,17 @@ Styles are passed as an object with 2 keys, 'overlay' and 'content' like so
48
49
Styles passed to the modal are merged in with the above defaults and applied to their respective elements.
49
50
At this time, media queries will need to be handled by the consumer.
50
51
51
- ###Overriding styles globally
52
+ ### Using CSS Classes
53
+
54
+ If you prefer not to use inline styles or are unable to do so in your project,
55
+ you can pass ` className ` and ` overlayClassName ` props to the Modal. If you do
56
+ this then none of the default styles will apply and you will have full control
57
+ over styling via CSS.
58
+
52
59
53
- The default styles above are available on ` Modal.defaultStyles ` .
60
+ ### Overriding styles globally
61
+ The default styles above are available on ` Modal.defaultStyles ` . Changes to this
62
+ object will apply to all instances of the modal.
54
63
55
64
## Examples
56
65
Inside an app:
You can’t perform that action at this time.
0 commit comments