CODEWITHSUNDEEP
cssresponsive-designlessmedia-querieslessphp
Steven Dobbelaere
Steven Dobbelaere

Reputation: 211

Can't parse mediaqueries with Less PHP

In my Less file I've included some variables that I want to use for mediaqueries in Less:

@mobile:      ~"only screen and (max-width: 529px)";
@tablet:      ~"only screen and (min-width: 530px) and (max-width: 949px)";
@desktop:     ~"only screen and (min-width: 950px) and (max-width: 1128px)";
@desktop-xl:  ~"only screen and (min-width: 1129px)";

In my css I do something like this for example:

@media @desktop{
    .test{
        font-size: 12px;
    }
}

When I try to parse it with a preprocessor it compiles but when I do it with LessPHP I get this error:

PHP Fatal error:  Uncaught exception 'Exception' with message 'parse error: failed at `@media @desktop {`

Upvotes: 1

Views: 436

Answers (1)

DavidWainwright
DavidWainwright

Reputation: 2935

if you put a dummy rule at the top of the file, eg:

a {}

@mobile:      ~"only screen and (max-width: 529px)";
@tablet:      ~"only screen and (min-width: 530px) and (max-width: 949px)";
@desktop:     ~"only screen and (min-width: 950px) and (max-width: 1128px)";
@desktop-xl:  ~"only screen and (min-width: 1129px)";

@media @desktop{
    .test{
        font-size: 12px;
    }
}

It seems to work until the issue is fixed proper.

Upvotes: 0

Related Questions