버튼 컴포넌트 제작시 패딩 값 질문
안녕하세요 강사님, 현업 중 궁금한 점이 생겨 질문 드립니다.
spacing은 항상 4 혹은 8의 배수 로 진행한다면,
버튼 컴포넌트 생성시에도 동일하게 적용이 되는지 궁금합니다.
강사님의 강의를 접하기전에는, 프론트엔드 개발자 분이 무조건 짝수로 맞춰달라는 요청에
패딩을 짝수로 맞췄습니다.
그런데.... 본문에만 적용해야할 행간을
버튼 컴포넌트 폰트에도 동일하게 적용하여 결국엔 버튼 컴포넌트의 최종 크기가 짝수가 아니게 되어버렸습니다. ㅜㅜ
결국 개발자 분이 전부 수습을 하셨고, 이런 계기로 강사님의 강의를 듣게 되었는데요.
제 이야기의 문제점은
1. 버튼 컴포넌트 폰트에 행간 적용
2. 버튼 컴포넌트 패딩 값에 짝수 적용
이라고 생각되어 지는데,
버튼 컴포넌트 전체 너비와 높이가 짝수가 된다면 패딩 값은 홀수로 지정해도 되는것인지 궁금합니다. ㅜㅜ
Answer 1
0
안녕하세요, 이은종님! 질문 주셔서 감사합니다 ☺
패딩값이 홀수여도 괜찮습니다.
말씀하셨듯이 패딩은 상하/좌우에 홀수를 주어도 전체의 값이 짝수가 될 수 있죠.
버튼 컴포넌트의 경우 값이 자연수라면 보편적인 디스플레이에서 픽셀이 깨지지 않기 때문에 꼭 4의 배수나 8의 배수가 아니어도 괜찮습니다.
1. 버튼 컴포넌트 폰트에 행간 적용 👉 행간 값은 되도록 짝수를 추천드립니다.
대부분의 디자인 시스템에서 폰트의 행간 값을 px로 변환할 시 짝수가 되도록 맞춥니다.
이렇게 행간을 짝수로 맞춰놓으면 전체적으로 짝수 레이아웃을 유지할 수 있습니다.
[예시 이미지] https://atlassian.design/foundations/typography
2. 버튼 컴포넌트 패딩 값에 짝수 적용 👉 홀수 사용해도 됩니다. 자연수라면 괜찮습니다.
강의 수강 기간 연장 부탁드리겠습니다
0
5
1
7강 도형+펜툴 중 막혔습니다ㅠㅠㅠ
0
26
2
안녕하세요! 작업 속도를 높여주는 단축키와 플러그인 강의는 없는걸까요?!
0
25
3
항목부분만 필로 변경
0
23
1
구글 서치콘솔 도메인 소유권 확인 실패
0
40
2
선생님 섹션 2의 색상 설명 자료는
0
36
2
반응형 웹 디자인
0
58
2
액션 아이콘 컴포넌트 질문
0
46
2
3차시 실전 예시학습중입니다
0
37
3
강의자료 공유 부탁드립니다
0
39
2
뉴스페이퍼 싱글템플릿 모바일 화면 디자인 질문
0
41
2
셀렉트(Select & Dropdown menu) - 파트 1 / selected 토글 버튼
0
48
3
스피너 아이콘 크기 질문
0
50
2
미리보기 빈칸생기는 현상
0
40
2
검색엔진 차단 noindex
0
51
2
7- 상품확대 인터렉션
0
50
3
아이콘 빌런 부분
0
45
2
인스턴스스왑
0
52
2
borderTransparent를 라이트/다크모드에 이중등록
0
47
2
해결되었습니다.
0
37
1
채팅 UI 추가 속성 설정 질문
0
45
1
배리어블 Value에 관해 질문있습니다.
0
79
1
플러터(Flutter) 개발 환경에서 svg 깨짐 현상 해결 방법 문의
0
308
2
색상 파레트 제작 시, 색상 배합 방법 문의
0
136
1