currying.scss

@mixin centerChildElement($childElement: 'div', $useFlexbox: true) {
  @if $useFlexbox == true {
    display: flex;
    justify-content: center;
    align-items: center;
  } @else {
    position: relative;

    #{$childElement} {
      position: absolute;
      top: 50%;
      left: 50%;
      transform: translate(-50%, -50%);
    }
  }
}


/* 
  Centers a child element horizontally and vertically within a parent element. 
  Pass it a valid CSS selector to use.
*/
.someParentElement {
  @include centerChildElement('img');
}