fix: fix the loader css; update the contributor section UI; add placeholder img section.

[palchhinparihar]

📝 Pull Request Template

Hi, Palchhin here,

📄 Description

All the UI related issues are fixed in this PR. The issues were:

• Contributor page broken UI
• No placeholder img/icon when the bg image is not present or failed to load
• Broken loader CSS
• No hover effect on the footer

---

🔗 Related Issues

Fixes #147

---

🖼️ Screenshots (if applicable)

---

🧩 Type of Change

Select the type of change your PR introduces (check all that apply):

• 🐛 Bug Fix
• ✨ New Feature
• ⚡ Enhancement / Optimization
• 🧰 Refactoring
• 🧾 Documentation Update
• 🔧 Other (please specify): ____________

---

✅ Checklist

Before submitting your PR, please confirm the following:

• I have performed a self-review of my code.
• I have commented my code, particularly in hard-to-understand areas.
• I have added or updated relevant documentation.
• My changes do not break any existing functionality.
• I have tested my changes locally and they work as expected.
• I have linked all relevant issues (if any).

---

💬 Additional Notes (Optional)

• Moved the footer from Home.jsx to a new separate component Footer.jsx and imported inside Home.jsx.

Let me know for any changes.

Thank you.

[vercel]

@palchhinparihar is attempting to deploy a commit to the vansh-codes1's projects Team on Vercel.

A member of the Team first needs to authorize it.

[github-actions]

Thank you for submitting your pull request! 🙌 We'll review it as soon as possible. In the meantime, please ensure that your changes align with our CONTRIBUTING.md. If there are any specific instructions or feedback regarding your PR, we'll provide them here. Thanks again for your contribution! 😊

[Copilot]

Pull Request Overview

This PR fixes multiple UI-related issues including broken contributor page layout, missing placeholder image handling, loader CSS formatting, and missing footer hover effects. The footer component is also extracted into a separate reusable component for better code organization.

• Fixed contributor page layout with responsive grid and loading states
• Added placeholder image fallback when profile background fails to load
• Fixed loader component indentation/formatting
• Extracted footer into a separate component with hover animations
• Added GitHub logo spin animation on search bar hover
• Updated Tailwind config to correctly reference the components directory

Reviewed Changes

Copilot reviewed 5 out of 8 changed files in this pull request and generated 10 comments.

Show a summary per file

File	Description
tailwind.config.js	Corrected the components path to ./src/components/** for proper Tailwind styling
src/pages/Home.jsx	Removed unused imports/state, extracted footer to separate component, added GitHub logo hover animation
src/pages/Contributors.jsx	Added loading state, improved responsive layout with better grid configuration, fixed heading alignment
src/components/MyCard.jsx	Added proper security attributes (target='_blank' and rel='noreferrer noopener') to external links
src/components/Loader.jsx	Fixed code indentation and formatting for consistency
src/components/Footer.jsx	New reusable footer component with hover effects and proper link structure
src/app/[username]/page.jsx	Added placeholder image fallback when profile background fails to load, improved error handling
public/not-found.png	Added placeholder image asset for missing backgrounds

---

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.