landing: three more tutorials, mobile navbar + hero CTA fixes

[jamiepine]

Summary

• Add three new tutorial cards to the landing page (Danish Sofi, StinkyScrublet, mikbes)
• Fix mobile navbar: Donate button now visible, both CTAs sit on the right edge (was showing Star button near center)
• Fix hero CTAs: Download + GitHub stay side-by-side on mobile instead of stacking vertically

Test plan

• Navbar renders logo-left / buttons-right on mobile, three-column on sm+
• Hero CTAs render in a row on all viewports
• Six tutorial cards render (2 rows of 3 on md+)

🤖 Generated with Claude Code

---

Note

Low Risk
Low risk: only landing-page content additions and Tailwind layout tweaks that affect responsive rendering but not data/auth logic.

Overview
Improves the landing page’s mobile layout by keeping the hero CTAs side-by-side and adjusting navbar structure so the right-side buttons align correctly on small screens (including showing the Donate button on mobile).

Expands the Tutorials section by adding three additional YouTube tutorial cards (new IDs/thumbnails/authors).

^{Reviewed by Cursor Bugbot for commit 42b12d0. Configure here.}

Summary by CodeRabbit

• New Features

  • Added three new tutorial videos to the tutorials section.

• Style

  • Enhanced mobile navigation by displaying an additional action button on small screens.
  • Refined call-to-action button spacing for improved visual hierarchy.

[coderabbitai]

Caution

Review failed

The pull request is closed.

ℹ️ Recent review info

⚙️ Run configuration

Configuration used: defaults

Review profile: CHILL

Plan: Pro

Run ID: 04c2e0db-8674-4c89-a5c3-09220f898fdc

📥 Commits

Reviewing files that changed from the base of the PR and between 3c1e851 and 42b12d0.

⛔ Files ignored due to path filters (3)

• landing/public/tutorials/PyMx4L9mky4.jpg is excluded by !**/*.jpg
• landing/public/tutorials/RRRBxNXgeKQ.jpg is excluded by !**/*.jpg
• landing/public/tutorials/yu9QHqOEqqA.jpg is excluded by !**/*.jpg

📒 Files selected for processing (3)

• landing/src/app/page.tsx
• landing/src/components/Navbar.tsx
• landing/src/components/TutorialsSection.tsx

---

📝 Walkthrough

Walkthrough

The landing page received layout refinements: hero section CTA spacing was adjusted from gap-4 to responsive gap-3 with sm:gap-4 override; navbar restructured from grid to flex layout with responsive grid at breakpoint; and the Donate button now displays on all screen sizes instead of being hidden on mobile.

Changes

Cohort / File(s)	Summary
Hero & Navigation Layout landing/src/app/page.tsx, landing/src/components/Navbar.tsx	Adjusted CTA spacing behavior in hero section; restructured navbar from CSS grid to flex layout (flex with items-center justify-between), introducing responsive grid behavior at sm breakpoint and making Donate button always visible.
Tutorial Content landing/src/components/TutorialsSection.tsx	Added three new tutorial entries to the TUTORIALS array (yu9QHqOEqqA, RRRBxNXgeKQ, PyMx4L9mky4) with titles, authors, and thumbnail paths.

Estimated code review effort

🎯 2 (Simple) | ⏱️ ~12 minutes

Poem

🐰 Hop and leap, the spacing's tight,
Flex and grid dance left and right,
Donate button shines so bright,
Tutorials bloom in morning light,
Landing page feels fresh and right! ✨

✨ 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 landing/mobile-nav-tutorials

---

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