//
// Avatar Mixins
// --------------------------------------------------

@mixin avatar-size($size) {
  height: $size;
  width: $size;
  line-height: $size + 1;

  &.avatar-demoted {
    &:before {
      font-size: $size;
    }
  }

  &.avatar-person {
    $image-margin: ceil($size * 0.125);

    background-size: auto $size - $image-margin;
    background-position: center $image-margin + 1;

    &.avatar-person-m1 {
      $image-margin: ceil($size * 0.16);

      background-size: auto $size - $image-margin;
      background-position: center $image-margin + 1;
    }
  }
}

@mixin avatar-active($padding) {
  position: relative;

  &:before {
    content: "";
    background-color: $brand-success;
    height: $grid-unit-y;
    width: $grid-unit-y;

    @include border-radius(50%);

    position: absolute;
    top: $padding;
    left: $padding;
  }
}

@mixin avatar-color-variation($color, $text-color: $color-white) {
  //border: 1px solid $color-new-border;
  //background-color: white;
  //color: $color;
  //
  //&.avatar-icon {
  //  background-color: rgba($color, 0.1);
  //  border-width: 0;
  //  color: $color;
  //}

  background-color: rgba($color, 0.3);
  color: darken($color, 0.3);
}

@mixin avatar-xs($squared: false) {
  font-size: $font-size-small - 1;

  @include avatar-size($avatar-xs);

  &.avatar-squared {
    &,
    .avatar-bg {
      @include border-radius($avatar-border-radius-xs);
    }
  }

  @if $squared == true {
    &,
    .avatar-bg {
      @include border-radius($avatar-border-radius-xs);
    }
  }
}

@mixin avatar-sm($squared: false) {
  font-size: $font-size-h4;

  @include avatar-size($avatar-sm);

  &.avatar-squared {
    &,
    .avatar-bg {
      @include border-radius($avatar-border-radius-sm);
    }
  }

  @if $squared == true {
    &,
    .avatar-bg {
      @include border-radius($avatar-border-radius-sm);
    }
  }
}

@mixin avatar-lg($squared: false) {
  font-size: $font-size-h2;

  @include avatar-size($avatar-lg);

  &.avatar-squared {
    &,
    .avatar-bg {
      @include border-radius($avatar-border-radius-lg);
    }
  }

  @if $squared == true {
    &,
    .avatar-bg {
      @include border-radius($avatar-border-radius-lg);
    }
  }
}

@mixin avatar-xl($squared: false) {
  font-size: $font-size-h1;

  @include avatar-size($avatar-xl);

  &.avatar-icon {
    font-size: $font-size-h2;
  }

  &.avatar-squared {
    &,
    .avatar-bg {
      @include border-radius($avatar-border-radius-xl);
    }
  }

  @if $squared == true {
    &,
    .avatar-bg {
      @include border-radius($avatar-border-radius-xl);
    }
  }
}

@mixin avatar-xxl($squared: false) {
  font-size: $font-size-h1;

  @include avatar-size($avatar-xxl);

  &.avatar-squared {
    &,
    .avatar-bg {
      @include border-radius($avatar-border-radius-xxl);
    }
  }

  @if $squared == true {
    @include border-radius($avatar-border-radius-xxl);
  }
}

@mixin avatar-xxxl($squared: false) {
  font-size: $font-size-h1;

  @include avatar-size($avatar-xxxl);

  &.avatar-icon {
    font-size: $font-size-h1 * 2;
  }

  &.avatar-squared {
    @include border-radius($avatar-border-radius-xxxl);
  }

  @if $squared == true {
    @include border-radius($avatar-border-radius-xxxl);
  }
}