DEV Community

Dennis Frijlink
Dennis Frijlink

Posted on

Sass/SCSS identifier starting with a number

#question #scss #sass #mixins

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??

Top comments (0)

Read next

baydezigner profile image

Scaling Frontend Development with Single-Spa Micro-Frontends

Codenv -

czarinacloud profile image

60-Second Series - Amazon EFS: Elastic File Storage Simplified

Czarina -

aldeiacloud profile image

Exportar Voip para AWS EC2 - .vmdk ou .ova

Railander Marques -

khaisimon_devgame profile image

AI Cabin Crew: Taking Teamwork to New Heights

KhaiSimon -