Использование sass breakpoint с Prepros

Question

Есть ли способ использовать

" точка останова"

для нахальства в

"Prepros"

?

Answer 1

Вы можете записать свои точки останова в другой файл и можете назвать этот файл как "_breakpoint.scss"

В вашем основном app.scss вы можете вызвать зависимый файл с функцией импорта. Итак, в вашем app.scss вы бы написали:

app.scss @import "_breakpoint.scss";

теперь вы можете использовать точку останова в этом файле, которую вы определили в файле _breakpoint.scss.

Надеюсь, это ясно!

Answer 2

Да. Вот пример:

@mixin breakpoint($point) {
    @if $point == xs {
        @media (min-width: 420px) { @content; }
    } @else if $point == sm {
        @media (min-width: 640px) { @content; }
    } @else if $point == md {
        @media (min-width: 960px)  { @content; }
    }
}

... указав столько, сколько хотите. А затем использовать точки останова так же просто:

.my-class {
    color: red;

    @include breakpoint(md) {
        color: blue;
    }

}

В этом примере .my-class цвет будет красным, если только область просмотра не имеет ширины не менее 960 пикселей, в этом случае .my-class цвет будет синим.

Надеюсь, это поможет.