質問: FLOCSSのコンポーネントについて >>> それ自体が固有の幅や色などの特色を持つことは避けるのが望ましいです。 とありますが、widthやcolorなどはどこに記載するのですか? projectですか? それともコンポーネントの同じcssファイル内だが、OOCSSのように構造とスキンを分離するほうが望ましいという意味でしょうか? ・ Component 再利用できるパターンとして、小さな単位のモジュールを定義します。 一般的によく使われるパターンであり、例えばBootstrapのComponentカテゴリなどに見られるbuttonなどが該当します。 出来る限り、最低限の機能を持ったものとして定義されるべきであり、それ自体が固有の幅や色などの特色を持つことは避けるのが望ましいです。 ・ また、compornentとprojectの違いはそのサイトでしか使わないパーツ(コーポレートサイトなら、求人のセクションなどでしょうか?)か、 ほかのサイトでも流用するボタンのようなパーツ(ボタンやパンクズリスト、会社情報のセクション?)という区別と聞いたのですが、 下記のような情報もあります。 結局よくわかりません? ・ Q:Componentレイヤーはどんなものが該当しますか? A:ほぼ追加されないと思っても大丈夫です。色やボーダーなどの装飾的なスタイルがついている場合やコンテンツの中身に使用するスタイルはProject レイヤーだと考えてもいいです。大枠のレイアウトで装飾的なスタイルをもっていない使い回せるものはComponentレイヤーに入る可能性があります。
回答: Width,HeightはCompornentかProjectに設置するのが無難じゃないでしょうか? ``` /* サイズはテキトーに */ .btn-size-min {width:100px;height:24px} .btn-size-mid {width:150px;height:32px;} .btn-size-large {width:200px;height:48px;} ``` どっちに定義すれば良いかと言われれば、スタイルを適用する範囲で決めています。 ### Project Projectを単位として扱うと(teratailを例として) * 質問一覧 * 質問固有ページ * ユーザ固有ページ くらいの単位で、そのProject単位に固有のスタイルを定義する ### Compornent 他Projectでも使用したいとかならCompornent、要は部品として使い回しできるように定義 参考 FLOCSS hiloki/flocss - github ### > > ほぼ追加されないと思っても大丈夫です。... > > > ライブラリを作るか使用するかで違いはあるとは思います。 Bootstrapのようなモノを作るのであれば、Compornentは大量に定義するでしょうし。 Bootstrapを利用しているなら、自分でごりごりCompornentを定義することは少ないと思います。 大抵のユーザは(ライト層?)、利用側に分類されると思いますので「**ほぼ**追加されない」と言っていると推測します。