landing page banner section

[Dawaic6]

What does this PR do?

• This PR implements UI the banner section of the landing page using React, Redux, and Tailwind CSS. The banner section will consist of two advertisements images of products in database as we wish to to add to ads.

Key Changes:

• Components:

  • BAnnerAds Card: Displays individual product information ( name , short discription,image).

• Redux Integration:

  • image is fetched using redux from database

• Styling:

  • TailwindCSS classes applied for visual consistency with the provided design.
  • Responsive design ensures a seamless experience across devices.

• Testing:

  • Thorough component testing to verify rendering and data flow.

Screenshots:

Tests Screenshot

UI on Mobile

**UI on Tablet

UI on Desktop

How to Review:

1. Checkout this branch and run the application.
2. Verify that the landing page matches the provided design.
3. Test product display on different screen sizes (responsiveness).
4. Check that product data is fetched correctly from the Redux store.
5. Review code for clarity, best practices, and adherence to project guidelines.

Description of the task to be completed?

• [x] Implementthe banner section of the landing page
• [x] Write appropriate tests
• [x] Components integrated with Redux.
• [x] Responsive UI matching the design for both desktop and mobile screens.

[vercel[bot]]

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name	Status	Preview	Comments	Updated (UTC)
dynamites-ecomm-fe	✅ Ready (Inspect)	Visit Preview	💬 Add feedback	Jun 28, 2024 4:00pm

[codecov-commenter]

Codecov Report

Attention: Patch coverage is 69.46565% with 40 lines in your changes missing coverage. Please review.

Project coverage is 88.37%. Comparing base (71059dc) to head (1bb1538).

Files	Patch %	Lines
src/components/bannerAds/bannerSection.tsx	26.66%	22 Missing :warning:
src/app/bannerAds/BannerSlice.tsx	80.39%	10 Missing :warning:
src/pages/Home.tsx	14.28%	6 Missing :warning:
tailwind.config.js	0.00%	2 Missing :warning:

Additional details and impacted files

```diff @@ Coverage Diff @@ ## develop #39 +/- ## =========================================== - Coverage 89.54% 88.37% -1.17% =========================================== Files 29 32 +3 Lines 1980 2108 +128 Branches 136 141 +5 =========================================== + Hits 1773 1863 +90 - Misses 203 241 +38 Partials 4 4 ```

:umbrella: View full report in Codecov by Sentry.
:loudspeaker: Have feedback on the report? Share it here.

[netlify[bot]]

✅ Deploy Preview for dynamites-ecomm-fe ready!

Name	Link
🔨 Latest commit	1bb153843c02e63168703b07788547132b6c15b8
🔍 Latest deploy log	https://app.netlify.com/sites/dynamites-ecomm-fe/deploys/667ede21d1dc700007e93ceb
😎 Deploy Preview	https://deploy-preview-39--dynamites-ecomm-fe.netlify.app
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.

---

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