BabyPaunch 프로젝트 지침
데이터 표시
- 블로그, policies와 일반 페이지를 포함한 사이트의 모든 영역에서 Markdown 표와
<table>을 사용하지 않는다.
- 비교 정보, 진행 과정, 설정값과 변경 이력은
.data-cards 안의 .data-card 항목으로 표현한다.
- 각 카드는 내용을 구분하는 제목을 포함하고, 세부 항목은
<p><strong>라벨:</strong> 값</p> 형식을 사용한다.
- 짧은 항목이 반복될 때만
.data-cards-compact를 추가한다.
- 한국어와 영어 페이지는 카드 순서, 제목과 문단의 태그 구조를 일치시킨다.
- 표와 카드를 함께 유지하거나 화면 크기에 따라 표를 카드로 바꾸는 이중 구조를 만들지 않는다.
검증
- Jekyll 빌드 후
node _tests/site-quality.test.js를 실행해 모든 렌더링 페이지에 <table>이 없는지 확인한다.
- 블로그 내용이 바뀌면
node _tests/article-translation.test.js로 한·영 의미 블록 순서를 확인한다.
- 카드 UI는 iPhone SE 기준
375px과 공통 경계값 640px, 641px, 1280px, 1281px에서 페이지 및 카드 내부의 가로 넘침이 없는지 검증한다.