💄 실시간 인기 파견학교 카드 이미지 하단 그라데이션 추가

[manNomi]

Summary

• Figma 노드 4265:39768 (Rectangle 3416) 에서 linear gradient 값을 추출하여 PopularUniversityCard 대학교 이미지 하단에 그라데이션 오버레이 반영

변경 내용

apps/web/src/app/(home)/_ui/PopularUniversitySection/_ui/PopularUniversityCard.tsx

• 이미지 컨테이너 내부에 absolute inset-0 gradient overlay div 추가

Figma 기반 그라데이션 값 (노드 4265:39770)

linear-gradient(
  to bottom,
  rgba(255, 255, 255, 0) 0%,
  rgba(0, 0, 0, 0.35) 75%,
  rgba(0, 0, 0, 0.70) 100%
)

Test plan

• 홈 화면 > 실시간 인기 파견학교 카드 이미지 하단에 그라데이션이 자연스럽게 적용되는지 확인
• 대학교 이름 텍스트 가독성 향상 확인
• 배경 이미지 placeholder 상태에서도 정상 표시 확인

🤖 Generated with Claude Code

[vercel]

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

Project	Deployment	Actions	Updated (UTC)
solid-connect-university-web	Ready	Preview, Comment	Jul 24, 2026 8:59am
solid-connect-web-admin	Ready	Preview, Comment	Jul 24, 2026 8:59am
solid-connection-web	Ready	Preview, Comment	Jul 24, 2026 8:59am

[coderabbitai]

No actionable comments were generated in the recent review. 🎉

ℹ️ Recent review info

⚙️ Run configuration

Configuration used: Repository UI

Review profile: CHILL

Plan: Pro Plus

Run ID: bcc6d570-01d5-4de4-837f-f32773d21ce3

📥 Commits

Reviewing files that changed from the base of the PR and between b2128f3 and 3063004.

⛔ Files ignored due to path filters (2)

• docs/screenshots/gradient-after.png is excluded by !**/*.png
• docs/screenshots/gradient-before.png is excluded by !**/*.png

📒 Files selected for processing (1)

• apps/web/src/app/(home)/_ui/PopularUniversitySection/_ui/PopularUniversityCard.tsx

🚧 Files skipped from review as they are similar to previous changes (1)

• apps/web/src/app/(home)/_ui/PopularUniversitySection/_ui/PopularUniversityCard.tsx

---

Walkthrough

1. **배경 그라디언트 오버레이 추가**  
인기 대학 카드의 배경 이미지 하단 절반에 절대 위치 선형 그라디언트 레이어를 추가해 아래로 갈수록 어두워지도록 변경했습니다.

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

Suggested reviewers: wibaek

🚥 Pre-merge checks | ✅ 5

✅ Passed checks (5 passed)

Check name	Status	Explanation
Title check	✅ Passed	제목이 PopularUniversityCard 이미지 하단 그라데이션 추가라는 핵심 변경을 명확히 담고 있습니다.
Description check	✅ Passed	요약, 변경 내용, 테스트 계획이 갖춰져 있어 대체로 완성도 높지만 관련 이슈와 특이 사항은 비어 있습니다.
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.

✨ 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/current-term-empty-universities

---

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.}

[manNomi]

📸 Before / After

Before (그라데이션 없음)

After (그라데이션 적용)

---

변경 사항

• inset-0 rounded-lg → bottom-0 inset-x-0 h-full rounded-b-lg (하단만 border-radius)
• gradient 방향: to bottom → 180deg (Figma CSS 그대로 반영)
• gradient 값: linear-gradient(180deg, rgba(255, 255, 255, 0.00) 0%, rgba(0, 0, 0, 0.35) 75%, rgba(0, 0, 0, 0.70) 100%)

[manNomi]

📸 Before / After (최종)

Before

After (하단 h-1/2 영역에만 그라데이션)