Inject global styles
%styled.global
[%styled.global]
is the method to apply general styles to your website.
%styled.global(`
html, body {
margin: 0;
padding: 0;
}
`)
[%styled.global {|
html, body {
margin: 0;
padding: 0;
}
|}];
Recommend to not add @font-face
definitions as globals. Consider adding the font directly to the HTML or in a style.css
file. More.
Since emotion has a small run-time for those global styles to be applied to the DOM. In a regular style file this isn’t an issue. Keeping @fonts-face
or other @imports
inside emotion will delay a bit their fetching and will cause a Flash of Unstyled Text.