タグラベル
概要
事案のカテゴリ及びステータスを表すのに使用します。
tips.scss にて適時追加してください。
デザイン
| 色の組み合わせ | デザインの際にコントラストをAAに準拠しつつ決定してください。 |
|---|---|
| 文字サイズ | $font-size-small / $font-size-codicil（最小幅） |
| 文字カラー | 白（枠） / メイン / サブ / ポイント / 特殊カラー（用途によって増やします） |
| 幅 | 通常幅（$btn-size-base：左右余白$min-space） / 文字成り行き（auto：左右余白$min-space） / 最小幅（$min-space：サンプルは60px：左右余白無し） |
展開例
- 通常幅：
-
サンプル1サンプル2サンプル3サンプル4
<div class="label white">サンプル1</div>
- 通常幅：
-
sample事例サンプル幅AUTOサイズでの展開
<div class="label white auto">サンプル1</div>
- 最小幅：
-
status1status2status3status4
<div class="label white min">サンプル1</div>
改変対象ファイル
- CSS:
- tips.scss 内に改変対象箇所があります。