#7582258 Jetpack pricing: fix alternative texts in modals

Changes proposed in this Pull Request

This PR adds an accessible name to the close button of the language selector, in the footer of the Jetpack pricing page, and the products lightbox. This way, visitors using a screen reader get proper context when the button gets focus (see video below).

Implementation notes

Name is added via the aria-label HTML attribute.

Testing instructions

• Spin up the pricing page, by running this branch locally, or by using the live link below
• Visit the pricing page, and open the language selector located in the footer

• Using a screen reader, notice that the close button has an accessible name (see video below). Alternatively, check in the inspector that the HTML element has a aria-label attribute.

• Do the same with the products lightbox (click More on X).

Screenshots

Voice Over gives information about the close button when it is given focus.

Same here. Besides, Voice Over ignores icons completely.

• To see the specific tasks where the Asana app for GitHub is being used, see below:
  • 0-as-1203150321101696