Add tooltip to progress meters

delucis / astro-badge

Badges for Astro projects

https://astro.badg.es

85 stars 11 forks source link

Add tooltip to progress meters #47

Closed at-the-vr closed 5 months ago

at-the-vr commented 6 months ago

closes #46
a plain tooltip is added to the progress meters in the Stat section

Info unrelated to the PR: During local setup, I receive this Could not load the "sharp" module using the win32-x64 runtime error.
Astro                    v4.0.0
Node                     v20.10.0
System                   Windows (x64)
Package Manager          pnpm
Output                   static
Adapter                  none
Integrations             @astrojs/tailwind
commit/PR itself are done via Gitpod in the meantime🙏

vercel[bot] commented 6 months ago

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

Name	Status	Preview	Updated (UTC)
astro-badge	✅ Ready (Inspect)	Visit Preview	Mar 11, 2024 10:07am

at-the-vr commented 5 months ago

Hey Chris, the logic behind making the tooltip appear with link on focus is something I am unable to achieve. Every other suggestion was tried locally and it works but without the focus feature its just getting blocked. I will close the PR on that note

delucis commented 5 months ago

No problem @at-the-vr! Also, don’t hesitate to mention when you get stuck on something — maybe someone else can help out.

To give you a hint: I probably would have tried moving the group class up to the <li> containing both the link and the bar. And then used the group-focus-within: Tailwind modifier the same way you did group-hover:. That way when the link is focused with the keyboard, the tooltip would be revealed (I think — haven’t tested).

But no pressure to spend time on this if you already feel like you invested enough energy — we only have so much time 💜