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——

관련 항목 ​