Почему не работает миксин, который управляет адаптивом

У меня есть миксин для sass, который адаптивно уменьшает размер в пикселях, он принимает в себя :свойство, размер в макете, размер на 320, режим, и автоматически уменьшает размер при уменьшении экрана:

@mixin adaptive_size($property, $font_in_current_scale, $font_in_the_smallest_screen, $type){
    $additional_size: $font_in_current_scale - $font_in_the_smallest_screen;
    @if $type == 1{
// только уменьшение при уменьшении экрана.
        #{$property}: $font_in_current_scale + px;
        @media (max-width: #{$container_width + px}){
            #{$property}: calc(#{$font_in_the_smallest_screen + px} + #{$additional_size} * ((100vw - 320px) / #{$container_width - 320}));
        }
    } @else if $type == 2{
// только увеличение при увеличении экрана.
        #{$property}: $font_in_current_scale + px;
        @media (min-width: #{$screen_width + px}){
            #{$property}: calc(#{$font_in_the_smallest_screen + px} + #{$additional_size} * ((100vw - 320px) / #{$screen_width - 320}));
        }
    } @else{
// всегда будет изменяться пропорционально ширине экрана.
        #{$property}: calc(#{$font_in_the_smallest_screen + px} + #{$additional_size} * ((100vw - 320px) / #{$screen_width - 320}));
    }
}

Я решил его переписать, чтобы можно было добавлять минимальную ширину, то есть не 320, а указывать это в миксине, но ничего не работает совсем, в чем может быть проблема:

@mixin adaptive_size_width($property, $font_in_current_scale, $font_in_the_smallest_screen, $min_width, $type){
    $additional_size: $font_in_current_scale - $font_in_the_smallest_screen;
    @if $type == 1{
// только уменьшение при уменьшении экрана.
        #{$property}: $font_in_current_scale + px;
        @media (max-width: #{$container_width + px}){
            #{$property}: calc(#{$font_in_the_smallest_screen + px} + #{$additional_size} * ((100vw - $min_width + px) / #{$container_width - $min_width}));
        }
    } @else if $type == 2{
// только увеличение при увеличении экрана.
        #{$property}: $font_in_current_scale + px;
        @media (min-width: #{$screen_width + px}){
            #{$property}: calc(#{$font_in_the_smallest_screen + px} + #{$additional_size} * ((100vw - $min_width + px) / #{$screen_width - $min_width}));
        }
    } @else{
// всегда будет изменяться пропорционально ширине экрана.
        #{$property}: calc(#{$font_in_the_smallest_screen + px} + #{$additional_size} * ((100vw - $min_width + px) / #{$screen_width - 320}));
    }
}

Ответы (0 шт):