SASS Concatenate class name?

2019-02-21 03:08发布

I got a LESS file from this a Date-picker plugin and want to convert it to SASS.

But in the LESS, it concates a class name like this:

//LESS
.dropdown{
    &-inline{
    }
}

Result:

.dropdown-inline ...

I tried many things in SASS like #{-inline} or #{"-inline"} but it doesn't work.

I tried googling and found a year-old article saying it's impossible in SASS. I can't found recent post about this issue. Is it possible now? How?

Thanks

标签: sass less
2条回答
唯我独甜
2楼-- · 2019-02-21 03:41

Just moved from css to scss I ran in to this question and was disappointed until I found out it is not up-to-date. Found the correct answer here: https://css-tricks.com/the-sass-ampersand/#article-header-id-12.

It is now possible with the following syntax:

.add-some {
    &-red {
        color: red;
    }
}

Results, as expected, to:

.add-some-red {
    color: red;
}
查看更多
唯我独甜
3楼-- · 2019-02-21 03:58

This is not yet possible, but it will be eventually. Just like LESS, the syntax will use &.

查看更多
登录 后发表回答