fix CSS injection order on the server

mui · Mar 24, 2021 · 5bf2abc · 5bf2abc
1 parent 1920072
commit 5bf2abc
Showing 1 changed file with 2 additions and 2 deletions.
diff --git a/docs/pages/_document.js b/docs/pages/_document.js
@@ -153,6 +153,8 @@ MyDocument.getInitialProps = async (ctx) => {
       userLanguage: ctx.query.userLanguage || 'en',
       // Styles fragment is rendered after the app and page rendering finish.
       styles: [
+        <style id="material-icon-font" key="material-icon-font" />,
+        <style id="font-awesome-css" key="font-awesome-css" />,
         styledComponentsSheet.getStyleElement(),
         <style
           id="emotion-server-side"
@@ -167,8 +169,6 @@ MyDocument.getInitialProps = async (ctx) => {
           // eslint-disable-next-line react/no-danger
           dangerouslySetInnerHTML={{ __html: css }}
         />,
-        <style id="material-icon-font" key="material-icon-font" />,
-        <style id="font-awesome-css" key="font-awesome-css" />,
         <style id="app-search" key="app-search" />,
         <style id="prismjs" key="prismjs" />,
         <style id="insertion-point-jss" key="insertion-point-jss" />,