Merge pull request #1 from pierreburel/feature/swap

Added flex-start/end, row/row-reverse and ltr/rtl support to direction function

README.md

@@ -38,6 +38,8 @@ h1 {
   border: direction-corners(1em 2em 3em 4em);
   font-size: direction-if(ltr, 1em, 2em);
   line-height: direction-if(rtl, 2);
+  flex-direction: direction(row);
+  justify-content: direction(flex-start);
 
   @include direction-if(ltr) {
     &::before {
@@ -50,6 +52,12 @@ h1 {
       content: "right to left";
     }
   }
+
+  direction: direction(rtl);
+
+  & > span {
+    direction: direction(ltr);
+  }
 }
 ```
 
@@ -73,11 +81,17 @@ h1 {
   padding: 1em 2em 3em 4em;
   border: 1em 2em 3em 4em;
   font-size: 1em;
+  flex-direction: row;
+  justify-content: flex-start;
+  direction: rtl;
 }
-
 h1::before {
   content: "left to right";
 }
+h1 > span {
+  direction: ltr;
+}
+
 ```
 
 ### `app-rtl.css`
@@ -90,11 +104,16 @@ h1 {
   border: 2em 1em 4em 3em;
   font-size: 2em;
   line-height: 2;
+  flex-direction: row-reverse;
+  justify-content: flex-end;
+  direction: ltr;
 }
-
 h1::after {
   content: "right to left";
 }
+h1 > span {
+  direction: rtl;
+}
 ```
 
 ---

_direction.scss

@@ -1,19 +1,29 @@
 $direction: ltr !default;
+$direction-values: (
+  ltr: rtl, 
+  rtl: ltr,
+  left: right,
+  right: left,
+  flex-start: flex-end,
+  flex-end: flex-start,
+  row: row-reverse,
+  row-reverse: row
+) !default;
 
 @function direction($value) {
-  @if $direction == rtl and ($value == left or $value == right) {
-    @return if($value == left, right, left);
-  } @else {
-    @return $value;
+  @if $direction == rtl and map-has-key($direction-values, $value) {
+    @return map-get($direction-values, $value);
   }
+
+  @return $value;
 }
 
 @function direction-sides($values) {
   @if $direction == rtl and length($values) == 4 {
     @return nth($values, 1) nth($values, 4) nth($values, 3) nth($values, 2);
-  } @else {
-    @return $values;
   }
+
+  @return $values;
 }
 
 @function direction-corners($values) {
@@ -25,9 +35,9 @@ $direction: ltr !default;
     } @else {
       @return nth($values, 2) nth($values, 1) nth($values, 4) nth($values, 3);
     }
-  } @else {
-    @return $values;
   }
+
+  @return $values;
 }
 
 @function direction-if($condition, $if, $else: null) {

bower.json

@@ -1,7 +1,7 @@
 {
   "name": "sass-direction",
   "description": "Sass mixins and functions to help creating bi-directional stylesheets.",
-  "version": "1.0.0",
+  "version": "1.1.0",
   "homepage": "https://github.com/pierreburel/sass-direction",
   "main": "_direction.scss",
   "authors": [

package.json

@@ -1,6 +1,6 @@
 {
   "name": "sass-direction",
-  "version": "1.0.1",
+  "version": "1.1.0",
   "description": "Sass mixins and functions to help creating bi-directional stylesheets.",
   "keywords": [
     "sass",