V8: Make the content tree keyboard accessible

[MMasey]

This PR makes the arrow to reveal child nodes, and the node options button (displayed as 3 dots when hovering over a node in the tree) in the content tree keyboard accessible. It also makes it easier to get to the context menu via the options menu when navigating via a keyboard.

As part of this work I discovered a separate issue where the ESC to close and clickOutside to close functionality doesn't bind properly when accessing the context menu via the "Do something else" button in the options menu. We also discussed changing the "Do something else" with something more helpful, but that is a separate subject. This PR doesn't fix those issue, but I wanted to flag it to remind me to make an issue for it later.

I've also refactored the sr-only class to include a sr-only--focusable and sr-only--hoverable modifier class which. They should be used like so

<button class="sr-only sr-only--focusable">Visible when focused</button>

Here is a gif of it in action.

This doesn't fix every accessibility issue with the every tree in the Umbraco backoffice, but it is a start.

P.S. Can this be given the accessibility label please

[nul800sebastiaan]

Thanks @MMasey - before I look at this: we already have a sr-only now so this is causing merge conflicts, can you merge with the latest code please?

https://github.com/umbraco/Umbraco-CMS/blob/v8/dev/.github/CONTRIBUTING.md#keeping-your-umbraco-fork-in-sync-with-the-main-repository

[nul800sebastiaan]

Other than that, I LOVE what's happening in this GIF!

[nul800sebastiaan]

Ah, don't mind me, I see you just moved the class 🤦‍♂️. Will have a look!

[nul800sebastiaan]

YAY!! 🎉 🎖 🎈

This is such a relief.. being able to navigate the content tree with keyboard is my most favorite feature of the month! I'm going to do this all the time now.

Top job @MMasey - SUPER useful!