@unicef/material-ui 0.12.4 → 1.0.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +6 -6
- package/lib/dev.js +54131 -44612
- package/lib/dev.js.map +1 -1
- package/package.json +40 -41
- package/lib/prod.js +0 -46553
- package/lib/prod.js.map +0 -1
package/README.md
CHANGED
|
@@ -2,7 +2,7 @@
|
|
|
2
2
|
|
|
3
3
|
[](https://badge.fury.io/js/%40unicef%2Fmaterial-ui)
|
|
4
4
|
|
|
5
|
-
Customized version for UNICEF of [Material UI](https://
|
|
5
|
+
Customized version for UNICEF of [Material UI](https://mui.com/). Material UI is a set of [ReactJS](http://reactjs.org) user interface components based on [Google's material design](https://material.io/design/) written in Javascript.
|
|
6
6
|
|
|
7
7
|
You can see a **[Demo site](https://unicef.github.io/unicef-material-ui/example/)** and the **[reference documentation](https://unicef.github.io/unicef-material-ui/)**.
|
|
8
8
|
|
|
@@ -18,26 +18,26 @@ In order to use the UNICEF's Material UI components in your React project instal
|
|
|
18
18
|
|
|
19
19
|
### Adding UNICEF theme to your app
|
|
20
20
|
|
|
21
|
-
To use UNICEF theme add `
|
|
21
|
+
To use UNICEF theme add `ThemeProvider` at the top level of your app and warp you components inside `UNICEFStyleProvider`
|
|
22
22
|
|
|
23
23
|
```jsx
|
|
24
24
|
// App.js
|
|
25
25
|
import React from 'react'
|
|
26
|
-
import
|
|
26
|
+
import { ThemeProvider } from '@mui/material/styles'
|
|
27
27
|
import { theme, UNICEFStyleProvider } from '@unicef/material-ui'
|
|
28
28
|
|
|
29
29
|
export default function App() {
|
|
30
30
|
return (
|
|
31
|
-
<
|
|
31
|
+
<ThemeProvider theme={theme}>
|
|
32
32
|
<UNICEFStyleProvider>
|
|
33
33
|
{/* Components*/}
|
|
34
34
|
</UNICEFStyleProvider>
|
|
35
|
-
</
|
|
35
|
+
</ThemeProvider>
|
|
36
36
|
)
|
|
37
37
|
}
|
|
38
38
|
```
|
|
39
39
|
|
|
40
|
-
More info: <a href="https://material-ui
|
|
40
|
+
More info: <a href="https://mui.com/material-ui/customization/theming/">Material-ui theming</a>
|
|
41
41
|
|
|
42
42
|
### Example project
|
|
43
43
|
|