// Update: 20220401

//-----------------------------------
//Mixin Media Queries
//-----------------------------------
@use "sass:math";

// Width
@mixin brp($punto, $type: max, $units: px, $means: screen){
    //Max => hasta //min => desde
    @if      $type == max { @media only #{$means} and (max-width: $punto + $units) { @content; }}
    @else if $type == min { @media only #{$means} and (min-width: $punto + $units) { @content; }}
}

// Height And Portrait
@mixin brpp($punto, $type: max, $units: px, $means: screen) {
    //Max => hasta //min => desde
    @if $type == max {
        @media only #{$means} and (max-height: $punto + $units)
        and (orientation: portrait) { @content; }
    }
    @else if $type == min {
        @media only #{$means} and (min-height: $punto + $units)
        and (orientation: portrait) { @content; }
    }
}

// Width And Landscape
@mixin brpl($punto, $type: max, $units: px, $means: screen) {
    //Max => hasta //min => desde
    @if $type == max {
        @media only #{$means} and (max-width: $punto + $units)
        and (orientation: landscape) { @content; }
    }
    @else if $type == min {
        @media only #{$means} and (min-width: $punto + $units)
        and (orientation: landscape) { @content; }
    }
}

// Height
@mixin brph($punto, $type: max, $units: px, $means: screen){
    //Max => hasta //min => desde
    @if      $type == max { @media only #{$means} and (max-height: $punto + $units) { @content; }}
    @else if $type == min { @media only #{$means} and (min-height: $punto + $units) { @content; }}
}

// Width and heigh
@mixin brpwh($puntow, $puntoh, $type: max, $units: px, $means: screen){
    //Max => hasta //min => desde
    @if $type == max {
        @media only #{$means} and (max-width: $puntow + $units)
        and (max-height: $puntoh + $units) { @content; }
    }
    @else if $type == min {
        @media only #{$means} and (min-width: $puntow + $units)
        and (min-height: $puntoh + $units) { @content; }
    }
    @else if $type == maxmin {
        @media only #{$means} and (max-width: $puntow + $units)
        and (min-height: $puntoh + $units) { @content; }
    }
    @else if $type == minmax {
        @media only #{$means} and (min-width: $puntow + $units)
        and (max-height: $puntoh + $units) { @content; }
    }
}

// Multiple breakpoint
@mixin mbr($points...) {
    @for $i from 1 through length($points) {
        @include brp(nth($points, $i)) {
            @content($i);
        }
    }
}
//-----------------------------------
//END Media Queries
//-----------------------------------