{
"$type": "site.standard.document",
"description": "Vladyslav Zubko has the cure?",
"path": "/bem-in-css-after-all",
"publishedAt": "2024-06-21T04:00:41.750Z",
"site": "at://did:plc:jnj7wcwuvspxdsipmecmx7rs/site.standard.publication/self",
"tags": [
"blog",
"css"
],
"textContent": "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.",
"title": "BEM with native CSS nesting"
}