https://github.com/github0013/gatsby.v2-mui.v3
https://github.com/github0013/gatsby.v2-mui.v3
Last synced: over 1 year ago
JSON representation
- Host: GitHub
- URL: https://github.com/github0013/gatsby.v2-mui.v3
- Owner: github0013
- License: mit
- Created: 2018-11-21T09:33:38.000Z (over 7 years ago)
- Default Branch: master
- Last Pushed: 2018-11-21T10:01:01.000Z (over 7 years ago)
- Last Synced: 2025-01-23T05:15:50.264Z (over 1 year ago)
- Language: CSS
- Size: 376 KB
- Stars: 0
- Watchers: 2
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# Problem
Using Material-UI (V3) with gatsby (V2) has some problem related to [jss](https://github.com/cssinjs/jss). I see this happens after `gastby build` (production).
## e.g. svg icon styles break (it should be the default size 24x24)
```tsx
import { Star as StarIcon } from '@material-ui/icons'
...
...
return
```
Icon's CSS like above breaks on a page in a subdirectory (as far as I experienced).
* taking the max width of the parent's instead of fixed 24x24(default)

# Solutions
1. https://github.com/github0013/gatsby.v2-mui.v3/commit/36b1f97f9c544db1c6ffa4775434fc22beba4199
Follow [this example](https://github.com/mui-org/material-ui/tree/master/examples/gatsby) and edit files here and there.
1. https://github.com/github0013/gatsby.v2-mui.v3/commit/31ba54b7460213e832345b11e1a11db395109a52
Add [this plugin](https://www.gatsbyjs.org/packages/@wapps/gatsby-plugin-material-ui/) and remove ``