Add margin, padding, border shorthands

jaridmargolin · May 20, 2019 · 3e43e7a · 3e43e7a
1 parent 5acf8b9
commit 3e43e7a
Show file tree

Hide file tree

Showing 2 changed files with 20 additions and 0 deletions.
diff --git a/packages/categoires/src/index.ts b/packages/categoires/src/index.ts
@@ -15,6 +15,7 @@ import {
   backgroundPosition,
   backgroundRepeat,
   backgroundSize,
+  border,
   borderBottom,
   borderColor,
   borderLeft,
@@ -41,6 +42,7 @@ import {
   left,
   letterSpacing,
   lineHeight,
+  margin,
   marginBottom,
   marginLeft,
   marginRight,
@@ -53,6 +55,7 @@ import {
   order,
   overflowX,
   overflowY,
+  padding,
   paddingBottom,
   paddingLeft,
   paddingRight,
@@ -94,10 +97,12 @@ export const layoutStyles = compose(
 
 // space
 export const spacingStyles = compose(
+  margin,
   marginTop,
   marginBottom,
   marginLeft,
   marginRight,
+  padding,
   paddingTop,
   paddingBottom,
   paddingLeft,
@@ -156,6 +161,7 @@ export const typographyStyles = compose(
 
 // borders
 export const borderStyles = compose(
+  border,
   borderWidth,
   borderStyle,
   borderColor,

diff --git a/packages/styles/src/index.ts b/packages/styles/src/index.ts
@@ -55,6 +55,10 @@ string
 })
 
 // space
+export const margin = style<CSS.MarginProperty<TLength>, 'margin', 'spaces'>({
+  prop: 'margin',
+  key: 'spaces'
+})
 export const marginTop = style<
 CSS.MarginTopProperty<TLength>,
 'marginTop',
@@ -87,6 +91,12 @@ CSS.MarginRightProperty<TLength>,
   prop: 'marginRight',
   key: 'spaces'
 })
+export const padding = style<CSS.PaddingProperty<TLength>, 'padding', 'spaces'>(
+  {
+    prop: 'padding',
+    key: 'spaces'
+  }
+)
 export const paddingTop = style<
 CSS.PaddingTopProperty<TLength>,
 'paddingTop',
@@ -303,6 +313,10 @@ CSS.LetterSpacingProperty<TLength>,
 })
 
 // borders
+export const border = style<CSS.BorderProperty<TLength>, 'border', 'borders'>({
+  prop: 'border',
+  key: 'borders'
+})
 export const borderWidth = style<
 CSS.BorderWidthProperty<TLength>,
 'borderWidth',