fix(creset): include font-family to global styles

Author: codebender828

packages/chakra-ui-core/src/CReset/CReset.js

@@ -15,13 +15,15 @@ const defaultConfig = theme => ({
     color: theme.colors.gray[800],
     bg: undefined,
     borderColor: theme.colors.gray[200],
-    placeholderColor: theme.colors.gray[400]
+    placeholderColor: theme.colors.gray[400],
+    fontFamily: theme.fonts.body
   },
   dark: {
     color: theme.colors.whiteAlpha[900],
     bg: theme.colors.gray[800],
     borderColor: theme.colors.whiteAlpha[300],
-    placeholderColor: theme.colors.whiteAlpha[400]
+    placeholderColor: theme.colors.whiteAlpha[400],
+    fontFamily: theme.fonts.body
   }
 })
 
@@ -59,13 +61,14 @@ const CReset = {
     }
   },
   created () {
-    const { color, bg, borderColor, placeholderColor } = this.styleConfig[this.colorMode]
+    const { color, bg, borderColor, placeholderColor, fontFamily } = this.styleConfig[this.colorMode]
     useTailwindPreflight(this.theme)
     injectGlobal({
       html: {
         lineHeight: 1.5,
         color,
-        backgroundColor: bg
+        backgroundColor: bg,
+        fontFamily
       },
 
       '*, *::before, *::after': {

packages/chakra-ui-core/src/CReset/tests/CReset.test.js

@@ -29,7 +29,7 @@ describe('CReset.vue', () => {
     const cssResetConfig = (_, defaults) => {
       const { light } = defaults
       return {
-        ...defaults, light: { ...light, bg: 'pink', color: 'indigo' }
+        ...defaults, light: { ...light, bg: 'pink', color: 'indigo', fontFamily: "'Comic Sans MS'" }
       }
     }
 

packages/chakra-ui-core/src/CReset/tests/__snapshots__/CReset.test.js.snap

@@ -318,7 +318,7 @@ exports[`CReset.vue should accept config prop 1`] = `
     data-emotion="css"
   >
     
-    html{line-height:1.5;color:#1A202C;}
+    html{line-height:1.5;color:#1A202C;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Helvetica,Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol";}
   </style>
   <style
     data-emotion="css"
@@ -366,7 +366,7 @@ exports[`CReset.vue should accept config prop 1`] = `
     data-emotion="css"
   >
     
-    html{line-height:1.5;color:indigo;background-color:pink;}
+    html{line-height:1.5;color:indigo;background-color:pink;font-family:'Comic Sans MS';}
   </style>
   <style
     data-emotion="css"
@@ -731,7 +731,7 @@ exports[`CReset.vue should inject global styles 1`] = `
     data-emotion="css"
   >
     
-    html{line-height:1.5;color:#1A202C;}
+    html{line-height:1.5;color:#1A202C;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Helvetica,Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol";}
   </style>
   <style
     data-emotion="css"