Enhanced topmate section and fixed the inconsistencies issue#704 #735

Condition00 · 2025-10-03T16:59:04Z

Description

Enhanced and changed the ui of topmate section, made the ui of carousel and pagination better.

Fixes #704

Type of Change

Bug fix (non-breaking change that fixes an issue)
UI/UX improvement (design, layout, or styling updates)

Changes Made

Remodeled entire topmate section, fixed the pagination with better styling and removed inconsistencies.

Dependencies

No new dependencies used.

Checklist

My code follows the style guidelines of this project.
I have tested my changes across major browsers and devices
My changes do not generate new console warnings or errors .
I ran npm run build and attached screenshot(s) in this PR.
This is already assigned Issue to me, not an unassigned issue.

Screen.Recording.2025-10-03.222002.mp4

vercel · 2025-10-03T16:59:10Z

@Condition00 is attempting to deploy a commit to the recode Team on Vercel.

A member of the Team first needs to authorize it.

github-actions · 2025-10-03T16:59:14Z

Thank you for submitting your pull request! 🙌 We'll review it as soon as possible. The estimated time for response is 5–8 hrs.

In the meantime, please provide all necessary screenshots and make sure you run - npm build run , command and provide a screenshot, a video recording, or an image of the update you made below, which helps speed up the review and assignment. If you have questions, reach out to LinkedIn. Your contributions are highly appreciated!😊

Note: I maintain the repo issue every day twice at 8:00 AM IST and 9:00 PM IST. If your PR goes stale for more than one day, you can tag and comment on this same issue by tagging @sanjay-kv.

We are here to help you on this journey of open source. Consistent 20 contributions are eligible for sponsorship 💰

🎁 check our list of amazing people we sponsored so far: GitHub Sponsorship. ✨

📚Your perks for contribution to this community 👇🏻

Get free Consultation use code recode50 to get free: Mentorship for free.
Get the Ebook for free use code recode at checkout: Data Science cheatsheet for Beginners.
Check out this weekly Newsletter: Sanjay's Newsletter.

If there are any specific instructions or feedback regarding your PR, we'll provide them here. Thanks again for your contribution! 😊

github-actions · 2025-10-03T16:59:15Z

Synced data from Linked Issues

Labels:

full-test-needed
level 1
recode
hacktoberfest-accepted

Assignees:

Condition00

Milestones:

recode:launch 3.0

Copilot

Pull Request Overview

This PR enhances the TopMate section UI and fixes inconsistencies in the testimonials carousel. The changes focus on improving responsive design, modernizing visual styling, and creating a more cohesive user experience across components.

Redesigned TopMate card with improved responsive layout and modern styling
Enhanced testimonial carousel with better pagination controls and consistent spacing
Updated typography and color schemes to use purple/pink gradient themes

Reviewed Changes

Copilot reviewed 4 out of 4 changed files in this pull request and generated 3 comments.

File	Description
src/components/topmate/TopMateSection.tsx	Added responsive padding and max-width constraints for better layout
src/components/topmate/TopMateCard.tsx	Complete redesign with modern card styling, improved close button, and enhanced responsive behavior
src/components/testimonials/TestimonialCarousel.tsx	Updated pagination dots with gradient styling and improved navigation controls
src/components/testimonials/TestimonialCard.tsx	Enhanced card design with consistent purple theme and improved responsive layout

_{Tip: Customize your code reviews with copilot-instructions.md. Create the file or learn how to get started.}

Copilot · 2025-10-03T16:59:39Z

src/components/topmate/TopMateCard.tsx

-        ))}
-      </div>
+      {/* Gradient Overlay - Shows on Hover */}
+      <div className="absolute inset-0 bg-gradient-to-br from-purple-500/0 via-pink-500/0 to-purple-500/0 group-hover:from-purple-500/10 group-hover:via-pink-500/10 group-hover:to-purple-500/10 transition-all duration-500 pointer-events-none hover:cursor-pointer" />


The hover:cursor-pointer class is redundant with pointer-events-none. Since pointer events are disabled, the cursor style won't be applied. Remove hover:cursor-pointer or reconsider the pointer-events strategy.

Suggested change

<div className="absolute inset-0 bg-gradient-to-br from-purple-500/0 via-pink-500/0 to-purple-500/0 group-hover:from-purple-500/10 group-hover:via-pink-500/10 group-hover:to-purple-500/10 transition-all duration-500 pointer-events-none hover:cursor-pointer" />

<div className="absolute inset-0 bg-gradient-to-br from-purple-500/0 via-pink-500/0 to-purple-500/0 group-hover:from-purple-500/10 group-hover:via-pink-500/10 group-hover:to-purple-500/10 transition-all duration-500 pointer-events-none" />

Copilot · 2025-10-03T16:59:40Z

src/components/testimonials/TestimonialCarousel.tsx

-          <CarouselPrevious className="static translate-y-0" />
-          <div className="flex gap-2">
+        <div className="flex items-center justify-center gap-4 mt-8">
+          <CarouselPrevious className="static translate-y-0 cursor-pointer" />


[nitpick] Adding cursor-pointer class to navigation buttons is redundant since buttons already have pointer cursor by default. Consider removing this class for cleaner code.

Copilot · 2025-10-03T16:59:40Z

src/components/testimonials/TestimonialCarousel.tsx

            ))}
          </div>
-          <CarouselNext className="static translate-y-0" />
+          <CarouselNext className="static translate-y-0 cursor-pointer" />


[nitpick] Adding cursor-pointer class to navigation buttons is redundant since buttons already have pointer cursor by default. Consider removing this class for cleaner code.

vercel · 2025-10-03T23:50:53Z

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

Project	Deployment	Preview	Comments	Updated (UTC)
recode-website	Ready	Preview	Comment	Oct 3, 2025 11:52pm

sanjay-kv · 2025-10-04T00:03:34Z

@Condition00

I will put this under review as this a major design change and in size. i have to get the teams opinion . will merge it soon or request some changes based on the feedback.

iitzIrFan

LGTM ! @Condition00
@sanjay-kv This design is descriptive for the reviews or else we have to make it clickable.

Condition00 · 2025-10-04T05:44:19Z

yup yup its fine. I can make any changes if you want. @sanjay-kv

fix: enhanced topmate section and fixed the inconsistencies issue#704

305ff48

Copilot AI review requested due to automatic review settings October 3, 2025 16:59

github-actions bot added hacktoberfest-accepted level 1 10 points labels Oct 3, 2025

github-actions bot added the recode this is label for leaderboard label Oct 3, 2025

Copilot AI reviewed Oct 3, 2025

View reviewed changes

Condition00 mentioned this pull request Oct 3, 2025

🐞[Bug]: Enhancement of the topmate section #704

Open

4 tasks

iitzIrFan requested review from sanjay-kv and iitzIrFan October 3, 2025 18:33

iitzIrFan assigned Condition00 Oct 3, 2025

iitzIrFan added this to @recode-web Oct 3, 2025

iitzIrFan moved this to In Progress in @recode-web Oct 3, 2025

sanjay-kv approved these changes Oct 3, 2025

View reviewed changes

sanjay-kv added this to the recode:launch 3.0 milestone Oct 3, 2025

vercel bot deployed to Preview October 3, 2025 23:52 View deployment

sanjay-kv added the under review Review under the maintainers or the admins label Oct 4, 2025

iitzIrFan approved these changes Oct 4, 2025

View reviewed changes

Merge branch 'recodehive:main' into issue#704

00ed5c5

iitzIrFan added Ready for Merge PR has passed reviews and checks, and is ready to be merged into the main branch. and removed under review Review under the maintainers or the admins labels Oct 6, 2025

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Uh oh!

Enhanced topmate section and fixed the inconsistencies issue#704 #735

Enhanced topmate section and fixed the inconsistencies issue#704 #735

Uh oh!

Condition00 commented Oct 3, 2025

Uh oh!

vercel bot commented Oct 3, 2025

Uh oh!

github-actions bot commented Oct 3, 2025

Uh oh!

github-actions bot commented Oct 3, 2025

Uh oh!

Copilot AI left a comment

Uh oh!

Copilot AI Oct 3, 2025

Uh oh!

Copilot AI Oct 3, 2025

Uh oh!

Copilot AI Oct 3, 2025

Uh oh!

vercel bot commented Oct 3, 2025 •

edited

Loading

Uh oh!

sanjay-kv commented Oct 4, 2025

Uh oh!

iitzIrFan left a comment

Uh oh!

Condition00 commented Oct 4, 2025

Uh oh!

Uh oh!

	<div className="absolute inset-0 bg-gradient-to-br from-purple-500/0 via-pink-500/0 to-purple-500/0 group-hover:from-purple-500/10 group-hover:via-pink-500/10 group-hover:to-purple-500/10 transition-all duration-500 pointer-events-none hover:cursor-pointer" />
	<div className="absolute inset-0 bg-gradient-to-br from-purple-500/0 via-pink-500/0 to-purple-500/0 group-hover:from-purple-500/10 group-hover:via-pink-500/10 group-hover:to-purple-500/10 transition-all duration-500 pointer-events-none" />

Enhanced topmate section and fixed the inconsistencies issue#704 #735

Are you sure you want to change the base?

Enhanced topmate section and fixed the inconsistencies issue#704 #735

Uh oh!

Conversation

Condition00 commented Oct 3, 2025

Description

Type of Change

Changes Made

Dependencies

Checklist

Uh oh!

vercel bot commented Oct 3, 2025

Uh oh!

github-actions bot commented Oct 3, 2025

Uh oh!

github-actions bot commented Oct 3, 2025

Synced data from Linked Issues

Uh oh!

Copilot AI left a comment

Choose a reason for hiding this comment

Pull Request Overview

Reviewed Changes

Uh oh!

Copilot AI Oct 3, 2025

Choose a reason for hiding this comment

Uh oh!

Copilot AI Oct 3, 2025

Choose a reason for hiding this comment

Uh oh!

Copilot AI Oct 3, 2025

Choose a reason for hiding this comment

Uh oh!

vercel bot commented Oct 3, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

sanjay-kv commented Oct 4, 2025

Uh oh!

iitzIrFan left a comment

Choose a reason for hiding this comment

Uh oh!

Condition00 commented Oct 4, 2025

Uh oh!

Uh oh!

vercel bot commented Oct 3, 2025 •

edited

Loading