@use 'sass:string';

// Mixin to get the width media query for a breakpoint value in up direction.
//
// Example: up(0) { … } will return …
// Example: up(768px) { … } will return @media (width >= 768px) { … }
//
// Parameters are:
// * $breakpoint-value: the breakpoint value (in pixels)
@mixin up($breakpoint-value) {
    @if $breakpoint-value > 0 {
        @media (width >= $breakpoint-value) {
            @content;
        }
    } @else {
        @content;
    }
}

// Mixin to get the width media query for a breakpoint value in down direction.
//
// Example: down(0) { … } will return …
// Example: down(768px) { … } will return @media (width < 768px) { … }
//
// Parameters are:
// * $breakpoint-value: the breakpoint value (in pixels)
@mixin down($breakpoint-value) {
    @if $breakpoint-value > 0 {
        @media (width < $breakpoint-value) {
            @content;
        }
    } @else {
        @content;
    }
}

// Function to get the breakpoint modifier as an infix or a suffix.
//
// Example: get-modifier('infix, 'mobile', 0) will return ''
// Example: get-modifier('infix', 'tablet', 768px) will return 'tablet--'
// Example: get-modifier('suffix', 'tablet', 768px) will return '-tablet'
//
// Parameters are:
// * modifier: [ infix | suffix ]
// * $name: the breakpoint/modifier name to return (e.g. 'tablet')
// * $breakpoint-value: the breakpoint value to decide by (in pixels)
@function get-modifier($modifier, $name, $breakpoint-value) {
    @if $breakpoint-value > 0 {
        @if $modifier == 'infix' {
            @return string.unquote($name + '--');
        }

        @return string.unquote('-' + $name);
    }

    @return '';
}
