Button
원본: projects/skill-lens/design/components/Button/README.md
상태: Stable, 접근성 ✓, 다크 ✓, 코드 ✗
Primary, Secondary, Link, 상태
행동을 실행하는 버튼입니다. 원본은 8판 .b(보드맞춤 1판)와 .lk.
쓰는 곳
모든 화면.
구성(화면이 넘겨줄 것)
라벨, 누름 처리.
규칙
- 높이 48, 둥글기 12, 안쪽 24, 글자 16 700. 폰 아래 고정 주 버튼 56.
- 주 버튼(
sl-btn--primary): 먹색(action), 호버는 더 짙게(action-hover), 화면당 하나. 여정 버튼은 끝에 화살표(sl-btn__arrow, 호버에 3px). - 보조 버튼(
sl-btn--secondary): 흰 면 + 1px 테 + 먹색 글자. 호버는 보라 테 + 그림자. - 비활성: 같은 모양에 40% 흐리게, 이유를 근처에 씁니다.
- 링크(
sl-btn--link): 14 보라 밑줄, 조용한 링크는--quiet(회색). - 작은 버튼(
sl-btn--sm, 36)은 목록 행 안에서만. - 되돌릴 수 없는 마지막 행동 하나에만 빛 스침(
sl-btn--final). - 라벨은 명사형 2~4자, 숫자를 넣지 않습니다.
접근성
- 포커스 링 3px, offset 2px.
이 사이트는 ideber 저장소 projects/skill-lens/ 에서 자동으로 만들어집니다. 고칠 때는 저장소를 고칩니다. 공개 주소이지만 검색엔진에는 나오지 않습니다.