GitHub dark mode images - syntax update

[ewels]

https://docs.github.com/en/get-started/writing-on-github/getting-started-with-writing-and-formatting-on-github/basic-writing-and-formatting-syntax#specifying-the-theme-an-image-is-shown-to

The old method of specifying images based on the theme, by using a fragment appended to the URL (#gh-dark-mode-only or #gh-light-mode-only), is deprecated and will be removed in favor of the new method described above.

So we need to update the template readme, plus any other instances where we are using this method.

[christopher-hakkaart]

@ewels

GitHub renders the HTML picture one to one - meaning using a relative path won't work when it's pushed. The main README is fine because it has master image paths to rely on, but for now pipelines using the template there won't be an absolute path to use.

Do you have any suggestions for a work around?

Blog post describing the problem

[maxulysse]

we can always change template to have an absolute path instead

[christopher-hakkaart]

How would that work between local and remote? Update the path if/when a pipeline is pushed to git?

[maxulysse]

Only https path I'd assume, so only master branch or dev branch (not optimal, I agree)

[ewels]

Yup, I hit exactly this with a Nextflow repo a couple of days ago: https://github.com/nextflow-io/trademark/pull/1#issuecomment-1143292154

It's a bit annoying, but as that blog post you linked to mentions - the new syntax is still in beta. It looks like the blog post announcing it was only a few days ago (May 22nd). So hopefully this will change yet. Regular <img> tags work with relative links, after all.

Maybe worth waiting a little while 👍🏻

[github-actions[bot]]

This issue has been tagged as awaiting-changes or awaiting-feedback by an nf-core contributor. Remove stale label or add a comment otherwise this issue will be closed in 20 days.