:extend mixins
See original GitHub issueThis feature request was proposed as a solution to this issue https://github.com/cloudhead/less.js/issues/1155
This is the synopsis
The awesome thing about mixins is that they speed up development, keep my work surface clean, I only have to write them once, and I know what the compiled result will be. However, a disadvantage of mixins is that they aren’t DRY. Especially when you use “utility” mixins a lot, like clearfix. This is where extends could be a much better option. In fact, this is a great, concrete use case for extending mixins. It would basically work like extending nested selectors, accept with mixins. So mixins wouldn’t change at all, they would still work the same way. If you have a mixin and don’t use it, it won’t show in the compiled CSS. If you do use it, it’s properties will still show up in the compiled code in each selector where it was used. And if you extend a mixin, the selector (or selectors) extending the mixin will show up in place of the mixin. So if you do this:
.clearfix() {
// stuff
}
.navbar {
&:extend(.clearfix());
}
.banner {
&:extend(.clearfix());
}
and the compiled result will be:
.navbar,
.banner {
// clearfix stuff
}
So the mixins properties are still inherited by the selectors that extended it, but the mixin (selector) itself doesn’t show up in the compiled result.
This would make both extends and mixins far more powerful than they are on their own.
Issue Analytics
- State:
- Created 11 years ago
- Reactions:11
- Comments:112 (61 by maintainers)
Top GitHub Comments
Public Service Announcement
At any point in time, you may submit a pull request, or work with a developer to get one in, and it’s very likely this feature be merged in. The Less.js library needs more regular contributions from individuals like the people in this thread. It’s not any one person’s responsibility. It’s entirely dependant on one individual seeing this thread, or needing this feature, and taking the time to make it happen.
If your response is that you’re not a developer, then there are many OTHER ways you can support this project in non-developmental roles, be it providing needed documentation for new features, or design support on the website, running tests, providing feedback on issues, project managing, answering questions on Stack Overflow, writing blog posts, tweeting about Less, contributing to CSS and web communities, and writing Less libraries.
Many of these tasks are being done by individuals who are developers, so the time they could be contributing to development is spent on these other tasks.
If you are a developer, and your response is, “I don’t have the time,” then that’s the exact reason for why this issue has sat open. It’s 100% up to you if a feature is completed, so asking why it hasn’t been completed by “someone” is not useful. You are that someone. It will happen, I guarantee it will happen, if and when you get involved in this project. You can become involved in one of the most popular open source tools on the web. You can make a difference in the lives of… thousands? Hundreds of thousands? Millions? And as a side benefit, you can make sure that your favorite features happen sooner rather than later.
If you want this or any feature to happen, make it happen. We would love to have you. We would love to work with you! Less can keep getting better and better the larger this community grows!
And, listen, I appreciate that sometimes people really have absolutely no time to contribute and yet still would really like a particular feature to happen. That’s fine. I would just say that if you’re in that scenario, that you aim for empathy and gratitude for people donating their time (and sometimes money) to help you, and I’m sure other people in the Less community will do their best to continue to do so, as they are able.
Sincerely, Matthew Dean, Member of Less.js Core Team
I already support my own projects and I listen to their feature requests. I honestly don’t have time to dig into Less.js core.