fix: resolve issue #80 - Badge hover preview - image

[cryst6line]

Summary

This PR adds a hover preview feature for image badges in draft comments. When you hover over the image badge, it now shows a list of all the images that are included, so you can see what images you're about to upload without having to open anything else.

What changed

• Added a hover popup that displays all images in a preview list when you hover over the image badge
• The preview shows up right when you hover and disappears when you move your mouse away
• Kept the styling consistent with the rest of the interface

Things to check

Since the code review came back approved, the main things to verify are:

• The hover preview appears in the right place and doesn't cover anything important
• It works smoothly when you have a lot of images
• The styling looks good with the rest of the draft comment area

Testing

I ran the existing tests and they all passed.

---

Hi, I'm fairly new to open source and this is one of my earlier contributions — I hope I haven't missed anything obvious. Please don't hesitate to point out anything I've done wrong, I really appreciate the feedback.

Sorry if this isn't quite right — happy to make any changes you need!

[nedtwigg]

I'm fairly new to open source and this is one of my earlier contributions

Welcome!

happy to make any changes you need

Add a comment to this PR with a screenshot of how this looks for you when you use it. If it looks good I'll be happy to merge and release. I expected it to need to be more complicated than this, but maybe I was wrong. Same for

• Badge hover preview - text #82

[cryst6line]

Let me know if you need anything else! :)

[nedtwigg]

haha, very meta, i love it!

i had intended to show the actual images, perhaps with their URLs.

If a user wants to see the alt-text and URLs, they can skim through the text. The point of the image dropdown is to help a user to find a draft by looking at the images they used in that post.

Also just FYI. If you put #80 in an issue title it doesn't link it to the issue. If you put #80 in the body, it links like that. And if you do a bulleted list and do the #80 then it renders the full title, like so:

• Badge hover preview - image #80

It can be easier to navigate if you put the issue in a list somewhere :)