TheLazy.Dev
Portfolio GitHub

Blog

question |scss |sass |mixins

Sass/SCSS identifier starting with a number

dennisfrijlink

Dennis Frijlink

Posted on November 20, 2020

Sass/SCSS identifier starting with a number

I'm writing SCSS mixins for using it for responsive web design.

For example:

// Large devices
@mixin lg {
    @media (min-width: #{$screen-lg-min}) {
        @content;
    }
}

// Extra large devices
@mixin xl {
    @media (min-width: #{$screen-xl-min}) {
        @content;
    }
}
Enter fullscreen mode Exit fullscreen mode

Now I wanna write a mixin for extra large devices

$screen-2xl-min: 1536px;
Enter fullscreen mode Exit fullscreen mode

But when I try to declare the mixin:

@mixin 2xl {
    @media (min-width: #{$screen-2xl-min}) {
        @content;
    }
}
Enter fullscreen mode Exit fullscreen mode

He gives an error with:

Expected identifier: @mixin 2xl {
Enter fullscreen mode Exit fullscreen mode

Can someone help me? Is there an option to let the name start with a number??

💖 💪 🙅 🚩
dennisfrijlink
Dennis Frijlink

Posted on November 20, 2020

Join Our Newsletter. No Spam, Only the good stuff.

Sign up to receive the latest update from our blog.

Related

Sass/SCSS identifier starting with a number
question Sass/SCSS identifier starting with a number

November 20, 2020