// Transition
@mixin transition($transition: all .1s linear) {
    transition: $transition;
}

// Placeholder
@mixin placeholder($color) {
    $placeholders: "-webkit-input-" "-moz-" "-ms-input-" "";
    @each $placeholder in $placeholders {
      #{if(&, "&", "*")}::#{$placeholder}placeholder {
        color: $color;
      }
    }
}

// Centered
@mixin centered {
    margin-left: auto;
    margin-right: auto;
}

// Uncentered
@mixin uncentered {
    margin-left: initial;
    margin-right: initial;
}

// Stretched
@mixin stretched {
    &:after {
        position: absolute;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
        z-index: 1;
        content: "";
    }
}

// Dropcap
// Based on: https://codepen.io/0skar/pen/yOojVM
// $size — font size of the text
// $line — line height of the text
// $lines — how many lines of the text should be dropcap
// $magic1 — adjust font size
// $magic2 — adjust line height
@mixin dropcap($size, $line: 1.5, $lines: 3, $magic1: 1, $magic2: 1) {
    float: left;
    padding: 0 0.1em 0 0;
    font-size: floor(($size * $line)) * $lines * $magic1;
    line-height: floor(($size * $line)) * $lines * $magic2;
}