UHF-9508 & UHF-10769: Change unit contact card layout and improve accessibility

[j-mys]

UHF-9508 & UHF-10769

Change unit contact card layout

What was done

• CSS and DOM changes for the unit contact card paragraph.
• Add unit name for the link to unit page for screen readers to help with link context.

How to install

• Make sure your instance (developed with KASKO) is up and running on latest dev branch.
  • git pull origin dev
  • make fresh
• Update the HDBT theme
  • composer require drupal/hdbt:dev-UHF-9508-unit-contact-card
• Update the helfi_platform_config
  • composer require drupal/helfi_platform_config:dev-UHF-9508-unit-contact-card
• Run make drush-updb drush-locale-update drush-cr

How to test

• Go to page containing unit contact cards or add one to

• • landing page
• • content page
• Compare with design
• Try out different info amounts, with and without image and on different screen widths
• Make sure the responsive image styles for the unit contact card now match with the new styles. It should use same image styles as card uses since the layout is very similar.
• Make sure the unit contact card link says now See details / Katso tarkemmat tiedot / Se detaljer instead of the old Unit homepage text.
• Make sure there is visually hidden text on the link that adds the units title there to help screen readers give some context to their users.

• Check that code follows our standards

Continuous documentation

• This change doesn't require updates to the documentation

Other PRs

• UHF-9508 & UHF-10769: Change unit contact card layout and improve accessibility #1082
• UHF-9508: Change unit contact card layout drupal-helfi-platform-config#827

[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/pull/1082/html_report/

[Arkkimaagi]

Works as it should, code looks clean and it's an improvement all over. Good job you two!