この記事の目的
個人的な開発をするときのcssのルール。考え方とかもまとめるのでcss設計を考える際の実例として読んでもらえると。
条件
- tailwindcss導入
- rails6
- railsのviewを利用
基本方針
- SMACSSをベースに
- できるだけ保守性を上げたいので抽象度を上げて使い回しできるようにしたい
- オリジナルのカスタマイズもできるようにしたい
ルール
- SMACSSのルールを踏襲し、下記に分ける
- ベース
- レイアウト
- モジュール
- ステート
- テーマ
- レイアウト
- class名にl-をつける
- コンテンツの横幅調整はtailwindcssのcontainerで行う
- 単語は_で区切る
- モジュール：部品をここで定義していく
- btn