add MySQL support page

[goulinkh]

Done

[List of work items including drive-bys]

QA

• View the site locally in your web browser at: https://canonical-com-1487.demos.haus/data/mysql/support
• Run through the following QA steps
• Page redesign is applied properly

Issue / Card

Fixes WD-17641

[webteam-app]

Demo

Jenkins

demos.haus

[eliman11]

Thanks for your work on this @goulinkh!

Apologies this wasn't specified in the ticket, but could we change the nav to have MySQL as the parent heading - as we have on the other data pages (example: https://canonical.com/data/kafka). In this case, MySQL on the left should link to /data/mysql and there should be a new tab for "Support" for this page. We'd also need the "All data solutions" link to the /data page on the far right.

• Managed MySQL link returns 404 as the page hasn't been built yet. Could we publish the pages together when that one gets built? (Jira epic for reference)
• Remove space between "MySQL-chiselled"
• Remove "s" after "Deliver Proof of Concepts" (should be Deliver Proof of Concept)
• Change "centre" to US spelling in "Canonical engineers can deploy our MySQL stack to the cloud or data center of your choice."
• Remove alt text (alt="") for the image under MySQL consulting as it's a decorative image

[goulinkh]

Hey @eliman11 I've applied the suggested changes.

I will mark this PR ask blocked once it's ready to go live until the Managed MySQL page is ready.

Regarding the secondary navigation, we are missing two pages compared to Kafka and Postgres:

• Managed MySQL: This is already triaged
• What is MySQL (example): This is missing, should we remove it from the navigation or wait for this to be ready as well before publishing?

[eliman11]

Thanks for the quick changes - also thank you for adding the docs link! There isn't currently a request for the "What Is MySQL" page so let's remove it from the navigation for now. Feel free to add UX+1 when you've removed it :)

[mattea-turic]

Thank you @goulinkh ! Just a couple of comments:

• Could the breaks specified for desktops be omitted when it comes to smaller screens? E.g. the hero text, the links within"MySQL support options"
• For screen sizes <1036, the "mysql" logo in the header doesn't work well; could we keep that only for larger screens (≥1036) and mobile?
• Could the images under "MySQL support options" also be removed for screen sizes <620? The way they've been designed don't work well for the aspect ratio we use on mobile