유저 체감 개선이 확실치 않고 오히려 버벅임 느낌이 남아있어 관련 6개
커밋 (d1764de, 1344a2f, 48f43ec, f5c5c69, 670d8ab, f63c1e0) 을 git revert.
StaggerGroup 컴포넌트 제거, Feature/Admin 페이지의 Suspense 스피너 복원,
보스 리스트의 border 구조 원복.
prefetch(7ebfe4a), backdrop-blur 제거(669b358), font-display optional
(6e2159c) 은 애니메이션 무관한 최적화라 유지.
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
Chrome DevTools의 레이아웃 변경 원인 분석 결과 애니메이션 × 3이 CLS 0.17의
주요 원인으로 지목됨. translateY 애니메이션을 레이아웃 변경으로 카운트하는
케이스가 있음.
- StaggerGroup: y:30 → scale:0.97 로 변경. scale/opacity는 compositor-only
속성이라 layout/paint 없이 GPU만 사용
- BossCrystal 루트 애니메이션도 동일하게 scale 기반으로 변경
- 자식 motion.div에 will-change: transform, opacity 명시적 추가
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
- initial y:30, duration 0.4 복원하되 will-change: transform, opacity
명시해 GPU 레이어 승격 확실히
- delay 0.03초 추가해 첫 프레임 레이아웃 안정화 후 애니메이션 시작
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
- BossCrystal 루트 애니메이션을 y 이동 없는 opacity fade (0.3s)로 단순화.
외부 transform과 내부 stagger 애니메이션이 동시에 돌면서 합성 단계가
겹치던 부하 제거
- will-change: opacity 힌트 추가해 GPU 레이어 승격 명시
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
- FeaturePage / AdminFeaturePage의 Suspense fallback 스피너를 null로 변경
- components/common/StaggerGroup: 자식을 각 motion.div로 감싸 순차
페이드인 (staggerChildren 0.07s, duration 0.35s, ease 0.22,1,0.36,1)
- Liberation(Genesis/Destiny), Symbol 페이지 root를 StaggerGroup으로 교체
- BossCrystal은 grid 레이아웃 특성상 root 전체를 motion.div로 감싸 fade-in
- hover prefetch와 함께 chunk 로드 시 깜빡임 없이 자연스럽게 등장
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
index.css 의 전역 button:disabled { cursor: not-allowed } 규칙과 개별
컴포넌트의 disabled:cursor-not-allowed / cursor-not-allowed 클래스를 모두
제거해 비활성 상태에서 기본 화살표 커서를 유지한다. opacity 등 기존 시각
피드백은 유지.
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
- features/boss-crystal/pc/user/BossSelector.jsx:
* 목록 스크롤을 기본 overflow-y-auto → OverlayScrollbarsComponent
* 메인 바디와 동일한 os-theme-maple os-theme-dark 테마
* 헤더와 목록 좌우에 8px씩 추가 여백 (스크롤바와 내용 간격)
* 헤더 행과 목록 row의 컬럼 정렬이 어긋나지 않도록 동기
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
- 푸터를 홈 경로에서만 렌더링 (!fullscreen → isHome)
이동 시 푸터가 잠깐 보였다 사라지는 플래시 제거
- 심볼 관리 타입 배지(아케인/어센틱/그랜드 어센틱) 테마별 토큰화
라이트 모드에서 violet/sky/amber-300이 흰 배경에 안 보이던 문제 해결
- 계산기 페이지의 fullscreen 훅을 useLayoutEffect로 변경
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
- API 키 로그인 다이얼로그 + 헤더 로그인 버튼
- /api/character/list 프록시 엔드포인트 (월드 아이콘 매핑 포함)
- 캐릭터 입력 포커스 시 드롭다운 (월드 아이콘, 레벨 정렬, 기존 캐릭 제외, 페이드 애니메이션)
- 관리자 인증을 API 키로 통합 (URL ?key= 파라미터 폐기)
- 헤더에 관리자 링크 버튼 / 홈 링크 버튼 (경로별 배타적 표시)
- 관리자 페이지에서 타이틀 우측에 "관리자" 텍스트
- 이미지 관리 페이지 테마 토큰화
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
- ConfirmDialog 전체를 dialog/icon/ring/danger-btn 토큰으로 이관
- 캐릭터 닉네임 입력의 transition 제거로 테마 전환 시 검은색 플래시 해결
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
- Select/Tooltip 공통 컴포넌트 테마 대응
- BossCrystal 루트/CharacterPanel/BossSelector 전체 이관
- 비활성 row/난이도 버튼 테마별 처리 (--disabled-opacity, --inactive-filter)
- 라이트 테마 warning 색상 갈색 → 주황 계열로 조정
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
- 해방: 현재 진행 상태의 흔적 입력 우측에 / N 필요량 표시 (관리자 경로 입력 스타일, text-base)
- 해방: 날짜/퀘스트/흔적 3열을 1:1:1 균등 비율로 정렬
- 주차별 계산 헤더 분모를 6500 고정 → 현재 진행 기준 남은 흔적
- 보스/메뉴 관리자 폼 mx-auto 중앙 정렬
Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
보스 수익 계산기/심볼 계산기에서 저장된 캐릭터의 character_image, level,
직업 정보를 페이지 로드마다 /api/character/search로 재조회해 반영.
Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
- 해방 주간 보스 설정 헤더: 단순 계산에선 합산만, 주차별에선 주간+월간/6500 분할 표시
- 보스 수익 계산기 캐릭터 카드의 보스 아이콘을 보스 목록 순서로 정렬 (12개 상한은 여전히 수익 기준으로 선발)
Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
이미지가 흐릿한 문제 해결. DIFFICULTIES 색상값을 사용해
EASY/NORMAL/HARD/CHAOS/EXTREME pill 버튼으로 직접 렌더링.
- 선택 시: 색상 풀톤
- 비선택 시: filter brightness(0.4)로 어둡게만 처리
- 크기 고정 (h-7 px-4)
- 브라우저 툴팁 제거
Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
카드 전체가 드래그 리스너를 잡고 있어 태블릿에서 세로 스크롤이
불가능했던 문제 해결. useDragControls로 왼쪽 핸들 영역에서만
드래그가 시작되도록 변경.
Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
- 커스텀 Tooltip 컴포넌트 (portal, fadeIn, 자동 위치 보정)
- 헤더에 현재 메뉴 제목 표시 (브레드크럼 스타일)
- 브라우저 탭 제목 자동 동기화
- 캐릭터 닉네임 검색 입력 강조 (아이콘, 두꺼운 테두리, 그림자)
- 결정 개수 강조 (큰 폰트, amber 색상)
Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
레이아웃:
- 풀스크린 모드 컨텍스트 (BossCrystal 페이지에서 푸터 숨김 + viewport 고정)
- 캐릭터 패널: 자연 높이 + viewport 한도 + 내부 목록 스크롤
- 보스 패널: 헤더 고정 + 목록 내부 스크롤
- 커스텀 스크롤바 (전역)
캐릭터 패널:
- framer-motion Reorder로 드래그앤드롭 정렬
- 가로 캐릭터 행 + 6x2 보스 그리드 + 난이도 영문 첫글자 뱃지
- 총 수익에 ResizeObserver 기반 자동 폰트 fit
- 캐릭터 삭제 시 첫번째 자동 선택, 입력 재개 시 에러 메시지 자동 제거
기능:
- 공개 보스/캐릭터 API 추가
- API 키 라이브 키로 변경
Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
- @dnd-kit으로 드래그앤드롭 정렬 구현
- DragOverlay 패턴으로 부드러운 드래그 애니메이션
- 드롭 시 즉시 UI 반영 + reorder API 호출
- React 19 peer dep 충돌 해결을 위해 npm install --legacy-peer-deps 사용
Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
- 최대 인원수를 보스 단위로 통합 (난이도별 → 보스 공통)
- 가격 입력 시 쉼표 자동 표시 (text + inputMode=numeric)
- registry 캐싱으로 sub-route 변경 시 화면 갱신 안되던 버그 수정
Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
- 보스 추가/편집/삭제 폼 (이름, 이미지, 난이도별 가격/인원)
- BossList: 등록된 보스 카드 목록 + 추가 버튼
- 동적 라우트가 sub-path 지원하도록 변경 (:slug/*)
- 커스텀 Checkbox/Select 컴포넌트
- number input 화살표 전역 제거
- 가격 입력 시 메소 단위 미리보기 표시
- 결정석 → 결정으로 용어 통일
Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
- features/registry.js: import.meta.glob으로 자동 컴포넌트 등록
- /:slug → features/{slug}/{PascalCase}.jsx 매핑
- /admin/:slug → features/{slug}/{PascalCase}Admin.jsx 매핑
- AdminHome 카드 분리 액션 (본체→기능 관리, ⚙→메뉴 정보 편집)
- AdminFeaturePage에 메뉴 정보 편집 단축 링크 추가
- 예시: features/boss-crystal/ stub 컴포넌트
Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
