Build why-openstack page

[minkyngkm]

Block by marketo id

Done

• Build page on /openstack/why-openstack

QA

• Check out this feature branch
• Run the site using the command ./run serve or dotrun
• View the site locally in your web browser at: http://0.0.0.0:8001/
  • Be sure to test on mobile, tablet and desktop screen sizes
• Compare page against copy doc
• Demo : https://ubuntu-com-11992.demos.haus/openstack/why-openstack

Issue / Card

Fixes #5823

Screenshots

[webteam-app]

Demo starting at https://ubuntu-com-11992.demos.haus

[codecov-commenter]

Codecov Report

Merging #11992 (ce67fe7) into main (77fec71) will increase coverage by 64.15%. The diff coverage is n/a.

@@            Coverage Diff            @@
##           main   #11992       +/-   ##
=========================================
+ Coverage      0   64.15%   +64.15%     
=========================================
  Files         0      119      +119     
  Lines         0     2636     +2636     
  Branches      0      773      +773     
=========================================
+ Hits          0     1691     +1691     
- Misses        0      903      +903     
- Partials      0       42       +42     

Impacted Files	Coverage Δ
...urchaseModal/components/ModalParts/ModalFooter.tsx	50.00% <0.00%> (ø)
static/js/src/advantage/countries-and-states.js	100.00% <0.00%> (ø)
...scriptionCancelFields/SubscriptionCancelFields.tsx	100.00% <0.00%> (ø)
...bscriptionList/RenewalSettings/RenewalSettings.tsx	98.57% <0.00%> (ø)
...antage/offers/components/OffersList/OffersList.tsx	75.00% <0.00%> (ø)
...e/react/components/Subscriptions/Subscriptions.tsx	100.00% <0.00%> (ø)
...ents/Subscriptions/Notifications/Notifications.tsx	86.20% <0.00%> (ø)
...criptions/RenewalModal/RenewButton/RenewButton.tsx	1.66% <0.00%> (ø)
static/js/src/advantage/users/api.ts	44.44% <0.00%> (ø)
...js/src/advantage/react/utils/sendAnalyticsEvent.ts	100.00% <0.00%> (ø)
... and 109 more

[minkyngkm]

Thanks @anthonydillon for reviewing!🙏🏻

• Don't we want this page in the sub-navigation? ➡️ this was asked in the brief.
• Some missing links which you are aware of ➡️ yep still waiting for the url..
• I have suggested a different image for the webinar section in the copy doc ➡️ I will update it when I get the right webinar link

[anakritskaya]

Hi! Let me know if this is the right way to place comments after reviewing the page.

1. First section OpenStack: what is it and why do you need it?: is it possible to add some visual elements to the bottom part of this section, not just to the top cause it looks a bit too blank? e.g. https://ubuntu.com/openstack/managed
2. Add grey background to the section An Introduction to OpenStack
3. Between the section OpenStack: what is it and why do you need it? and A business guide to cloud migration could you please add one element with the case study? It should look like a horizontal stripe, lower than the usual section, with background being a picture from the case study and some text on it? Here is what I mean (light blue strip): https://www.ibm.com/eg-en/it-infrastructure/power

I am attaching 2 images as references for you as well. Image 1: Image 2 in case the first one looks too bulky in terms of text:

Link for this section: https://pages.ubuntu.com/rs/066-EOV-335/images/Firmus+Case+study.pdf+?_ga=2.233998550.99652456.1662360547-1232158778.1655899900

4. For this section with the case study could you please provide a link that will lead directly to this part of the page? Usually it's with #. We will need to use this link for some paid ads promotions that have to lead to the case study part of the website
5. Get in touch: does it have the form ID - 4578? Just to double check

[petesfrench]

@spencerbygraves could you take a look at this please?

[spencerbygraves]

@petesfrench yes, will take a look...

[spencerbygraves]

Hi @anakritskaya. For the case study element, we don't have a vanilla component with a background image but we can achieve the below with existing ones. Thanks.