Skip to content

feat: Enhanced color contrasts and animations in trip cards#1905

Open
ankithajv wants to merge 1 commit intoapu52:mainfrom
ankithajv:feat-card-animation
Open

feat: Enhanced color contrasts and animations in trip cards#1905
ankithajv wants to merge 1 commit intoapu52:mainfrom
ankithajv:feat-card-animation

Conversation

@ankithajv
Copy link

@ankithajv ankithajv commented Jan 3, 2026

Title and Issue number

Title : Feat: Enhanced Package Cards with 3D Flip Animation and Modern UI

Issue No. : #1880

Code Stack : HTML, CSS

Description

I have enhanced the UI of the "Our Packages" section by implementing a responsive 3D flip animation.

Key Changes:

  • 3D Physics: Added a cubic-bezier transition to give the card flip a smooth, weighted feel.
  • Micro-interactions: The card image now zooms in gently when hovered.
  • Readability: Redesigned the back of the card with a clean white background and theme-matched borders (Pink/#e73e76) to ensure text is legible and professional.
  • Responsive Design: Ensured the 3D perspective works correctly across devices.

Screenshots

Before
Screenshot 2026-01-03 123039

After
Screenshot 2026-01-03 123351

Type of PR

  • Bug fix
  • Feature enhancement
  • Documentation update

Checklist:

  • I have performed a self-review of my code.
  • I have commented my code, particularly in hard-to-understand areas.
  • I have tested the changes thoroughly before submitting this pull request.
  • I have provided relevant issue numbers, screenshots, and videos after making the changes.
  • I have gone through the contributing.md file before contributing
  • I have Starred the Repository.

Additional context:

This contribution improves the visual appeal of the packages section while maintaining the project's color scheme.

Are you contributing under any Open-source programme?

  • I am contributing under KWOC 2025

@netlify
Copy link

netlify bot commented Jan 3, 2026

Deploy Preview for taupe-cendol-f7e2bb ready!

Name Link
🔨 Latest commit 6dc558e
🔍 Latest deploy log https://app.netlify.com/projects/taupe-cendol-f7e2bb/deploys/6958c116e4c28b0008b7433d
😎 Deploy Preview https://deploy-preview-1905--taupe-cendol-f7e2bb.netlify.app
📱 Preview on mobile
Toggle QR Code...

QR Code

Use your smartphone camera to open QR code link.

To edit notification comments on pull requests, go to your Netlify project configuration.

@github-actions
Copy link

github-actions bot commented Jan 3, 2026

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

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant