elk
elk copied to clipboard
Alt text (code) wrongly displayed on image lightbox
Pre-Checks
- [X] Check that there isn't already an issue that reports the same bug to avoid creating a duplicate.
- [X] Check that this is a concrete bug. For Q&A open a GitHub Discussion or join our Discord Chat Server.
- [X] Providing a screenshot or video to reproduce the issue or show visually what was meant.
- [ ] I am willing to provide a PR.
Describe the bug
Heyho, The alt text is displayed in the top right corner of an image. It works for regular text.

But on this toot, the author pasted the code from the screenshot as a markdown code block.
Toot
Broken alt text
Content is there
Solution?
So I think displaying the code here doesn't add value, a screen reader will get it form the alt text, and others can read it on the screenshot, and I can't think of another scenario where you add code as alt text without a screenshot. So what about just displaying "Code from the picture" instead of the actual code but keeping the alt attribute as it is?
Reproduction video or screenshot
Open this this toot and check the alt text.

Additional Context
Firefox, Mac (M1) - I don't think that it's relevant, but happy to provide more info.it's relevant, but I would be
Start a new pull request in StackBlitz Codeflow.
The colorfull part in your screenshot is an image, and the alt is a markdown code block
The colorfull part in your screenshot is an image, and the alt is a markdown code block
I guess the author wrote it on purpose 🤣
Cause Elk don't add extra things
Yes, I never assumed that Elk added this. But Elk is responsible for displaying it - and the displaying is broken :)
Alt text should not need to be visible by default if the image loads successfully. I would be OK with the alt text being behind an [alt] button that displays a popover with as many lines as necessary, like in Alex's screenshot.