jf2-to-html Use img to embed author photos and link to profiles instead of showing as plain text URLs
tantek opened this issue · 7 comments
When I try https://webmention.io/api/links.jf2?target=http://tantek.com/2017/183/e1/sunday-yoga-presidio in stream.thatmustbe.us to convert jf2 to mf2 rendered in HTML, it returns a good start towards a presentable list of RSVPs:
Key improvements could be:
- Use img to embed author photo instead of showing plain text jpg URL
- Use a href to link author photo and name to author profile instead of using profile URL as link text
I have updated the rendering to be a bit improved. It was originally written to just make it something that will round trip back in to the same jf2, but there is definitely a lot more improvements that can be done here. Including possibly adding some styling.
This is amazingly improved. Filing a different issue for a styling hook.
One more tweak to this:
Instead of:
<a class="u-url p-name" href="https://www.facebook.com/10153450952308886"><img class="u-photo" title="Sukant Ghosh" src="https://webmention.io/avatar/graph.facebook.com/08196cf4adc8251861f778e1839692ec08279f13fffeafcbe132ae197b36141b.jpg">Sukant Ghosh</a>
markup the text separately with a span p-name so it is independently stylable, e.g.:
<a class="u-url" href="https://www.facebook.com/10153450952308886"><img class="u-photo" title="Sukant Ghosh" src="https://webmention.io/avatar/graph.facebook.com/08196cf4adc8251861f778e1839692ec08279f13fffeafcbe132ae197b36141b.jpg"><span class="p-name">Sukant Ghosh</span></a>
(view comment markdown source to see the code that is too long to fit on a line and GHmd does not do code with linewraps :P)
agreed, nicer to have them split up
fixed in the latest push
Looks good!