SMACCS
Scalable and Modular Architecture for CSS
2013年とか2014年に話題になった(?)CSS設計 Webで読める本
参考
概要と例
5種類
Base
要素そのもののdefaultを定義する
classやidに対してではなく要素に対して定義する
サイト全体のcolorの指針を決めたりする
Layout
ページのエリアごとのstyle
classのprefixとしてl-を付ける
e.g. .l-header, .l-footer, .l-main
Module
再利用可能なパーツ
State
LayoutやModuleの特定の状態を示す
その特定の状態で、LayoutやModuleのstyleを上書きする
JSに依存する
e.g. .is-pressed, .is-disabled
Theme
サイトのルック＆フィールを定義
あまり使わない