출처 상자 — 디자인 팩 아틀라스

출처 상자

Trust box

출처를 테두리 없는 회색 상자의 번호 목록(panel), 「기관 ｜ 자료 ｜ 확인일」 세 칸 표(ledger), 위 선 하나 아래 작은 각주(notes)로 보여 줘요.

쓰는 규칙목록 표시는 출처에만 쓴다 — 검사가 목록 줄 수로 출처를 센다.

다른 이름: TrustBox

--- // src/pages/[post].astro import { TrustBox } from '../components/registry'; --- <TrustBox sources={post.data.sources} checked={checked} aboutHref="/about/" disclaimerHref="/disclaimer/" medical={MEDICAL_NOTE} />

panel은 회색 상자 하나에 방패 제목, 요약, 번호 목록(링크 옆에 외부 링크 아이콘, 아래 줄에 기관과 확인일), 편집 원칙 링크, 의학 면책을 모두 넣어요. ledger는 상자 없이 「기관 | 자료 | 확인일」 머리 줄과 줄마다 선이 있는 표예요. 같은 출처가 한눈에 비교돼요. notes는 위 선 하나 아래에 작은 번호 목록으로, 기관과 날짜를 링크 뒤에 한 줄로 붙여요.

출처가 여섯 곳이라 panel은 가장 길어요. 근거를 정직하게 보여 주고 싶으면 ledger, 본문을 방해하지 않게 하려면 notes가 맞아요.

세 변형 모두 맨 아래에 「편집 원칙 / 의학 정보 면책 안내」 링크와 면책 문장이 붙어요.

이럴 때 — 변형 3

panel상자 하나 출처가 두세 곳으로 적을 때 — 한 상자에 전부.쓰는 사이트 3곳: babyfood, babyplay, vaccination
ledger장부 출처가 많고 기관마다 확인일을 보여 주는 게 중요할 때 — 기관 | 자료 | 확인일.쓰는 사이트 3곳: babysleep, birthprep, toddlerfood
notes각주 글 끝을 가볍게 두고 싶을 때 — 각주처럼 작게.쓰는 사이트 5곳: babysick, feeding, milestone, newborn, 허브

같은 컴포넌트, 다른 팩

15출처 상자Trust box

15출처 상자Trust box

15출처 상자Trust box

이럴 때 — 변형 3