Mixin to align vertically an element relative to its first positioned parent

vertical-align.scss

/**
*
* Mixin to align vertically an element relative to its first positioned parent
*
* @params $position-type
* @params $align
*
* @use @include vertical-align;
*      or @include vertical-align($position-type: absolute, $align: bottom);
*      to override defaults
*
*/
@mixin vertical-align($position-type: relative, $align: middle) {
    $translate: 0% !default;
    $y: 0% !default;
    position: $position-type;

    @if $align == middle {
        $translate: 50%;
        $y: 50%;

    } @else if $align == bottom {
        $translate: 100%;
        $y: 100%;

    } @else if $align == over-the-top {
        $translate: 100%;
        $y: 0%;

    } @else {
        @if $position-type != relative and $position-type != absolute and $position-type != static {
            @warn 'unknown $position-type: ' + $position-type;

        } @else if $align != over-the-top and $align != bottom and $align != middle {
            @warn 'unknown $align: ' + $align;
        }
    }

    @include transform(translateY(-$translate));
    top: $y;
}