@import "./variables";

@mixin internet_explorer() {
    @media all and (-ms-high-contrast: none) {
        @content;
    }
}

@mixin iphone_plus() {
    // Iphone 6, 7, 8 plus (Portrait)
    @media only screen and (min-device-width: 414px) and (max-device-width: 736px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 3) {
        @content;
    }
}

@mixin iphone() {
    // Iphone 6, 7, 8 (Portrait)
    @media only screen and (min-device-width : 375px) and (max-device-width : 667px) and (orientation : portrait) and (-webkit-min-device-pixel-ratio: 2) {
        @content;
    }
}

@mixin mediumResolution() {
    @media (min-width : 1200px) and (max-width : 1550px) and (-ms-high-contrast: none) {
        @content;
    }
}

@mixin mobile() {
    @media(max-width: $screen-xs-max) {
        @content;
    }
}
//Ipad -768px
@mixin mob-land-tabl-port() {
    @media(min-width: $screen-sm-min) and (max-width: $screen-sm-max) {
        @content;
    }
}

@mixin tablet-landscape() {
    @media(min-width: $screen-md-min) and (max-width: $screen-md-max) {
        @content;
    }
}

@mixin device_but_landscape() {
    @media(max-width: $screen-md) {
        @content;
    }
}

@mixin device() {
    @media(max-width: $screen-md-max) {
        @content;
    }
}

@mixin notebook() {
    @media(min-width: $screen-lg-min) and (max-width: $screen-lg-max) {
        @content;
    }
}

@mixin desktop() {
    @media(min-width: $screen-lg-min) {
        @content;
    }
}

@mixin desktopXL() {
    @media(min-width: $screen-xl-min) {
        @content;
    }
}

@mixin bigger-than-mobile() {
    @media(min-width: $screen-xs-max) {
        @content;
    }
}

@mixin make-arrow($color, $direction, $size: 6px, $position: absolute, $round: false) {
    @include pseudo($pos: $position);
    width: 0;
    height: 0;
    @if $round {
        border-radius: 3px;
    }
    @if $direction == down {
        border-left: $size solid transparent;
        border-right: $size solid transparent;
        border-top: $size solid $color;
        margin-top: 0 - round( $size / 2.5 );
    } @else if $direction == up {
        border-left: $size solid transparent;
        border-right: $size solid transparent;
        border-bottom: $size solid $color;
        margin-bottom: 0 - round( $size / 2.5 );
    } @else if $direction == right {
        border-top: $size solid transparent;
        border-bottom: $size solid transparent;
        border-left: $size solid $color;
        margin-right: -$size;
    } @else if  $direction == left {
        border-top: $size solid transparent;
        border-bottom: $size solid transparent;
        border-right: $size solid $color;
        margin-left: -$size;
    }
}