I would like to discuss the possibility of adopting BEM for Drupal 8 CSS class naming. BEM means 'block, element, modifier' and is a syntax for CSS class naming that plays very nicely with Object Oriented / Modular CSS concepts.

Please read http://csswizardry.com/2013/01/mindbemding-getting-your-head-round-bem-s... for further information.

Currently, the syntax proposed by BEM is not even possible in D7/D8 because of the way drupal_html_class() and drupal_clean_css_identifier() work together (they turn underscores into hyphens).

I see great potential in this concept for making theming in Drupal much more enjoyable.

Comments

Apparently http://drupal.org/node/1887918 already covers this concept... Awesome! So what's left to discuss?

Status:Active» Fixed

I consider this fixed then... sorry for the noise. I guess we should continue with setting up issues to actually get our hands dirty and implement the coding standards once the deadline for adjustments is due.

".block--modifier{}"
oh no,
much better to use original BEM
.block_modifier{}

cause some times you need
.block_modifier1_modifier2{}

.block--modifier == modifier
.block__element == sub-element.

e.g.

.human__hand == hand of a human
.human--female__hand == hand of a woman :)

Probably better to move this issue to D9 queue!

@andypost: The folks around JohnAlbin have already adopted it for the D8 CSS Standards (@see the link that I posted).

And I'd have to strongly disagree. If we don't do things like this for D8, it will be too late. This is our opportunity to provide modern CSS and HTML. We don't want to wait for D9 for this stuff.

@fubhy agreed. I posted the relevant changes to the draft CSS standards not even two days ago, basically the same recommendation as this issue. I take it as a sign that a lot of folks independently want this, and now is the time. If we can get enough dedicated front-end people in agreement and make a big push in cooperation with the Twig project, this can happen for D8.

It will be a major topic in this week's Mobile Initiative meetings, so everyone interested should check it out. There are two versions to help accommodate time zones: http://groups.drupal.org/mobile

Status:Fixed» Closed (fixed)

Automatically closed -- issue fixed for 2 weeks with no activity.