feat: added a mapsection on each venue page

[kabszac]

Description

• Added a map section on each venue page
• I used leaflet and react - leaflet

Related issue(s)
fixes #165

[netlify]

✅ Deploy Preview for peaceful-ramanujan-288045 ready!

Name	Link
🔨 Latest commit	7423734
🔍 Latest deploy log	https://app.netlify.com/sites/peaceful-ramanujan-288045/deploys/651ff6def5be6e00076864cd
😎 Deploy Preview	https://deploy-preview-206--peaceful-ramanujan-288045.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.

[kabszac]

@AceTheCreator made a new pull request kindly review.

[AceTheCreator]

@AceTheCreator made a new pull request kindly review.

LGTM!

[AceTheCreator]

@Mayaleeeee wyt?

[Mayaleeeee]

@Mayaleeeee wyt?

Looks good, thanks @kabszac.

Here are my observations @kabszac :

1. The colour you used for the card is dark, compared to the one I used; please kindly use the one in the image I sent below.
2. The spacing between the location is too much as well, please kindly reduce it and make them both aligned in the center.
   
   cc @AceTheCreator

Below is the image for reference

[kabszac]

@Mayaleeeee made the changes.

[AceTheCreator]

@Mayaleeeee made the changes.

cc @Mayaleeeee

[Mayaleeeee]

@Mayaleeeee made the changes.

cc @Mayaleeeee

Thanks @kabszac @AceTheCreator

I can only see this on my phone, and I'm not sure why the location pointer is white. Additionally, I couldn't find the card that displays the description.

Regardless, I'll take another look when I'm on my laptop.

[Mayaleeeee]

@Mayaleeeee made the changes.

cc @Mayaleeeee

@kabszac, thank you for working on this; here are my reviews on the design.

1. The location pointer need not be clicked to view the placeholder. The purpose of the placeholder is to provide the user with a glance at the location and date. Therefore, there is no need for any interaction with the card, as seen in the recording below.
   23082528-6867-4f0a-8dd0-7c0ed2521392.webm

2. The location icon on the card is too small compared to the calendar icon. I used 20px for the icons and 16px for the texts.
   

3. Instead of being placed outside, The 'X' close icon should be positioned inside the card at the top with a white colour. The expected design is shown in the image below. When the user clicks on the 'X' icon, it should close the card, and the card should reopen when the user clicks on the location pointer.

[github-actions]

This pull request has been automatically marked as stale because it has not had recent activity 😴

It will be closed in 120 days if no further activity occurs. To unstale this pull request, add a comment with detailed explanation.

There can be many reasons why some specific pull request has no activity. The most probable cause is lack of time, not lack of interest. AsyncAPI Initiative is a Linux Foundation project not owned by a single for-profit company. It is a community-driven initiative ruled under open governance model.

Let us figure out together how to push this pull request forward. Connect with us through one of many communication channels we established here.

Thank you for your patience ❤️

[thulieblack]

Website has been updated to 2024