` 헤딩으로 표시됩니다. `#title`과 `#lead` 슬롯을 사용하여 팀에 대한 설명을 작성할 수 있습니다. `` 컴포넌트는 문서 페이지에서 사용할 때와 동일하게 작동하며, 팀 구성원 목록을 표시합니다. ### 팀 구성원을 구분하기 위한 섹션 추가 {#add-sections-to-divide-team-members} 팀 페이지에 "섹션"을 추가할 수도 있습니다. 예를 들어, 핵심 팀 구성원과 커뮤니티 파트너와 같은 다양한 유형의 팀 구성원이 있을 수 있습니다. 이 구성원들을 섹션으로 나누어 각 그룹의 역할을 더 잘 설명할 수 있습니다. 이를 위해 이전에 만든 `team.md` 파일에 `` 컴포넌트를 추가하세요. ```html --- layout: page --- ``` `` 컴포넌트는 `VPTeamPageTitle` 컴포넌트처럼 `#title`과 `#lead` 슬롯을 가질 수 있으며, 팀 구성원을 표시하기 위한 `#members` 슬롯도 있습니다. `#members` 슬롯 내부에는 `` 컴포넌트를 추가해야 합니다. ## `` `` 컴포넌트는 주어진 팀 구성원 목록을 표시합니다. ```html ``` ```ts interface Props { // 각 구성원 사이즈. 기본값: `medium` size?: 'small' | 'medium' // 표시할 구성원 목록. members: TeamMember[] } interface TeamMember { // 구성원 아바타 이미지. avatar: string // 구성원 이름. name: string // 구성원 이름 아래에 표시될 직함. // 예: 개발자, 소프트웨어 엔지니어 등 title?: string // 구성원이 속한 조직. org?: string // 조직의 URL. orgLink?: string // 구성원에 대한 설명. desc?: string // 소셜 링크. 예: GitHub, Twitter 등. // 소셜 링크 객체를 전달해야 함. // 참고: https://vitepress.dev/ko/reference/default-theme-config.html#sociallinks links?: SocialLink[] // 구성원의 후원 페이지 URL. sponsor?: string // 후원 링크 텍스트. 기본값: 'Sponsor' actionText?: string } ``` ## `` 전체 팀 페이지를 만들 때 사용하는 루트 컴포넌트입니다. 단일 슬롯만 허용하며, 전달된 모든 팀 관련 컴포넌트에 스타일을 적용합니다. ## `` 페이지의 "제목" 섹션을 추가합니다. `` 아래 맨 처음에 사용하는 것이 가장 좋습니다. `#title`과 `#lead` 슬롯이 있습니다. ```html ``` ## `` 팀 페이지 내에서 "섹션"을 생성합니다. `#title`, `#lead`, `#members` 슬롯이 있습니다. `` 안에 원하는 만큼 섹션을 추가할 수 있습니다. ```html ... ```