Web 15

[chlgusdn0203]

📌 작업 내용

신청 부원 조회 페이지 구현
신청자 목록 UI 구성
테이블 레이아웃 및 기본 스타일 적용
CSS Modules를 사용하여 페이지 스타일 분리

🔗 관련 이슈

📸 스크린샷 / 화면 녹화

🧪 테스트 방법

1.http://localhost:5173/admin 로 접근
2.
3.

✅ 체크리스트

• npm run lint 통과를 확인했습니다
• npm run format 을 적용했습니다
• 디버깅용 console.log 를 제거했습니다
• 사용하지 않는 import / 변수를 정리했습니다
• 컨벤션 (README.md) 을 준수했습니다
• base 브랜치가 develop 인지 확인했습니다

💬 리뷰어에게 한 마디

[takjinwu]

/gemini review

[gemini-code-assist]

Code Review

This pull request integrates Tailwind CSS into the project, updates global styles and fonts, and implements a detailed applicant management view on the Admin page alongside a redesigned Header component. The review feedback highlights two key areas for improvement: adding a visible label to the empty admin navigation link in the Header, and enhancing the Admin page modal UX by allowing users to close it when clicking on the backdrop.

[gemini-code-assist]

관리자 확인용 임시 메뉴인 NavLink 내부에 텍스트나 자식 요소가 누락되어 있어 화면에 아무것도 표시되지 않습니다. 사용자가 클릭하여 이동할 수 있도록 링크 텍스트(예: <span>지원자 관리</span>)를 추가해 주세요.

Suggested change

	<NavLink
	to={ROUTES.ADMIN_APPLICANTS}
	className={({ isActive }) =>
	isActive ? `${styles.navLink} ${styles.active}` : styles.navLink
	}
	>
	</NavLink>
	<NavLink
	to={ROUTES.ADMIN_APPLICANTS}
	className={({ isActive }) =>
	isActive ? `${styles.navLink} ${styles.active}` : styles.navLink
	}
	>
	<span>지원자 관리</span>
	</NavLink>

[gemini-code-assist]

모달 백드롭(배경) 영역을 클릭했을 때 상세 모달창이 닫히도록 설정하면 사용자 경험(UX)이 향상됩니다. 백드롭에 onClick={handleCloseDetail}을 추가하고, 모달 내부 콘텐츠 영역 클릭 시 이벤트가 상위로 전파되어 모달이 의도치 않게 닫히는 것을 방지하기 위해 onClick={(e) => e.stopPropagation()}을 추가하는 것을 권장합니다.

        <div className={styles.modalBackdrop} onClick={handleCloseDetail} role="presentation">
          <section
            className={styles.modal}
            role="dialog"
            aria-modal="true"
            aria-label="신청 부원 상세 정보"
            onClick={(e) => e.stopPropagation()}
          >