published: January 24, 2017 - last updated: May 13, 2024
Ever since 2012, there has been an open issue on the sass repository (opens new window) wanting the ability to refer to the selector's properties. I thought the idea was intriguing and seemed useful, so I decided to take a crack at offering that ability with a library on top of sass.
As of writing this, I've pushed the first version to github (opens new window), and welcome feedback!
My main concern in designing this library is that it not be too complicated. One of the easiest things to get confused about is how different selectors could inherit properties from one another, and that's the focus of my work on this project now.
The way I'm currently considering simplifying things is by adding restrictions to the types of selectors you can save properties to, such as dynamic ui states like :hover
or anything with multiple classes .blog-post.hero.big-panel
. The idea is to instead encourage users to leverage clearer and more semantic patterns, like transforming properties already defined at lower levels or using extend
. That way the selectors stay simple, and people are able to understand them easily.
The project is still in it's early stages, so feel free to make suggestions or pull requests!