# Windows 호환성 개선 계획서

> 작성일: 2026-02-26
> 배경: macOS 개발환경 → Windows 공장 PC 사용자 환경 차이로 인한 이슈
> 상태: 계획 단계

---

## 완료된 작업

- [x] Popover 계열 컴포넌트 Windows 포커스 이슈 수정 (6개 파일)
  - `ui/date-picker.tsx` — onPointerDownOutside/onInteractOutside 방어
  - `ui/time-picker.tsx` — 동일
  - `ui/date-range-picker.tsx` — 동일
  - `ui/multi-select-combobox.tsx` — 동일
  - `ui/searchable-select.tsx` — 동일
  - `molecules/ColumnSettingsPopover.tsx` — 동일
- [x] 삭제 버튼 아이콘 X → Trash2 통일 (23개 파일)

---

## Phase 1: IMPORTANT — 사용자 체감 영향 큰 항목

### 1-1. backdrop-filter 성능 최적화
- **파일**: `src/app/globals.css` (line 269-280)
- **문제**: `backdrop-filter: blur()` 가 Windows GPU에서 비효율적 → 공장 PC에서 스크롤 버벅거림
- **영향 범위**: `.clean-glass` 클래스 사용하는 전체 레이아웃 (Sidebar, Login 등)
- **수정 방향**:
  - `prefers-reduced-motion` / `prefers-reduced-transparency` 미디어쿼리로 분기
  - 성능 낮은 환경에서는 `backdrop-filter: none` + 불투명 배경 대체
- [ ] globals.css `.clean-glass` 수정
- [ ] 적용된 컴포넌트에서 시각적 변화 확인

### 1-2. 폰트 굵기 렌더링 차이 보정
- **파일**: `src/app/globals.css` (line 219-235), `src/app/[locale]/layout.tsx` (line 14-19)
- **문제**: Windows 폰트 렌더링이 macOS보다 ~0.5-1.5 weight 더 굵게 표시 (Pretendard 변수 폰트)
- **영향 범위**: 전체 UI 텍스트
- **수정 방향**:
  - `-webkit-font-smoothing: antialiased` 확인 (이미 적용됨)
  - `font-weight: 400` 명시적 지정
  - 필요 시 Windows에서 `font-weight: 350` 적용 검토 (변수 폰트이므로 가능)
- [ ] 현재 폰트 설정 확인
- [ ] Windows에서 시각 비교 테스트 후 보정값 결정
- [ ] globals.css 수정

### 1-3. 스크롤바 동작 차이
- **파일**: `src/app/globals.css` (line 332-412), `src/layouts/AuthenticatedLayout.tsx` (line 173-197)
- **문제**: macOS는 스크롤바 자동 숨김, Windows는 항상 표시 → 투명→페이드인 방식이 어색
- **영향 범위**: 모든 스크롤 가능한 영역
- **수정 방향**:
  - 스크롤바 thumb을 기본 살짝 보이게 (`rgba(0,0,0,0.1)`)
  - `.is-scrolling` 시 진하게 (`rgba(0,0,0,0.2)`) 유지
  - 너비 8px → 10-12px 로 Windows 기대치에 맞게 조정 검토
- [ ] globals.css 스크롤바 스타일 수정
- [ ] Windows에서 시각 확인

### 1-4. 숫자 포맷 locale 명시
- **파일**: `src/app/[locale]/(protected)/sales/order-management-sales/[id]/edit/page.tsx` (line 65-68)
- **문제**: `toLocaleString(undefined, ...)` → Windows 지역 설정에 따라 포맷 달라짐
- **영향 범위**: 해당 페이지 숫자 표시 (다른 곳에도 동일 패턴 있는지 추가 검색 필요)
- **수정 방향**:
  - `undefined` → `'ko-KR'` 명시적 locale 지정
  - 프로젝트 전체에서 동일 패턴 일괄 검색 후 수정
- [ ] `toLocaleString(undefined` 패턴 전체 검색
- [ ] locale을 `'ko-KR'`로 일괄 변경

---

## Phase 2: MINOR — 안정성/효율성 개선

### 2-1. number input 스피너 버튼 숨김
- **파일**: 품질관리 문서 등 `input[type="number"]` 사용처
- **문제**: Windows에서 ↑↓ 스피너 버튼 표시 → 터치스크린에서 실수 클릭
- **수정 방향**: 전역 CSS로 스피너 숨김 처리
- [ ] globals.css에 `input[type="number"]` 스피너 숨김 CSS 추가

### 2-2. 클립보드 API 에러 핸들링
- **파일**: `src/app/[locale]/(protected)/dev/component-registry/ComponentRegistryClient.tsx` (line 44-48)
- **문제**: `navigator.clipboard.writeText()` 가 Windows 보안 정책으로 실패 가능
- **수정 방향**: try-catch + `document.execCommand('copy')` fallback
- [ ] 클립보드 사용 코드 에러 핸들링 추가

### 2-3. 출퇴근 시계 갱신 주기 최적화
- **파일**: `src/app/[locale]/(protected)/hr/attendance/page.tsx` (line ~170-180)
- **문제**: `setInterval(1000)` 매초 갱신 → 공장 PC CPU 부하
- **수정 방향**: 날짜만 표시하므로 60초 간격으로 변경
- [ ] setInterval 주기 1초 → 60초로 변경

---

## 테스트 체크리스트

모든 수정 후 Windows 환경에서 확인:

- [ ] DatePicker: Dialog 안에서 날짜 선택 → 값 정상 입력
- [ ] DatePicker: 이전/다음달 날짜 클릭 → 팝업 유지, 월 이동
- [ ] TimePicker: Dialog 안에서 시간 선택 → 정상 동작
- [ ] 스크롤: 메인 레이아웃 + 테이블 스크롤 부드러움 확인
- [ ] 폰트: 텍스트 두께가 macOS와 비슷한 수준인지 확인
- [ ] 숫자 포맷: 천단위 구분자, 소수점 정상 표시
- [ ] number input: 스피너 버튼 안 보이는지 확인

---

## 참고

- Windows 공장 PC 사양: 보통 중저사양 (Intel i3-i5, 8GB RAM, 내장 GPU)
- 브라우저: Chrome 또는 Edge (Chromium 기반)
- 터치스크린 사용 가능성 있음
