feat: support fontStyle in props

Closes #91
styled-components · Feb 24, 2020 · 1777736 · 1777736
1 parent c23bfff
commit 1777736
Show file tree

Hide file tree

Showing 3 changed files with 16 additions and 0 deletions.
diff --git a/packages/system/src/styles/typography.js b/packages/system/src/styles/typography.js
@@ -52,6 +52,10 @@ export const fontWeight = style({
   themeGet: getFontWeight,
 })
 
+export const fontStyle = style({
+  prop: 'fontStyle',
+})
+
 export const textAlign = style({
   prop: 'textAlign',
 })
@@ -73,6 +77,7 @@ export const textTransform = style({
 export const typography = compose(
   fontFamily,
   fontSize,
+  fontStyle,
   lineHeight,
   fontWeight,
   textAlign,

diff --git a/packages/system/tests/styled-components/styles.test.js b/packages/system/tests/styled-components/styles.test.js
@@ -71,6 +71,16 @@ describe('styles', () => {
         ],
       },
     ],
+    [
+      'fontStyle',
+      {
+        styleRule: 'font-style',
+        expectations: [
+          ['normal', 'normal'],
+          ['italic', 'italic'],
+        ],
+      },
+    ],
     [
       'textAlign',
       {

diff --git a/website/src/pages/docs/style-props.mdx b/website/src/pages/docs/style-props.mdx
@@ -110,6 +110,7 @@ Available typography utilities:
 - `fontSize`
 - `lineHeight`
 - `fontWeight`
+- `fontStyle`
 - `textAlign`
 - `letterSpacing`
 - `color`