////
/// Media query and screen-size/orientation helpers
///
/// @group wc-sass-mixins
/// @author https://github.com/cnduk/
////

/// max-screen media query helper
///
/// @require em
/// @require MASTER_FONT_SIZE
@mixin max-screen($res) {
    @media screen and (max-width: em($res, $MASTER_FONT_SIZE)) {
        @content;
    }
}

/// min-screen media query helper
/// @require em
/// @require MASTER_FONT_SIZE
@mixin min-screen($res) {
    @media screen and (min-width: em($res, $MASTER_FONT_SIZE)) {
        @content;
    }
}


/// screen size with orientation support media query helper
///
/// @require em
/// @require MASTER_FONT_SIZE
@mixin screen($res-min, $res-max, $orientation: false) {
    @if $orientation {
        @media screen and (min-width: em($res-min, $MASTER_FONT_SIZE))
                      and (max-width: em($res-max, $MASTER_FONT_SIZE))
                      and (orientation:#{$orientation}) {
            @content;
        }
    }
    @else {
        @media screen and (min-width: em($res-min, $MASTER_FONT_SIZE))
                      and (max-width: em($res-max, $MASTER_FONT_SIZE)) {
            @content;
        }
    }
}

@mixin desktop-size() {
    @include min-screen($DESKTOP_SIDE_GUTTER_BREAKPOINT) {
        @content;
    }
}

@mixin tablet-size() {
    @include min-screen($TABLET_SIDE_GUTTER_BREAKPOINT) {
        @content;
    }
}

@mixin common-medium-size() {
    @include min-screen($TABLET_SIDE_GUTTER_BREAKPOINT) {
        @content
    }
}

@mixin common-large-size() {
    @include min-screen($DESKTOP_SIDE_GUTTER_BREAKPOINT) {
        @content
    }
}

@mixin article-header-large-size() {
    @include min-screen($ARTICLE_HEADER_LARGE_BREAKPOINT){
        @content
    }
}

@mixin article-medium-size() {
    @include min-screen($DESKTOP_SIDE_GUTTER_BREAKPOINT) {
        @content
    }
}

@mixin article-large-size() {
    @include min-screen($ARTICLE_TOTAL){
        @content
    }
}

@mixin card-portrait-to-landscape-size() {
    @include min-screen($CARD_SWITCHER_WIDTH) {
        @content
    }
}

@mixin one-column-size() {
    @include max-screen($CARD_LIST_2_COLUMN_BREAKPOINT - 1){
        @content
    }
}

@mixin two-column-size() {
    @include min-screen($CARD_LIST_2_COLUMN_BREAKPOINT){
        @content
    }
}

@mixin three-column-size() {
    @include min-screen($CARD_LIST_3_COLUMN_BREAKPOINT){
        @content
    }
}

@mixin four-column-size() {
    @include min-screen($CARD_LIST_4_COLUMN_BREAKPOINT){
        @content
    }
}

@mixin five-column-size() {
    @include min-screen($CARD_LIST_5_COLUMN_BREAKPOINT){
        @content
    }
}

@mixin gallery-slice-at-medium() {
    @include min-screen( $GALLERY_MEDIUM_BREAKPOINT ){
        @content;
    }
}
@mixin gallery-slice-at-large() {
    @include min-screen( $GALLERY_LARGE_BREAKPOINT ){
        @content;
    }
}

@mixin feature-slice-at-large() {
    @include min-screen( $FEATURE_LARGE_BREAKPOINT ){
        @content;
    }
}

@mixin text-size-medium() {
    @include min-screen( $TYPE_MEDIUM_COPY_WIDTH ){
        @content;
    }
}

@mixin text-size-large() {
    @include min-screen( $TYPE_LARGE_COPY_WIDTH ){
        @content;
    }
}

/**
 * NEW Media queries sizes
 * ============================================================================
 */
/// min-screen media query helper
/// @require em
/// @require $XX_SMALL_SIZE
@mixin at-xx-small-size() {
    @include min-screen($XX_SMALL_SIZE) {
        @content;
    }
}

/// min-screen media query helper
/// @require em
/// @require $X_SMALL_SIZE
@mixin at-x-small-size() {
    @include min-screen($X_SMALL_SIZE) {
        @content;
    }
}

/// min-screen media query helper
/// @require em
/// @require $SMALL_SIZE
@mixin at-small-size() {
    @include min-screen($SMALL_SIZE) {
        @content;
    }
}

/// min-screen media query helper
/// @require em
/// @require $MEDIUM_SIZE
@mixin at-medium-size() {
    @include min-screen($MEDIUM_SIZE) {
        @content;
    }
}

/// min-screen media query helper
/// @require em
/// @require $LARGE_SIZE
@mixin at-large-size() {
    @include min-screen($LARGE_SIZE) {
        @content;
    }
}

/// min-screen media query helper
/// @require em
/// @require $X_LARGE_SIZE
@mixin at-x-large-size() {
    @include min-screen($X_LARGE_SIZE) {
        @content;
    }
}

/// min-screen media query helper
/// @require em
/// @require $XX_LARGE_SIZE
@mixin at-xx-large-size() {
    @include min-screen($XX_LARGE_SIZE) {
        @content;
    }
}