Build page on /ai/mlops-workshop

[minkyngkm]

Done

• Build page on /ai/mlops-workshop

QA

• Go to /ai/mlops-workshop
• Compare page against copy doc and design

Issue / Card

Fixes #https://warthogs.atlassian.net/browse/WD-16670

[webteam-app]

Demo

Jenkins

demos.haus

[codecov]

Codecov Report

All modified and coverable lines are covered by tests ✅

Project coverage is 69.64%. Comparing base (21a2c39) to head (c7411cd).
Report is 19 commits behind head on main.

Additional details and impacted files

@@           Coverage Diff           @@
##             main   #14474   +/-   ##
=======================================
  Coverage   69.64%   69.64%           
=======================================
  Files         120      120           
  Lines        3419     3419           
  Branches     1174     1174           
=======================================
  Hits         2381     2381           
  Misses       1013     1013           
  Partials       25       25           

see 1 file with indirect coverage changes

[mattea-turic]

Thanks @minkyngkm ! I was awaiting some feedback from the PM before marking the page as ready for development so there might be quite a few changes from where it is currently, but I appreciate you already building it :)

Here's the figma file for reference, and I've added the assets to this server.

I'm not sure if it would be helpful for you if I write out the changes that need to be made, or if you can work from the figma file and then I'll leave comments if there are any further changes to be made. Lmk what works for you!

[minkyngkm]

Thanks @mattea-turic. I've made some changes according to the design. Hopefully it looks better now :)

[mattea-turic]

Thank you @minkyngkm ! Just a couple comments:

• Each of the images should have a 3% background at #000000
• Remove the hr that's right below the "You can expect:" in the first subsection of the "Why join an MLOps workshop?" section pls

• Add shallow padding bottom for the feature block of the "MLOps workshop structure" section (see figma if my explanation here doesn't make sense :'))

• "Learn more" section should have hrs between the resource items
• Also, for smaller screen sizes, would it be possible to use wrapping to force the link below the button? It looks a little odd with it spanning two lines i.e.

[eliman11]

Hi @minkyngkm, thank you! A few changes:

• Sorry I had forgotten to delete my draft from Figma! Could you please delete the first section under the hero?

• Match the last column in the equal heights row section to the copydoc - heading should be 'Edge AI' and description should be 'Develop Edge AI architecture to efficiently run and maintain your models on a variety of devices.'

• Change h4 heading tags in the equal heights row section to h3 without changing the styling
• Match description under first link in the 'Learn more' section with copydoc: 'Explore how Canonical delivered significant cost-savings in moving away from licensed providers and proprietary solutions.'

Also deferring to @mattea-turic but the spacing on the equal heights row section looks off to me on mobile and tablet.

[abhigyanghosh30]

@mattea-turic @eliman11 I have addressed most of the issues. Please let me know if there is something I missed or if something else needs changing

[eliman11]

Looks good to me, thanks @abhigyanghosh30!

[minkyngkm]

Thank you so much @mtruj013 @mattea-turic for reviewing! I've made some changes according to your suggestions. Hopefully it looks better now! 🙏

[mtruj013]

Thanks for the changes @minkyngkm ! A few more and then this is good to go :)

[mtruj013]

Sorry, I think mine and Mattea's comments here were missed. We should use offsets here instead of an empty div and define medium cols which won't work with the 25-75 grid short hard. Suggested edits below:

[minkyngkm]

Thanks @mtruj013, applied all the suggestions! 🙏

[mtruj013]

LGTM, thanks @minkyngkm !!

[mattea-turic]

Looks good @minkyngkm , thanks!