CODEWITHSUNDEEP
csssassbreakpointscompassprepros
brighthero
brighthero

Reputation: 135

Using sass breakpoint with Prepros

Is there any way to use

"breakpoint"

for sass within

"Prepros"

?

Upvotes: 1

Views: 329

Answers (2)

Mike
Mike

Reputation: 46

Yes. Here's an example:

@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; }
    }
}

...specifying as many as you want. And then using breakpoints is as easy as this:

.my-class {
    color: red;

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

}

In this example .my-class colour will be red, unless the viewport is at least 960px wide, in which case .my-class colour will be blue.

I hope this helps.

Upvotes: 0

Anand Deep Singh
Anand Deep Singh

Reputation: 2620

you can write your breakpoints in different file and can name that file as "_breakpoint.scss"

In your main app.scss you can call you dependent file with import function. So in your app.scss you would write :-

app.scss @import "_breakpoint.scss";

now you can use breakpoint in this file which you have define in _breakpoint.scss file.

Hope its clear!!

Upvotes: 0

Related Questions