Add lesson status and fix title element alignment

[zkamvar]

Testing

To test this locally, use the {remotes} package:

remotes::install_github("carpentries/varnish#39")

To test this on a lesson on github, you can add the following to your lesson's config.yaml file:

varnish: carpentries/varnish@add-lesson-status

Description

This fixes the lesson title to appear as an inline block instead of inline so that it respects the bounds of its box (see https://www.digitalocean.com/community/tutorials/css-display-inline-vs-inline-block)

This also adds lesson status indicators that will

1. link to the appropriate section in the CDH
2. Provide a tooltip/hidden text that describes the stage if one were to hover their mouse over the element (which I could not show in the screenshots), but you can find an example of the hover text in the source code

Pre-Alpha:

Alpha:

Beta:

This will fix #20

[tobyhodges]

It looks good with the Incubator logo as shown in your screenshots above, but I feel that somehow the spacing could be improved for a lesson with The Carpentries branding. I attach screengrabs for that, plus each of the lesson programs for reference.

[tobyhodges]

looks a lot better now, thanks 👍

[zkamvar]

I've added a single nonbreaking space in front of the text, so it now looks like this with the various logos:

[zkamvar]

Thank you for reviewing, @tobyhodges!

[tobyhodges]

The inclusion of the Lab version above reminds me that we will need something like these status indicators to make lessons stand out that have passed peer review (see the banner on https://carpentries-lab.github.io/python-aos-lesson/ for an example of what I mean) but that can definitely be an issue for another day. it will need to link to the relevant Zenodo entry or journal publication.