Long resource name (descriptor) causes accessibility issues in the resource editor

[SDScandrettKint]

When a resource has a name descriptor that is longer than the screen width, it causes a number of accessibility issues.

For reference, the resource descriptor in question is the name at the very top, not the one that begins with the model name "Consultation:"

Number 1 - tab wrapping

When a resource has a short name e.g. 17 characters, the wrapping works as expected (until you reach 300%)

If we increase the name to ~70 characters, then the wrapping works up to a zoom of 150%, then anything over starts to fall off the screen, as shown below:

Then, if we increase the name further to ~115 characters, then the wrapping fails to work on at 133% zoom and onwards

Finally, if we increase the name to ~200 characters, then at 100% the wrapping of the model name works, but the rest of the resource doesn't work with the end column of the table falling off the screen

The resource falling off the screen seems to be caused by a correlation between the length of the resource name descriptor and the level of zoom.

Number 2 - y scroll bar in long cards

Note, this has been tested in Chrome to show both y scroll bars better than Firefox.

The Arches resource editor has a scroll bar at all times on chrome, even though it doesn't appear to have much use, even when changing the zoom level:

The resource editor view for a nodegroup that has lots of nodes in (e.g. Consultations -> Advice/Action) will show two y scroll bars when on 100% zoom - one for scrolling down the nodegroup, and the scroll bar mentioned above that is on the resource at all times.

AfHER_y_axis_default_zoom.mp4

Once again when changing the resource descriptor name length we see different results.
When a resource name descriptor is ~50 characters, the scroll bar disappears at 175% zoom:

AfHER_y_axis_zoom1.mp4

And if we increase it to ~150 characters, it disappears at 100% zoom:

AfHER_y_axis_zoom2.mp4

Number 3 - rich text widgets

At 125% zoom with a resource name descriptor of 17 characters, the text box acts as we'd expect.

If we increase the name to 150 characters, firstly the text box is larger than the screen, but secondly when entering text it stretches off screen and off focus:

AfHER_rich_text_box_descriptor.mp4

[SDScandrettKint]

This has been raised as a core issue archesproject/arches#11654