[doc] Improve the doc about how to handle global styles

[Manoz]

As discussed here we should improve the documentation about how to handle global styles and css-in-js in gatsby-browser.js .

As Kyle said: gatsby-browser.js isn't included when server rendering which means styles there aren't extracted and inlined in the generated html files so we should be more clear about this.

Thanks for the report @alexandernanberg :)

[durwasa-chakraborty]

If this issue is still open I would like to contribute and get familiarized with the code base, not only because of the goodies but because I am almost fed up with Octopress. 😄

Here is my understanding - We try to avoid the use of globals (like .button {...}) by in-lining the style components. Since, styles are not extracted in server renderings we need to explicitly include the style components that does not involve server renderings and global-styles.js is a good candidate for that.

[Manoz]

@durwasa-chakraborty Sure, go ahead and thank you :)

We were talking about the use of css-in-js inside gatsby-browser.js since it doesn't work. It works with basic css but not css-in-js.

We should be more clear about this in the documentation.