BEM with native CSS nesting
Adam Argyle
June 21, 2024
Vladyslav Zubko has a compromise (and probably a deep love for Haddaway ); they write BEM with native CSS nesting and thank substring matching selectors for the rad tactics. How # They propose this un-bem'ed wetness: .tag-list__tag { --background-color : var (--color-red-200) ; background-color : hsl ( var (--background-color) / 30 % ) ; } .tag-list__tag--github { --background-color : var (--color-gray-100) ; } to become this in native CSS: .tag-list__tag { --background-color : var (--color-red-200) ; background-color : hsl ( var (--background-color) / 30 % ) ; &[ class *='--github'] { --background-color : var (--color-gray-100) ; } } Seems legit. If BEM is your passion, keep calm and substring on.
Discussion in the ATmosphere