Address Header Non-critical Accessibility Issues

[governmentSponsored]

This ticket is for addressing accessibility problems with the app header that aren't covered by WCAG requirements.

• [x] Lack of padding on top of navigation links when screen width is below 1024px should not be hiding the top of the focus frame when link is focused.
• [x] Title text should not move behind DOJ Logo when screen width is below 615px
• [x] Screen should have scrollbars when needed across the X axis and should not be hidden.
• [x] DOJ Logo resizing    - Not sure what is needed here since logo does not currently resize.
• [x] Move user name and logout button from the banner into the header.
• Ensure the Feedback button is contained within a landmark. (Can we add a tooltip?) We'll deal with this at a later date as it's complicated.
• [x] Ensure "development environment" doesn't overlap "an official website of ..." when screen width is smaller than 800px.

[fmaddenflx]

1. I'm not sure what is desired for "DOJ Logo resizing" since the logo currently is a fixed width and height and does not resize.
2. I assume by "Feedback button" we are referring to the Jira Issue Collector Plugin? I do not think we can do anything with the plugin. I created an atlasian account on their community board and asked a question to find out if there is a way to customize it.

@shalliedragon

[fmaddenflx]

It looks like we may be able to create our own custom button, which would allow us to put it wherever we like.

[ShallieDragon]

1. I'm not sure what is desired for "DOJ Logo resizing" since the logo currently is a fixed width and height and does not resize.

   2. I assume by "Feedback button" we are referring to the Jira Issue Collector Plugin? I do not think we can do anything with the plugin. I created an atlasian account on their community board and asked a question to find out if there is a way to customize it.

@ShallieDragon

1. There's an issue (still) where the DOJ circular logo becomes squashed (reduced height) when the screen goes below a certain breakpoint.
2. It sounds like we can't really customize the button easily. It's not a huge blocker about the landmarks; the feedback button can still be accessed via tab.