Open터미널 열기
마크다운으로 복사링크 공유

소개 페이지 위쪽 바

서비스 소개 · 인사이트 페이지 맨 위의 로고와 터미널 열기 줄이에요.

모바일PCPageTopBar

고르기#

이 부품을 언제 쓰고, 언제 다른 것을 쓰는지예요.

언제 쓰나#

  • 검색으로 들어오는 읽는 페이지의 틀 - 위쪽 바·첫 화면·푸터·읽기 진행.

여기로 합친 이름#

아래 이름들은 이 부품의 별칭·프리셋이에요. 새로 쓸 때는 PageTopBar · PageHero · MarketingFooter · ReadProgress를 써요.

인터페이스#

타입에서 자동으로 뽑은 표예요.

PageTopBar#

속성기본값타입설명
where*-stringCtaLink 집계용 - 어느 화면의 상단바에서 터미널로 넘어갔는지 남긴다.
openfalseboolean리블 Open의 글(/open/articles/<slug>) - 로고가 /open으로 가고 옆에 'Open' 알약(OpenFrame 머리와 같은 모양)

* 필수예요. 표는 타입에서 자동으로 뽑았어요.

접근성#

  • header 영역이에요. 터미널 열기는 링크예요.

플랫폼별 차이#

플랫폼별 차이
플랫폼차이
모바일

PC와 같은 모양이에요. 글자 역할만 폰 크기로 바뀌어요.

PC

마우스가 있는 기기에서만 hover가 켜지고, 키보드 초점 링이 보여요.