@charset "UTF-8";

// @description
// * iphone-7 mixin.
// * The iphone-7 mixin is designed to simplify the creation of media
// * queries targeting iphone-7 device with 375px × 667px.
// * It allows you to specify the orientation type (portrait or landscape)
// * and includes common device-specific media query conditions.

// @access public

// @version 1.4.1

// @author Khaled Mohamed

// @license MIT

// @repository: https://github.com/Black-Axis/sass-pire

// @reference: https://developer.mozilla.org/en-US/docs/Web/CSS/@media

// @namespace iphone

// @module iphone/iphone-7

// @dependencies:
// * - meta.type-of (SASS function).
// * - list.index (SASS function).
// * - LibFunc1.is-in-list (function).
// * - LibFunc2.merge (function).
// * - Error.throw (function).

// @param {String} $orientation-type
// * The type of the orientation for the mixin of the device type.
// * It can be (landscape, land, l, portrait, port, p, all, "").

// @example
// * .example {
// *   @include iphone-7(land) {
// *     content: "example";
// *   }
// * }

// @output
// * @media only screen and (min-device-width: 375px)
// * and (max-device-width: 667px)
// * and (-webkit-min-device-pixel-ratio: 2)
// * and (orientation: landscape) {
// *  .example {
// *    content: "example";
// *  }
// * }

// @note 1
// * This mixin implements media query for screens for
// * iphone-7 normal device. But for simplicity we wrote
// * the name of the mixin with iphone-7.

// @note 2
// * There are two mixins in this file.
// * The first is the (iphone-7) mixin and second is (ip-7) mixin.
// * The second one is for only simplicity when using (iphone-7) mixin.
// * The core logic of (ip-7) mixin is to call the first one.
// * You can use one of them as you want.

// stylelint-disable media-feature-name-no-vendor-prefix
// stylelint-disable scss/operator-no-newline-after
// stylelint-disable media-query-no-invalid

@use "sass:meta";
@use "sass:list";
@use "../../../../../functions/global/is-in-list" as LibFunc1;
@use "../../../../../functions/list/merge" as LibFunc2;
@use "../../../../../development-utils/toggle-error-message" as Error;

@mixin iphone-7($orientation-type: portrait) {
    @if meta.type-of($orientation-type) != string {
        content: Error.throw("The parameter of iphone-7 mixin must be in a string type.");
    }

    $landscape-values: (landscape, land, l) !default;
    $portrait-values: (portrait, port, p, "") !default;
    $all-orientations-types: LibFunc2.merge($landscape-values, $portrait-values) !default;
    $min-device-width: 375px !default;
    $max-device-width: 667px !default;
    $min-device-pixel-ratio: 2 !default;

    @if $orientation-type == all {
        @media screen and (min-device-width: $min-device-width)
            and (max-device-width: $max-device-width)
            and (-webkit-device-pixel-ratio: $min-device-pixel-ratio) {
            @content;
        }
    } @else {
        @if LibFunc1.is-in-list($all-orientations-types, $orientation-type) {
            @if list.index($landscape-values, $orientation-type) {
                @media only screen and (min-device-width: $min-device-width)
                    and (max-device-width: $max-device-width)
                    and (-webkit-min-device-pixel-ratio: $min-device-pixel-ratio)
                    and (orientation: landscape) {
                    @content;
                }
            } @else if list.index($portrait-values, $orientation-type) {
                @media only screen and (min-device-width: $min-device-width)
                    and (max-device-width: $max-device-width)
                    and (-webkit-min-device-pixel-ratio: $min-device-pixel-ratio)
                    and (orientation: portrait) {
                    @content;
                }
            }
        } @else {
            content: Error.throw("The parameter of iphone-7 mixin must be one of: (#{$all-orientations-types}).");
        }
    }
}

@mixin ip-7($orientation-type: portrait) {
    @include iphone-7($orientation-type) {
        @content;
    }
}