SASS Mixin for BiDirectional Styles controlled via html[dir]

_mixins.bidirectional.scss

//
// BiDirectional Style Helper
// @description This mixin is designed to flip the property for right to left languages when needed. 
//  Determiniation of which style is included in the generated CSS is controled by a global variable to set the language direction.
//
// @param $property The LTR css property to set
// @param $value The value to use for the LTR css property
// @param $inverse-property (optional) The RTL css property to set (e.g. margin-right instead of margin-left).
// @param $inverse-value (optional) The RTL value of the $inverse-property (if set), or of the LTR css $property.
// @param $default-value (optional) The default LTR value for $property. This is required if $inverse-property is different than $property.
//
// Note: While both $inverse-property and $inverse-value are optional, at least one must be used for rtl support.
// Note: If $inverse-property is not the same as $property, then $default-value must be set.
//
@mixin bidi-style($property, $value, $inverse-property:null, $inverse-value:null, $default-value: null) {
    
    @if( $inverse-property == null and $inverse-value == null ) {
        @warn "To correctly use 'bidi-style' either $inverse-property or $inverse-value must be specified, both cannot be null";
    }

    @if( ($property != $inverse-property) and ($default-value == null) ) {
        @warn "If $property and $inverse-property are different values, then $default-value for $property must be specified";
    }

    $inverse-property: $property !default;
    $inverse-value: $value !default;

    #{$property}: $value;
    
    html[dir=rtl] & {

        @if( $property != $inverse-property ) {
            #{$property}: $default-value;
        }
        
        #{$inverse-property}: $inverse-value;
    }
}

main.scss

@import '_mixins.bidirectional';


body {
 
  header {
    @include bidi-style(text-direction, left, $inverse-value: right);
    
    .logo {
      @include bidi-style(margin-left, 10px, $inverse-property: margin-right, $default-value: auto);
    }
  } 
  
  .footer {
    @include bidi-style(text-direction, left, $inverse-value: right);
  }
}