Liero
Liero

Reputation: 27360

What syntax is this LESS variable @grid-breakpoints: xs 0, sm 576px, md 768px, lg 992px, xl 1200px;

In bootstrap less port I see this syntax:

@grid-breakpoints:
    xs 0,
    sm 576px,
    md 768px,
    lg 992px,
    xl 1200px;

what is it? is it not map, not array...

How do I get value for lg for example?

What's totally weird is, that map-get(@grid-breakpoints, lg) works in angular 7 project in src/styles.less but it does not work in src/mycomponent/mycomponent.less. it is simply not translated.

Upvotes: 0

Views: 174

Answers (1)

Amadan
Amadan

Reputation: 198446

Sorry, I misread less as sass due to map-get... Still - your pasted code does not agree with the code in your link (you're missing colons). The code in your link is a straightforward example of less maps, and you should be able to use @grid-breakpoints[lg] to access 992px (as long as your less is v3.5+). E.g.

@grid-breakpoints:
    xs 0,
    sm 576px,
    md 768px,
    lg 992px,
    xl 1200px;

body {
  width: @grid-breakpoints[lg];
}

generates

body {
  width: 992px;
}

Upvotes: 1

Related Questions