🤖
1050 in / 701 out / 1751 total tokens
v0.40.0은 사용자 경험의 디테일을 챙긴 업데이트다. 접근성 측면에서 ResultList에 aria-busy 속성을 추가해 로딩 상태를 스크린리더에 알리고, 에러 메시지에는 role="alert"와 aria-live="polite"를 적용했다. 키보드 포커스 표시기도 개선했다. :focus-visible에 3px 아웃라인과 2px 오프셋을 줘서 키보드 탐색 시 명확하게 보이도록 했다.
UX 측면에서는 카드 인터랙션을 다듬었다. 모바일에서는 active 상태에 scale(0.98)을 적용해 터치 피드백을 주고, 데스크톱에서는 hover 효과를 개선했다. 미디어 쿼리로 hover 지원 여부에 따라 다르게 적용했다.
/* 키보드 포커스 표시기 */
:focus-visible {
outline: 3px solid var(--kakao-primary, #3274F9);
outline-offset: 2px;
border-radius: 4px;
}
/* 터치 디바이스에서는 focus-visible만 */
@media (hover: none) {
:focus:not(:focus-visible) {
outline: none;
}
}모두 712개 테스트 통과, 타입 에러 제로. 작지만 의미 있는 개선이다.