Rules

Jump to bottom Edit New page

jhilden edited this page May 25, 2012 · 1 revision

Don't @extend accross modules!
Avoid going more than one level deep with module components. If you come accross such a situation, it's probably a good sign for the need of a new module.

Example:

// in this case
.m-navigation-list
  .m-navigation-list--item
    .m-navigation-list--item--name

// it's probably better to create 2 modules
.m-navigation-list

.m-navigation-list-item
  .m-navigation-list-item--name

Be very careful when using nesting for modules!
As above, avoid going down more than one level! Be very careful with too generic selectors for cascading-WTF and performance reasons.

Example:

// this is very BAD
.m-modulename
  a

// this is better
.m-module-name
  > a

// this is ideal
.m-module-name
  .m-module-name--link