FR: MT Solutions Engine Row columns variant

[DanielaPedrochevd]

Agile Requirement
As a business owner, I want to display different engines in a list form as in the design -> https://www.figma.com/file/oNwe2jHIICPMIe551EY62l/Mack-Reskin---Full-Project?type=design&node-id=1968-227762&mode=dev

It’s related to #55; the All Trucks page.

Description:

• three background colour states
  • row dark
  • row light
  • row hover
• Image is to the left, hovering over dots background image
• Text elements to the right
  • Title, details of product, 'explore' button
• Explore button can be primary buttons as in All Trucks

Solutioning
Existing code should be refactored a bit to reuse the same block on both pages.

• Rename block from v2-all-trucks to something more generic, v2-product-listing
  • Renaming block would entail also to rename variables and classnames (like truckElement, truckImageWrapper v2-all-trucks__truck-image)
• Functionality for filtering should only be executed when the variant with-filter is applied to the block.
  • Roughly the last part of the code should only be executed when variant with-filter is enabled
  • The All Trucks page will be updated to contain this variant
• When hovering the product image, white background should show
• When hovering the primary button, the product background image and white background should show

[DanielaPedrochevd]

propose design change to use the same solution #136

[cogniSyb]

Questions:

• Secondary buttons are used in this listing, could we make them primary, as in All Trucks?
• GT America is used in the headings. in All Trucks Helvetica Neue LT Pro is being used. On both pages these headings will be H2 level. Could we change the headings in All Trucks to GT America?

[DanielaPedrochevd]

@WendyKruger can you answer Syb's questions please?

[cogniSyb]

• Secondary buttons are used in this listing, could we make them primary, as in All Trucks?
• GT America is used in the headings. in All Trucks Helvetica Neue LT Pro is being used. On both pages these headings will be H2 level. Could we change the headings in All Trucks to GT America?

Questions have been answered with a 'yes' during the last meeting

[mollyaljenkins]

• Ability to show block without filtering (the block on diesel engines page doesn’t filter)
• Should be able to include v2-pencil-promo, FR: Pencil Promo block #108 (as per design)
  • Filtering interaction should work on the pencil-promo block that is included

Zoe to work with Wendy to create this ticket

[shirin27]

Kamino cloned this issue to hlxsites/vg-macktrucks-com