AtomicDesignに挑戦した所感 ~コンポーネントに持たせる要素~
- 2019.06.06
- ANOTHER AtomicDesign
- AtomicDesign, 読み物
管理画面ベースのサイトを構築するにあたり、AtomicDesignを導入しデザイン・フロントトコーディングを進めている。
その中で出た疑問や、つまずきのメモになります。
————
コンポーネント化を考える際に一番種類が多く、パターンが多いのがボタンであった。
パーツ化して設計する際に、下記のようなルールを定めて要素はクラスで指定を変えられるようにした。
使用する際には、ボタン要素に対して「ボタンサイズ+色+フォントサイズ+指定アイコン」のクラスを付け変えることで、決まったパターンを組み合わせで出し分けることが出来る。
が、コーディングを進めていると、微妙にデザインによって個別でサイズを指定したいパターンが必要になってきた。
後からフォントサイズのパターンを追加し、一部指定は別途ページ独自の値としてcssを上書きしたが「コンポーネントとして共通要素を使う」と考えた時に正しいのかが悩ましい。
-
前の記事
inputタグに表示するプレースホルダの位置を変更する 2019.05.31
-
次の記事
同一レベルの要素において「◯◯以降」を指定するスタイルシートセレクタ 2019.06.07