Add tooltip on hover effect on the badges in Individual member profile page.

[chinu-anand]

Current Behavior

Currently, there is no tooltip on hovering over badges in the individual pages of members on the page https://layer5.io/community/members.

Desired Situation

Add the tooltip while hovering over the badges.

---

Contributor Resources and Handbook

The layer5.io website uses Gatsby, React, and GitHub Pages. Site content is found under the master branch.

• 📚 See contributing instructions.
• 🎨 Wireframes and designs for Layer5 site in Figma.
• 🙋🏾🙋🏼 Questions: Discussion Forum and Community Slack.

Join the Layer5 Community by submitting your community member form.

[roopeshsn]

Hi, @chinu-anand! I would like to work on this.

[Shivam164]

Hey @chinu-anand, Is there any particular way the tooltip should look, or is it up to us to make it look good?

[chinu-anand]

@Shivam164 One which matches the site's color scheme and looks modern also. That's it.

[chinu-anand]

@Chadha93 @eeshaanSA Please assign @roopeshsn this issue.

[niranjan-kurhade]

Is this issue still open? If yes, I would like to work on it.

[stale]

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions.

[DarrenDsouza7273]

@vishalvivekm i would like to work on this issue

[vishalvivekm]

Awesome @DarrenDsouza7273
Look for suggestions in linked pr #4120

[DarrenDsouza7273]

on it @vishalvivekm

[DarrenDsouza7273]

hi @chinu-anand can u brief about it more, like what is the expected result?

[chinu-anand]

@DarrenDsouza7273 add a tooltip to the badges while hovering over that and please make the badges row responsive for smaller devices as well. You can refer to #4120 .

[ranjanmangla1]

hey, if it's still open, i would love to work on this issue

[DarrenDsouza7273]

Hi @ranjanmangla1 i've been working on this issue for the past weeks and theres a few enhancements(regarding alignment of the tooltip so it looks centered) and i've faced some issues so if you dont mind helping please check out my pr #4436

[DarrenDsouza7273]

we can get connected @ranjanmangla1 and work on it together and get it done asap

[github-actions]

Checking in... it has been awhile since we've heard from you on this issue. Are you still working on it? Please let us know and please don't hesitate to contact a MeshMate or any other community member for assistance.

---

        Be sure to join the community, if you haven't yet and please leave a ⭐ star on the project 😄

[DarrenDsouza7273]

i will complete this issue by end of this week

[thisiskaransgit]

@DarrenDsouza7273 fix this promptly, please

[DarrenDsouza7273]

@thisiskaransgit i couldn't find the expected fix for it.

[ankushbhardwaj408]

Hi @Chadha93 i would like to work on this issue. Please assign it to me.

[vishalvivekm]

There you go @ankushbhardwaj408

[ankushbhardwaj408]

Hi @vishalvivekm I have added tooltip hover effect on the badges. Please review it. Here is the recorded video.

Recording.2023-10-04.115715.mp4

[DarrenDsouza7273]

Hi @ankushbhardwaj408 i had done the same thing but during the weekly meeting it was suggested that the tooltips should be centered which i couldnt find a way to do,so if you can center them on hover please do. As the hover effect was already implemented its just that it needs to be centered.

[ankushbhardwaj408]

Thanks @DarrenDsouza7273 working on it.

[ankushbhardwaj408]

Hi @DarrenDsouza7273 @Chadha93 @vishalvivekm I centered the hover of the tooltip which was previously on the right side. Please review this change.

Recording.2023-10-04.172223.1.mp4