Mobile Responsiveness and UI

[RiyanshiTomar]

Issue: Enhance UI with Animated Headings and Mobile-Responsive Carousel

Description

We want to improve the user interface by:

1. Adding attractive, animated headings to engage users.
2. Ensuring the carousel is fully mobile-responsive.
3. Implementing additional UI enhancements to make the site more interactive.

Changes Needed

1. Animated Headings:

   • Add animations to the headings, such as fade-in, slide-in, or zoom-in effects.
   • Ensure animations are smooth and don't interrupt the user experience.

2. Mobile-Responsive Carousel:

   • Modify the existing carousel to be fully responsive on mobile devices.
   • Implement swipe functionality for mobile users.

3. General UI Enhancements:

   • Add hover effects, smooth transitions, and interactive elements to enhance user engagement.
   • Refine the visual design to make the page more modern and polished.

Technical Requirements

1. Use CSS animations (like @keyframes) or a JavaScript library such as AOS (Animate On Scroll) to implement heading animations.
2. Ensure the carousel uses a responsive design to adjust based on screen size, leveraging frameworks like Bootstrap or custom CSS.
3. Use media queries to optimize layouts for mobile screens.
4. Ensure smooth performance and no jarring transitions on mobile devices.

Love to contribute in this...
Thankyou
RIYANSHI TOMAR