
// @require _/fill/mixins.scss
// @require _/margin/mixins.scss

/* CENTER */

@mixin center-margin ( $max-width: false ) {

  @include margin-x ( auto );

  @if $max-width {
    max-width: $max-width;
  }

}

// `$axis` can be either: `x`, `y` or `false` for both

@mixin center-flex ( $axis: false ) {

  display: flex;

  @if $axis != x {
    align-items: center;
  }

  @if $axis != y {
    justify-content: center;
  }

}

@mixin center-transform ( $axis: false ) {

  @if $axis != x {
    top: 50%;
  }

  @if $axis != y {
    left: 50%;
  }

  @if not $axis {

    transform: translate(-50%, -50%);

  } @else if $axis != x {

    transform: translateY(-50%);

  } @else if $axis != y {

    transform: translateX(-50%);

  }

}

/* ABSOLUTE */

@mixin center-absolute ( $width: false, $height: false ) {

  position: absolute;

  @if $width {
    left: 50%;
    margin-left: ( - $width / 2 );
  }

  @if $height {
    top: 50%;
    margin-top: ( - $height / 2 );
  }

}

@mixin center-absolute-fill () {

  @include fill-absolute ();
  margin: auto;

}

@mixin center-absolute-transform ( $axis: false ) {

  @include center-transform ( $axis );
  position: absolute;

}

/* FIXED */

@mixin center-fixed-fill () {

  @include fill-fixed ();
  margin: auto;

}

@mixin center-fixed-transform ( $axis: false ) {

  @include center-transform ( $axis );
  position: fixed;

}
