CSS: rubric-note ​

div[class~="instui-rubric-note"] — ルーブリックのカテゴリとスコア指標を含む構造化メモ。

✅ Rubric-Note を使用する場合：

  • 評価ルーブリックまたは評価基準を表示する場合

  • スコアや指標でカテゴリ別にコンテンツを構成する必要がある場合

  • レイアウトで構造と階層を強調する必要がある場合 🚫 Rubric-Note を使用しないでください：

  • 単純なメモやコメントを表示する場合 — 代わりに Callout を使用してください

  • 複雑な採点ロジックが必要な場合 — カスタムコンポーネントを検討してください

アクセシビリティ ​

  • 行と列のある本格的なルーブリックを表示する場合はテーブルのセマンティクスを使用してください
  • スコア指標を色だけに頼らないようにしてください
  • 各カテゴリに説明的なラベルを付けてください

使用法 ​

css
@import "@pantoken/plugin-layouts/layouts.css";

パーツ ​

パート説明
.instui-criteriaルーブリック基準行のコンテナ。
.instui-description基準の詳細説明。
.instui-headerタイトルとメタデータを含むヘッダー。
.instui-name基準名またはカテゴリ。
.instui-row個々の基準行。
.instui-scoreスコア指標またはバッジ。

状態 ​

状態説明
:optional—

使用トークン ​

Token型値
--instui-color-background——
--instui-color-border——
--instui-color-info-background——
--instui-color-info-text——
--instui-color-primary——
--instui-color-surface——
--instui-color-text-secondary——
--instui-font-size-small<length>—
--instui-font-weight-semibold——
--instui-radius-medium——
--instui-space-medium——
--instui-space-small——

関連項目 ​