レシピ
table-basic
比較表・スペック表。
概要
データをテーブル形式で表示するセクションです。プラン比較、スペック一覧、料金比較などに使えます。ストライプ行＋ホバーハイライト付き。
YAML パラメータ
| パラメータ | 説明 |
|---|---|
heading |
セクション英語ラベル（省略でヘッダー非表示） |
subheading |
セクション日本語見出し |
extraClass |
追加CSSクラス |
style |
CSS変数の上書き |
columns[] |
ヘッダー列名（文字列配列） |
rows[] |
行データ（各行は文字列配列） |
CSS 調整変数
| 変数名 | 用途 | デフォルト |
|---|---|---|
--table-basic-padding |
セクション余白 | 5rem 0 |
--table-basic-bg |
背景色 | white |
--table-basic-title-size |
見出しサイズ | 1.8rem |
--table-basic-label-color |
ラベル色 | #00C6FF |
--table-basic-head-bg |
ヘッダー背景色 | #f1f5f9 |
--table-basic-border |
罫線色 | #e2e8f0 |
--table-basic-stripe-bg |
偶数行背景色 | #f8fafc |