You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
The Organisation switcher currently floats the link to the right, which can be an issue for accessibility: the link can be hard to see and click, and isn't clearly associated with the organisation name.
A more appropriate design (and one already adopted in some services) would be to button the link alongside the text:
Since this may be a visually-breaking-change for some services, we should make this new design opt-in as a minor release, and then change the default behaviour in a future release. Therefore I propose adding a new option to the Nunjucks macro: link.position can be "inline" or "right" (currently defaulting to "right").
The "inline" option could use standard GOV.UK Design System classes rather than needing bespoke MOJ Frontend classes. For example:
<divclass="moj-organisation-nav" aria-label="Organisation switcher"><strongclass="govuk-body govuk-!-font-weight-bold">Bristol (HMP)</strong><ahref="#" class="govuk-link">Change your location</a></div>
Describe alternatives you've considered
Due to the simplicity of this component, I'm not sure there are any other suitable options that don't amount to a full redesign.
Additional context
Raised in the accessibility audit and later via Slack.
The text was updated successfully, but these errors were encountered:
Summary
The Organisation switcher currently floats the link to the right, which can be an issue for accessibility: the link can be hard to see and click, and isn't clearly associated with the organisation name.
A more appropriate design (and one already adopted in some services) would be to button the link alongside the text:
Since this may be a visually-breaking-change for some services, we should make this new design opt-in as a minor release, and then change the default behaviour in a future release. Therefore I propose adding a new option to the Nunjucks macro:
link.position
can be "inline" or "right" (currently defaulting to "right").The "inline" option could use standard GOV.UK Design System classes rather than needing bespoke MOJ Frontend classes. For example:
Describe alternatives you've considered
Due to the simplicity of this component, I'm not sure there are any other suitable options that don't amount to a full redesign.
Additional context
Raised in the accessibility audit and later via Slack.
The text was updated successfully, but these errors were encountered: