When viewing a Glossary, show an alphabet at the top.

[mauritsvanrees]

Clicking a letter scrolls the entries for that letter into view.

This is a customisation from the same client project where we are looking at #10, so I base this PR on that branch, for ease of my own testing.

Note that collective.glossary has a registry setting with a "Maximum before showing A-Z toolbar", which works in Classic UI. We did not implement checking this registry setting here because for this client we have hundreds of glossary terms and always want to show the A-Z bar.

An integrator would need to do some styling.
Screenshot with only this add-on:

Screenshot in the client project:

Note that this PR changes a few tags/ids/classes and I don't know why, I just copy some code here. The client project uses volto-light-theme, that may be why.

[ksuess]

Thank you @mauritsvanrees for this improvement!

I would like to skip the Classic UI registry setting "Maximum before showing A-Z toolbar" but instead let it booleanish configurable with a default true.

I did a small styling on the letter list of the navigation.

I would like to stay with the common html markup of views and modified the Glossary.jsx back to this.

[ksuess]

[ksuess]

The letters without a term beginning with this letter are paler.

    &.unmatched {
      filter: opacity(0.5);
    }