fix(material-icon): removed blocking line and updated documentation #155
Conversation
Codecov Report
@@ Coverage Diff @@
## master #155 +/- ##
=======================================
Coverage 95.78% 95.78%
=======================================
Files 21 21
Lines 712 712
Branches 64 64
=======================================
Hits 682 682
Misses 30 30Continue to review full report at Codecov.
|
packages/material-icon/README.md
Outdated
| #### Importing Icons | ||
|
|
||
| The React material icon package does not come packaged with [Google Font's Material Icons](https://google.github.io/material-design-icons/). If it was included in the Sass package this would block rendering of the page until the icons download. | ||
| We recommend following the two methods of adding the Material Icons to your app documented [here](https://google.github.io/material-design-icons/#getting-icons). We have personally taken the `<link>` tag approach as it doesn't block page render. Code is pasted here for your convenience. |
There was a problem hiding this comment.
"following the two methods" ... this is unclear. Do you mean the developer has to do two things? Or the developer should pick one way or another. And which one is the <link> approach?
There was a problem hiding this comment.
There are 2 ways that are documented within on material icons. How about...
We recommend following either of the 2 ways of adding Material Icons to your app, which are both documented ....
The 1st documented solution is the route our team has taken, since its not bundled with our CSS. This allows for quicker rendering, but a possibility of a Flash Of Unstyled Content (**FOUC**).
test/screenshot/webpack.config.js
Outdated
| ...require('./fab/webpack.config.js'), | ||
| ...require('./floating-label/webpack.config.js'), | ||
| ...require('./line-ripple/webpack.config.js'), | ||
| // ...require('./button/webpack.config.js'), |
There was a problem hiding this comment.
this should not be in this PR?
packages/material-icon/README.md
Outdated
| The React material icon package does not come packaged with [Google Font's Material Icons](https://google.github.io/material-design-icons/). If it was included in the Sass package this would block rendering of the page until the icons download. | ||
|
|
||
|
|
||
| We recommend following either of the 2 ways of adding Material Icons to your app, which are both documented [here](https://google.github.io/material-design-icons/#icon-font-for-the-web). The 1st documented solution is the route our team has taken, since its not bundled with our CSS. This allows for quicker rendering, but a possibility of a Flash Of Unstyled Content (**FOUC**). Code is pasted here for your convenience. |
There was a problem hiding this comment.
There are two different ways to add Material Icons to your website, both of which are documented in Material Icons Documentation. We recommend "Method 1: via Google Web Fonts", because it renders faster, but there can be Flash Of Unstyled Content (FOUC). The code to load Material Icons via Google Web Fonts is pasted here for your convenience.
fixes #98