Netcentric / vg-macktrucks-com-rd

Franklin Site Redesign for https://www.macktrucks.com
Apache License 2.0
1 stars 12 forks source link

FR: V2 Columns Block variation #133

Closed DanielaPedrochevd closed 10 months ago

DanielaPedrochevd commented 1 year ago

Agile Requirement

As a Business Owner, I want to display an image with a card as in the following design -> https://www.figma.com/file/oNwe2jHIICPMIe551EY62l/Mack-Reskin---Full-Project?type=design&node-id=2220-85452&mode=dev so that clients can get more information on the segment they have selected and access the trucks page of the different trucks related to the segment as well as the truck builder (if they have one)

Description

Edit the existing V2 columns block to allow for a white card background, a red line above the title, a text list and the addition of two possible buttons (build and explore).

Acceptance Criteria

  1. The columns block can have a white card background, a red line above the title, a text list and the addition of two possible buttons (build and explore).
  2. The new additions to the existing V2 columns block follow the design-> https://www.figma.com/file/oNwe2jHIICPMIe551EY62l/Mack-Reskin---Full-Project?type=design&node-id=2220-85452&mode=dev
  3. If the truck is available in the builder, then the "build" button is displayed, if not, only the "explore" button is displayed.
DanielaPedrochevd commented 1 year ago

Technical hints:

We can leave a white background in the primary version for the background image. For the list we should adjust the standard typography to allow for it. The red line is already available (Header with mark). -> Check V2 Hero implementation, for example. We should make use of the Franklin functionality to show the secondary button.

This ticket has to be picked up after merging #119

DanielaPedrochevd commented 11 months ago

This was initially planned for sprint 9 but Santiago could pick it up early :)

girishdigrajkar commented 10 months ago

Validated and able to get the correct results; Closing the issue.