Skip to content

Create Home Page for Aroma Pragna#18

Open
ayonpaul8906 wants to merge 4 commits intopragna7:mainfrom
ayonpaul8906:Contribution
Open

Create Home Page for Aroma Pragna#18
ayonpaul8906 wants to merge 4 commits intopragna7:mainfrom
ayonpaul8906:Contribution

Conversation

@ayonpaul8906
Copy link

This PR introduces the Home Page for the Aroma Pragna website, providing an engaging and visually appealing landing experience for users. The homepage includes a hero section, featured coffee blends, enhancing the overall UI/UX.

  • Hero Section: Displays the tagline "The Fragrance of Happiness in a Cup. Where Every Sip Tells a Story." with an animated steam effect.
  • Navigation Bar: Includes links to Home, About, Menu, and Contact pages with smooth hover effects.
  • Featured Section: Showcases signature brews with interactive cards for Rich Coffee, Herbal Tea, and Signature Blends.
  • Smooth Scroll Effect: Clicking "Discover More" scrolls to the featured section seamlessly.
  • Responsive Design: Fully optimized for mobile, tablet, and desktop views.
  • Minimal & Aesthetic UI: Styled to complement the brand’s coffee-themed look with warm tones and animations.

Implementation Details

  • Created a fixed navbar for easy navigation.
  • Designed a hero section with a background image, an animated steaming cup, and a CTA button.
  • Developed a featured section with hover effects on coffee blend cards.
  • Added JavaScript for smooth scrolling from the hero section to the featured section.
  • Applied CSS animations for subtle motion effects, enhancing user experience.

Screenshot

image

Testing & Review

  • Verified the layout and responsiveness on different screen sizes.
  • Ensured smooth scrolling functionality works without glitches.
  • Checked color contrast and typography for readability and aesthetics.

@netlify
Copy link

netlify bot commented Feb 15, 2025

Deploy Preview for moonlit-sfogliatella-e0351e ready!

Name Link
🔨 Latest commit 553ec37
🔍 Latest deploy log https://app.netlify.com/sites/moonlit-sfogliatella-e0351e/deploys/67b74ed6bffbd30008371f82
😎 Deploy Preview https://deploy-preview-18--moonlit-sfogliatella-e0351e.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 site configuration.

@pragna7
Copy link
Owner

pragna7 commented Feb 20, 2025

@ayonpaul8906 website name is "Aroma",plz change the title

@ayonpaul8906
Copy link
Author

image
image

@ayonpaul8906
Copy link
Author

I have updated the website name, kindly review it and let me know if any changes required. @pragna7

@ayonpaul8906
Copy link
Author

ayonpaul8906 commented Feb 20, 2025

@pragna7 kindly add hard level for the issue #9

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.

2 participants