UHF-9700: Language toast

[teroelonen]

UHF-9700

What was done

• Language links that don't have translation available now have a toast that tells that there is no language version available. It works with javascript and with a bit less functionality on no-js situation as well.
• Close button layout was changed to use mixin.
• The close button was resized to 44px x 44px.

How to install

• Make sure your instance is up and running on latest dev branch.
  • git pull origin dev
  • make fresh
• Update the HDBT theme
  • composer require drupal/hdbt:dev-UHF-9700
• Run make drush-locale-update drush-cr

How to test

• Create a page that doesn't have any translations to trigger the functionality on the links to Swedish and English language versions.
• Click on the language switcher links and you should see a language toast open that tells you in the language that you clicked that there is no content available in this language.
• Make sure that if you click on another language link or any of the other header buttons that open dropdowns that the toast is closed and the other element is opened. Only one toast should be visible at a time.
• Make sure that when the toast is open the language link remains outlined and underlined.
• Check that when closing the toast from the close button, focus is moved back to the language link that opened the toast.
• Toast should be closable with ESC-button.
• If you move focus away from the toast it should close. Also if you click outside the toast it should disappear.
• Make sure that the toast works with screen reader and that it reads the toast language and message in correct language. Notice however that the close button has screen reader label that IS translated and since being a part of the user interface I translated it like other parts on the site so it should be read in the user interface language.
• Make sure the functionality works about the same way in no-js mode as well.
• Check that code follows our standards.
• Check the documentation.

Continuous documentation

• This feature has been documented.
• This change doesn't require updates to the documentation.

Translations

• Translations have been added to .po -files and included in this PR

[github-actions]

⚠️ Visual regression found! Please check if this change is wanted or accidental. You can check the output here: https://city-of-helsinki.github.io/drupal-hdbt-visual-regression/pull/1225/html_report/

[github-actions]

⚠️ Visual regression found! Please check if this change is wanted or accidental. You can check the output here: https://city-of-helsinki.github.io/drupal-hdbt-visual-regression/pull/1225/html_report/

[annadruid]

Works nicely!

[github-actions]

⚠️ Visual regression found! Please check if this change is wanted or accidental. You can check the output here: https://city-of-helsinki.github.io/drupal-hdbt-visual-regression/pull/1225/html_report/