fix a11y issues in header nav

[rlucke]

use button tag instead of div
reorder tooltip
add some css changes to keep layout

fixes #605
fixes #601
fixes #603

[github-actions]

Hi @rlucke
Thank you for contributing to the Opencast Editor.
We noticed that you have not yet filed an Individual Contributor License Agreement. Doing that (once) helps us to ensure that Opencast stays free for all. If you make your contribution on behalf of an institution, you might also want to file a Corporate Contributor License Agreement (giving you as individual contributor a bit more security as well). It can take a while for this bot to find out about new filings, so if you just filed one or both of the above do not worry about this message!
Please let us know if you have any questions regarding the CLA.

[github-actions]

This pull request is deployed at test.admin-interface.opencast.org/718/2024-06-20_12-37-50/ .
It might take a few minutes for it to become available.

[github-actions]

Use docker or podman to test this pull request locally.

Run test server using develop.opencast.org as backend:

podman run --rm -it -p 127.0.0.1:3000:3000 ghcr.io/opencast/opencast-admin-interface:pr-718

Specify a different backend like stable.opencast.org:

podman run --rm -it -p 127.0.0.1:3000:3000 -e PROXY_TARGET=https://stable.opencast.org ghcr.io/opencast/opencast-admin-interface:pr-718

It may take a few seconds for the interface to spin up.
It will then be available at http://127.0.0.1:3000.
For more options you can pass on to the proxy, take a look at the README.md.

[Arnei]

Can navigate to all buttons in the header via tabbing now, and layout is kept. Nice.

[Arnei]

As a note, adding translations in PR has no effect, as crowdin can and will override any changes not made directly to the "source" file (lang-en_US.json). If you would like to help with translations, please request access to our crowdin project at crowdin.com/project/opencast-admin-interface.

[Arnei]

Also this is probably obvious, but I do not understand how this addresses #603. Could you explain?

[rlucke]

Also this is probably obvious, but I do not understand how this addresses #603. Could you explain?

The correct position of the ToolTip in the template enables the screenreader to say more than just "link".