各モジュールの細かな調整は別のクラスを割り当ててそこで管理

よくあるブログカードやメディア(画像1枚とテキスト部分からなる)の構成は、CSS設計で勉強したことを踏まえてモジュールと捉え、拡張・保守・運用しやすいようにSassファイルを別で分けてコーディングを行っていました。

ところが、デザインをよく見るとブログカードやメディアのコンテンツが微妙に違うサイズや配置、構成になっていたところに直面しました。

せっかくモジュールとして用意したCSSはそのまま活かしたいので、1つのモジュールにクラスを新たに追加し、細かな余白の調整や文字サイズ、行間、ボーダーなどは追加したクラスの方にCSSを充てることで対応しました。

この記事を書いた人