Skip to content

Draft: Resolve #3488478 "Implement cta list"

Closes #3488478

Adds a CTA List component, and makes the necessary modifications to CTA sections so they may be used for CTA List items.

Config MR: https://gitlab.com/drupal-infrastructure/sites/drupalorg/-/merge_requests/79

For sample content that's already created here is an MR adding a node to the default_test content drupalorg!306

Testing steps

  • Checkout to the above drupalorg project branch
  • composer recreate
  • Create a new landing landing page.
  • Add a CTA List component.
  • Add a title, and choose light blue for the background color.
  • Add a CTA Section.
  • In the primary column add a CTA Item Logo variant. Add a logo, some cta text, and a link.
  • In the secondary column upload a test image. Images need to match or approximate the image sizes in figma. I have useable test copies of the assets attached to the Jira ticket. If you try to break this using some crazy image dimensions, you'll succeed. Image styles are waiting for official design approval, but also, the component needs to be versatile, which means curating image sizes.
  • Check the box to add a gui-border to your image.
  • Add another CTA section to the list and redo the steps above. This time select the 'reverse columns' option.
  • Add a third CTA section and redo the steps above.
  • save and check it out!
  • Check it at various screen sizes and verify that it looks good in all the places.

Note:

  • These testing steps are instructions to create the CTA List component as it appears in the designs. I have not really done any testing of what creating a list of other CTA section variants for this work. It's entirely possible not all of them will work in this CTA List component, but I think that's fine.
  • There is a lot of help text, and I did form organization, but I think it's possible we could optimize it even more.
Edited by jayme johnson

Merge request reports

Loading