fix: 멘토 UI 하단 요소 겹침과 날짜 색상 조정

[manNomi]

관련 이슈

• 없음

작업 내용

• 멘토 찾기 목록 하단에 여백을 추가해 마지막 멘토 카드의 상세보기 토글 버튼이 위로가기 버튼과 겹치지 않도록 수정했습니다.
• 멘토 채팅 날짜 구분선 pill 색상을 밝은 회색 배경(bg-k-50)과 진한 회색 텍스트(text-k-600) 조합으로 반전했습니다.

특이 사항

• 기존 SEO PR 브랜치에 얹혀 있던 변경 중 멘토 UI 관련 커밋 2개만 origin/main 기준 새 브랜치로 분리했습니다.
• 로컬 환경은 Node v23.10.0이고 저장소 요구 버전은 Node 22.x라 engine warning이 출력됩니다.

리뷰 요구사항 (선택)

• 멘토 목록 마지막 카드가 펼쳐진 상태에서 하단 floating 위로가기 버튼과 상세보기 토글이 겹치지 않는지 확인 부탁드립니다.
• 채팅 날짜 구분선 색상이 의도한 밝은 회색 계열로 보이는지 확인 부탁드립니다.

검증

• pnpm --filter @solid-connect/web run lint:check 통과
• pnpm --filter @solid-connect/web run typecheck:ci 실패
  • 본 PR 변경 파일 밖의 기존 apps/web/src/app/api/revalidate/route.ts에서 revalidateTag(..., { expire: 0 }) 타입 오류가 발생했습니다.
  • PR diff는 멘토 UI 2개 파일로만 제한했습니다.

[vercel]

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

Project	Deployment	Actions	Updated (UTC)
solid-connection-web	Ready	Preview, Comment	Jun 2, 2026 6:28am

1 Skipped Deployment

Project	Deployment	Actions	Updated (UTC)
solid-connect-web-admin	Skipped		Jun 2, 2026 6:28am

[coderabbitai]

No actionable comments were generated in the recent review. 🎉

ℹ️ Recent review info

⚙️ Run configuration

Configuration used: Repository UI

Review profile: CHILL

Plan: Pro

Run ID: e54ed5f3-5237-43a1-8da2-91a3b11adab8

📥 Commits

Reviewing files that changed from the base of the PR and between df20307 and 1ae8928.

📒 Files selected for processing (2)

• apps/web/src/app/mentor/_ui/MentorClient/_ui/MentorFindSection/index.tsx
• apps/web/src/app/mentor/chat/[chatId]/_ui/ChatContent/index.tsx

---

Walkthrough

이번 PR은 멘토 관련 UI의 두 가지 스타일 개선사항을 포함하고 있습니다.

1. 멘토 리스트 컨테이너의 하단 여백 확장
   멘토 찾기 섹션의 리스트 div 요소에 pb-28 패딩 클래스를 추가하여 목록 하단에 추가 공간을 만들었습니다.

2. 채팅 날짜 구분선의 색상 일관성 개선
   채팅 콘텐츠에서 날짜를 표시하는 구분선의 Tailwind 색상 클래스를 기존 회색 계열(bg-gray-100, text-gray-600)에서 브랜드 계열(bg-k-50, text-k-600)로 업데이트했습니다.

Estimated code review effort

🎯 1 (Trivial) | ⏱️ ~3 minutes

Suggested reviewers

• wibaek
• enunsnv

🚥 Pre-merge checks | ✅ 5

✅ Passed checks (5 passed)

Check name	Status	Explanation
Title check	✅ Passed	PR 제목이 변경사항의 핵심을 명확하게 전달합니다. 멘토 UI의 두 가지 주요 수정 사항(하단 요소 겹침과 날짜 색상 조정)을 간결하게 요약했습니다.
Description check	✅ Passed	PR 설명이 저장소의 템플릿 구조를 따르며 필수 섹션인 '작업 내용'과 '특이 사항'을 충실히 작성했고, 선택사항인 '리뷰 요구사항'도 포함했습니다.
Docstring Coverage	✅ Passed	No functions found in the changed files to evaluate docstring coverage. Skipping docstring coverage check.
Linked Issues check	✅ Passed	Check skipped because no linked issues were found for this pull request.
Out of Scope Changes check	✅ Passed	Check skipped because no linked issues were found for this pull request.

_{✏️ Tip: You can configure your own custom pre-merge checks in the settings.}

✨ Finishing Touches

📝 Generate docstrings

• Create stacked PR
• Commit on current branch

🧪 Generate unit tests (beta)

• Create PR with unit tests
• Commit unit tests in branch fix/mentor-ui-bottom-safe-area

---

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

• X
• Mastodon
• Reddit
• LinkedIn

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