[Fix] 마이페이지 보유 자금 카드의 이번주 증감을 잔액과 나란히 정렬

[whghdus]

📌 관련 이슈

• Closes [Fix] 마이페이지 보유 자금 카드의 이번주 증감을 잔액과 나란히 정렬 #234

🏷️ PR 타입

• 🎨 스타일/마크업 변경 (Style)

🖥 관련 화면

• SCR-13: 마이페이지 메인 (ApBalanceCard)

📝 작업 내용

• [Fix] 마이/일기 상단 보유 자금 카드의 이번주 증감 정렬 개선 #224 (PR [Fix] 보유 자금 카드의 이번주 증감 정렬 개선 #225)에서 "이번주 +N원"을 "보유 자금" 라벨과 같은 행으로 옮겼는데, 실제로는 잔액과 나란히 두는 편이 더 읽기 자연스러워 다시 조정
• "보유 자금" 라벨을 단독 1행으로 분리
• 잔액("138만원" + 충전 버튼)과 "이번주 +148만원" 증감을 같은 행에 좌우로 배치 (items-baseline으로 기준선 정렬)

📸 스크린샷 (UI 변경 시 필수)

Before	After
"보유 자금" 옆에 "이번주 +148만원", 그 아래 줄에 "138만원"	"보유 자금" 단독 1행, 아래 "138만원"과 "이번주 +148만원"이 나란히

✅ 체크리스트

공통

• 셀프 리뷰를 완료했습니다
• pnpm lint / pnpm typecheck 를 통과했습니다
• 브랜치명 컨벤션을 준수했습니다 (fix/234-mypage-balance-delta-align)

UI / 스타일 변경 시

• 모바일 우선으로 확인했고, 데스크탑에서도 깨지지 않습니다
• 색상·타이포에 디자인 토큰을 사용했습니다

🤖 Generated with Claude Code

Summary by CodeRabbit

• 스타일
  • 잔액 카드에서 ‘보유 자금’ 라벨과 증감 정보를 같은 행에 표시합니다.
  • 잔액 금액과 충전 버튼을 별도 행으로 배치해 가독성을 개선했습니다.
  • 충전 버튼 표시 조건과 금액 포맷팅, 기간별 증감 표시 방식은 기존과 동일합니다.

[vercel]

The latest updates on your projects. Learn more about Vercel for GitHub.

Project	Deployment	Actions	Updated
brifo-front	Ready	Preview	Sep 19, 2026 10:27am UTC

[coderabbitai]

No actionable comments were generated in the recent review. 🎉

ℹ️ Recent review info

⚙️ Run configuration

Configuration used: Repository: Team-BRIFO/BRIFO-front/.coderabbit.yaml

Review profile: CHILL

Plan: Essentials

Run ID: 571caaff-6b7c-4b15-8947-78d30fbd989a

📥 Commits

Reviewing files that changed from the base of the PR and between 8aa02aa and 2958453.

📒 Files selected for processing (1)

• src/components/domain/ap/ApBalanceCard.tsx

Included review availability: 3 reviews are currently available. Your included PR review attempts over the past 7 days set your current allowance at 5 reviews per hour.

---

Walkthrough

ApBalanceCard의 레이아웃을 변경했습니다. 보유 자금 라벨을 상단에 배치하고, 잔액과 조건부 충전 버튼을 별도 행에 배치했습니다. 금액 포맷팅과 기간별 증감 표시 로직은 유지했습니다.

Changes

보유 자금 카드 레이아웃

Layer / File(s)	Summary
잔액 카드 표시 구조 변경 src/components/domain/ap/ApBalanceCard.tsx	보유 자금 라벨을 상단으로 이동했습니다. 잔액과 조건부 충전 버튼을 별도 행에 배치했습니다. 기존 금액 포맷팅과 기간별 증감 표시 로직은 변경하지 않았습니다.

Priority: ⬇️ Low

Estimated code review effort: 1 (Trivial) | ~5 minutes

Change: Bug fix · Severity of issue fixed: Low

🚥 Pre-merge checks | ✅ 5

✅ Passed checks (5 passed)

Check name	Status	Explanation
Description Check	✅ Passed	Check skipped - CodeRabbit’s high-level summary is enabled.
Title check	✅ Passed	제목은 ApBalanceCard에서 이번 주 증감 표시를 잔액과 나란히 정렬하는 핵심 변경을 정확하게 설명합니다.
Linked Issues check	✅ Passed	직접 연결된 이슈 #234의 요구사항은 ApBalanceCard를 1행의 “보유 자금” 라벨과 2행의 잔액·이번주 증감 좌우 정렬 구조로 재구성하는 것입니다. 변경 diff는 라벨을 별도 행으로 이동하고, 잔액 및 기존 deltaLabel을 같은 justify-between 행에 배치합니다. 충전 버튼의 조건부 표시와 금액 포맷팅도 유지합니다.
Out of Scope Changes check	✅ Passed	변경은 src/components/domain/ap/ApBalanceCard.tsx의 레이아웃 재배치에 한정됩니다. 충전 동작, 금액 포맷팅, 기간별 증감 표시 로직과 공개 선언은 변경하지 않았습니다. #234의 범위를 벗어난 변경은 확인되지 않습니다.
Docstring Coverage	✅ Passed	Docstring coverage is 100.00% which is sufficient. The required threshold is 80.00%. Docstring coverage is scoped to functions touched by this diff. Analyzed 1 functions across 1 files.

✨ Finishing Touches

📝 Generate docstrings

• Commit to this branch
• Create a new PR

🧪 Generate unit tests (beta)

• Commit to this branch
• Create a new PR

---

_{Comment @coderabbitai help to get the list of available commands.}