Merge pull request #103 from smooth-code/various-features

Various features

Author: gregberge

packages/core/src/propGetters.js

@@ -71,6 +71,10 @@ export const propGetters = {
 
   // getRadius
   'border-radius': getMultiValues(getNumber(getRadius)),
+  'border-top-left-radius': getMultiValues(getNumber(getRadius)),
+  'border-top-right-radius': getMultiValues(getNumber(getRadius)),
+  'border-bottom-right-radius': getMultiValues(getNumber(getRadius)),
+  'border-bottom-left-radius': getMultiValues(getNumber(getRadius)),
 
   // getBorder
   border: getNumberBorder,
@@ -85,13 +89,15 @@ export const propGetters = {
   'border-right-width': getNumberBorderWidth,
   'border-bottom-width': getNumberBorderWidth,
   'border-left-width': getNumberBorderWidth,
+  'outline-width': getNumberBorderWidth,
 
   // getBorderStyle
   'border-style': getMultiBorderStyle,
   'border-top-style': getBorderStyle,
   'border-right-style': getBorderStyle,
   'border-bottom-style': getBorderStyle,
   'border-left-style': getBorderStyle,
+  'outline-style': getBorderStyle,
 
   // getShadow
   'box-shadow': getShadow,

packages/system/src/styles/backgrounds.js

@@ -6,7 +6,8 @@ export const background = style({
 })
 
 export const backgroundColor = style({
-  prop: 'backgroundColor',
+  prop: ['backgroundColor', 'bg'],
+  cssProperty: 'backgroundColor',
   themeGet: getColor,
 })
 

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,