- PC/모바일 각각 사이트 스타일에 맞는 404 페이지 생성
- framer-motion 애니메이션 적용
- PC Layout 수정으로 푸터 하단 고정
- 모바일은 100dvh로 스크롤 없이 전체 화면 사용
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
- 그리드 레이아웃에서 카드 스와이프 스타일로 변경
- 상단 썸네일 인디케이터 추가 (자동 스크롤, 클릭 이동)
- 멤버 페이지 헤더 그림자 제거 (noShadow prop)
- Swiper 라이브러리로 좌우 스와이프 구현
- 카드 그림자 및 레이아웃 최적화
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
- AdminLayout.jsx 컴포넌트 생성 (헤더 고정 + overflow-y-auto)
- AdminDashboard, AdminMembers, AdminMemberEdit에 적용
- AdminAlbums, AdminAlbumForm, AdminAlbumPhotos에 적용
- AdminScheduleCategory, AdminScheduleBots, AdminScheduleForm에 적용
- AdminSchedule은 내부 스크롤 처리로 자동 감지하여 제외
- 화면 고정 레이아웃으로 변경 (h-[calc(100vh-64px)] overflow-hidden)
- grid grid-cols-3 레이아웃으로 변경
- 왼쪽 달력/카테고리 영역 고정, 오른쪽 일정 목록만 스크롤
- Layout.jsx에서 일정 페이지 Footer 숨김 처리
새로 생성된 파일:
- components/admin/ConfirmDialog.jsx (109줄)
- 삭제 확인 등 위험한 작업을 위한 공통 다이얼로그
- Props: isOpen, onClose, onConfirm, title, message, loading, variant 등
수정된 파일:
- pages/pc/admin/AdminAlbums.jsx (60줄 → 15줄)
- pages/pc/admin/AdminSchedule.jsx (70줄 → 17줄)
총 약 100줄의 중복 코드 제거
새로 생성된 파일:
- components/admin/AdminHeader.jsx (47줄)
- 로고, Admin 배지, 사용자 정보, 로그아웃 버튼 포함
수정된 파일:
- pages/pc/admin/AdminMembers.jsx
- AdminHeader import 추가
- 중복 헤더 JSX 제거 (24줄 -> 1줄)
- handleLogout 함수 제거 (5줄)
나머지 9개 Admin 페이지도 동일한 패턴으로 적용 가능
- components/admin/CustomDatePicker.jsx 생성 (269줄)
- AdminMemberEdit에서 중복 제거 (-237줄)
- AdminAlbumForm에서 중복 제거 (-273줄)
- AdminScheduleForm에서 중복 제거 (-349줄)
- 현재 년도/월 표시: 테두리 제거, 글씨색만 유지
- 오늘 날짜: 배경색 제거, 글씨색만 유지
- 요일/일요일/토요일 색상 구분 추가
총 코드 감소: 약 860줄
- index.css: 모바일 레이아웃 CSS 시스템 추가 (mobile-layout-container, mobile-content, mobile-toolbar)
- Layout.jsx: MobileLayout에서 레이아웃 및 body 스크롤 제어 통합
- 하단 네비게이션을 fixed에서 flex-shrink-0으로 변경
- 모바일 스크롤바 숨김 처리
- Home, Members, Album, Schedule 페이지 여백 정리
- 모바일 레이아웃 및 하단 네비게이션 추가
- 홈 페이지: 히어로, 멤버, 앨범(2개), 일정 섹션
- 멤버 페이지: 현재/전 멤버 분리, 상세 모달
- 앨범 페이지: 목록, 상세, 갤러리
- 일정 페이지: 캘린더 피커, 세로 스크롤 목록
- ScrollToTop 컴포넌트로 페이지 이동 시 스크롤 초기화
- PC 홈 일정 API startDate+limit 방식으로 변경
- schedule_members 테이블 분리 (members 컬럼 → 별도 테이블)
- schedules 테이블 컬럼 comment 추가 및 순서 정리
- 상세주소(location_detail) 필드 추가
- 장소 검색 UI 개선 (탭 제거 → 입력 필드+검색 버튼 병합)
- 카카오 장소 검색 API 프록시 추가 (/api/admin/kakao/places)
- 백엔드 CRUD API 구현 (GET/PUT/DELETE /schedules/:id)
- 프론트엔드 삭제 기능 및 확인 다이얼로그 추가
- 프론트엔드 수정 모드 지원 (기존 데이터 로드)
- 일정 카테고리 CRUD API 추가 (backend/routes/admin.js)
- AdminScheduleCategory 페이지 신규 추가
- 카테고리 추가/수정/삭제 기능
- 드래그 앤 드롭 정렬 (framer-motion Reorder)
- react-colorful 기반 커스텀 색상 선택기
- 중복 카테고리 체크
- AdminScheduleForm에 동적 카테고리 로드 기능 추가
- 삭제 다이얼로그 앨범 스타일로 통일 (AlertTriangle 아이콘, 경고 메시지)
- Toast 컴포넌트 exit 애니메이션 수정
- 토스트 3초 자동 닫힘 기능 추가
- AdminSchedule, AdminScheduleForm 페이지 추가
- 커스텀 타임피커 구현 (오전/오후 지원, 드래그/휠 스크롤)
- Lightbox 공통 컴포넌트 분리 (components/common/Lightbox.jsx)
- 이미지 드래그 앤 드롭 정렬 기능
- 이미지 삭제 확인 다이얼로그
- 이미지 추가 버튼 첫번째 위치 고정
- 일정 이미지 순서 번호 표시
- react-ios-time-picker 라이브러리 CSS 제거
- 컨셉 포토 갤러리 페이지 추가 (AlbumGallery.jsx)
- react-photo-album 라이브러리로 Justified 레이아웃 구현
- 썸네일/원본 이미지 분리 (thumb_400, original 폴더)
- 라우터 변경: /discography → /album
- URL 형식 변경: ID 기반 → 앨범명 기반 (/album/하얀 그리움)
- 앨범명 기반 API 추가 (/api/albums/by-name/:name)
- 브레드크럼 스타일 네비게이션 적용
- 라이트박스 슬라이드 애니메이션 추가
- 점 형태 인디케이터로 변경
- 앨범 상세 페이지 (AlbumDetail.jsx) 신규 생성
- 앨범 목록에서 클릭 시 상세 페이지로 이동
- 소개글/트랙 리스트 2열 그리드 레이아웃
- 트랙 호버 효과 및 총 재생시간 표시
- 페이지 전환 fade 애니메이션 적용
- '디스코그래피' -> '앨범' 텍스트 변경
- albums 테이블 description 컬럼 추가
- 트랙 duration 데이터 입력