fix(ui): boy happy state, mobile jump arc, and mobile feature grid

[nitinmohan18]

Pull Request

Summary

This PR introduces critical performance optimizations, UI/UX polish across mobile and desktop, and resolves strict CI type-checking and linting failures. It addresses severe scroll/zoom lag in Light Mode and enhances the University Flow animations for mobile device compatibility.

---

Related Issue

Closes #

---

Type of Change

• Feature
• Bug Fix
• Documentation
• Refactor
• Performance Improvement
• CI / Build
• Other

---

What Changed?

• Performance Optimization: Eradicated extreme scroll and pinch-to-zoom lag in Light Mode by removing expensive CSS blending filters (mix-blend-overlay / mix-blend-multiply) and applying transform-gpu for hardware acceleration on background blobs.
• Animation Polish: Fixed an animation glitch where the boy would prematurely raise his hands mid-jump by prioritizing the jump completion before triggering the isHappy state.
• Mobile Compatibility: Replaced the unreliable CSS WebkitMaskImage jumping arc with a mathematically precise, cross-browser compatible SVG <motion.path> animation, fixing the invisible jumping arc on mobile/iOS.
• Responsive Layout: Refactored the University hero features (Semester-wise Subjects, etc.) into a clean 2x2 grid (grid-cols-2) on mobile screens to prevent messy vertical stacking.
• UI Tweaks: Reduced the excessive vertical padding between the stats layout and the university track, creating a tighter and more cohesive hero layout.
• CI / Pipeline Fixes: Resolved strict Framer Motion TypeScript compilation errors during Vercel deployment, and addressed automated AI PR feedback regarding the mobile separator placement.

---

Screenshots (UI Changes Only)

(Attach screenshots or screen recordings showing the fixed mobile grid, the visible SVG jump arc, and the smooth jumping animations here)

---

Testing

• Verified that zooming in/out on the PremiumAnimatedBoy and Light Mode backgrounds no longer causes the browser to freeze.
• Tested the University flow track on mobile views to ensure the SVG jumping arc renders and the 2x2 feature grid aligns correctly.
• Ran npm run lint, npm run format:check, and npm run typecheck locally to confirm 0 errors/warnings before pushing.

---

Checklist

• My branch is up to date with the latest main.
• My code follows the project's coding standards.
• I have formatted the modified files (npx prettier --write <file>).
• npm run format:check passes.
• npm run lint passes.
• npm run typecheck passes.
• npm run build passes.
• I have updated documentation if required.
• I have tested my changes locally.
• This Pull Request focuses on a single feature or fix.

---

Additional Notes

Temporary ESLint overrides (eslint-disable-next-line @typescript-eslint/no-explicit-any) were explicitly added to bypass Framer Motion's strict Easing and Variants type limitations on custom bezier curves and webkit-prefixed animation attributes. This guarantees the CI pipeline stays green without compromising functionality.

[vercel]

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

Project	Deployment	Actions	Updated (UTC)
hyper-learning-tech	Ready	Preview, Comment	Jul 13, 2026 11:28am

[coderabbitai]

Warning

Review limit reached

@nitinmohan18, you've reached your PR review limit, so we couldn't start this review.

Next review available in: 26 minutes

Enable usage-based reviews in Billing to review now. Otherwise, wait until the next included review is available.
You're only billed for reviews past your plan's rate limits ($0.25/file).

How can I continue?

After more reviews become available, a review can be triggered using the @coderabbitai review command as a PR comment. Alternatively, push new commits to this PR.

To avoid repeated limits, reduce automatic review volume by pausing incremental auto-reviews earlier, using label-based review opt-in, excluding WIP or generated PR titles, or requesting reviews manually when the PR is ready. If your team needs uninterrupted high-volume reviews, an organization admin can enable usage-based reviews.

How do review limits work?

CodeRabbit enforces per-developer PR review limits for each organization. Most developers receive the normal plan review availability.

For paid Pro and Pro+ PR reviews, CodeRabbit uses adaptive limits for sustained high-volume activity. When a developer's recent PR review activity reaches the 95th percentile or higher among CodeRabbit users, additional reviews become available more gradually as earlier reviews age out of the rolling window.

Please refer docs for additional details.

Review details

⚙️ Run configuration

Configuration used: defaults

Review profile: CHILL

Plan: Pro

Run ID: 13399b2a-5d4f-452b-8e5e-a97ba3550f9e

📥 Commits

Reviewing files that changed from the base of the PR and between ccfde7f and 02476e1.

📒 Files selected for processing (3)

• components/university/premium-animated-boy.tsx
• components/university/university-flow-banner.tsx
• components/university/university-hero.tsx

✨ Finishing Touches

🧪 Generate unit tests (beta)

• Create PR with unit tests
• Commit unit tests in branch rgpv-se

---

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

[github-actions]

🎉 Congratulations @nitinmohan18!

Thank you for contributing to HyperLearningTech.

Your pull request has been successfully merged into main.

📦 Merge Summary

• PR: fix(ui): boy happy state, mobile jump arc, and mobile feature grid #101 - fix(ui): boy happy state, mobile jump arc, and mobile feature grid
• Status: ✅ Merged
• Repository: HyperLearningTech

🚀 Keep Contributing

• Follow the CONTRIBUTING.md guidelines.
• Keep each Pull Request focused on a single feature or fix.
• Run formatting, linting, type checking, and a production build before opening a PR.

Thank you for helping make HyperLearningTech better.

Happy Coding! 🚀