Closed DanielaPedrochevd closed 8 months ago
@WendyKruger @HaycockJill The figma file https://www.figma.com/file/oNwe2jHIICPMIe551EY62l/Mack-Reskin---Full-Project?type=design&node-id=2220-82436&mode=dev contains extra text that is not displayed in the block's desktop version. We consider this a design discrepancy and will go for the desktop design, the mobile viewport design should be the same (no extra description text).
@WendyKruger @HaycockJill As it is very complex to achieve the "comparison slider functionality" within a section of the Mack Trucks Features block #191 Would you agree we add said slider to this block instead to achieve the comparison look?
@WendyKruger @HaycockJill As it is very complex to achieve the "comparison slider functionality" within a section of the Mack Trucks Features block #191 Would you agree we add said slider to this block instead to achieve the comparison look?
I'm open to seeing what that would look like.
@WendyKruger @HaycockJill The figma file https://www.figma.com/file/oNwe2jHIICPMIe551EY62l/Mack-Reskin---Full-Project?type=design&node-id=2220-82436&mode=dev contains extra text that is not displayed in the block's desktop version. We consider this a design discrepancy and will go for the desktop design, the mobile viewport design should be the same (no extra description text).
Yes, definitely a design error. Not sure why that text is in there to be honest. But... would we be able to have the option for text in both the desktop and mobile? Ok to make this an enhancement if needed.
@DanielaPedrochevd I assume we should use responsive images here like in Hero block?
Yes, please but keep in mind AC "For the comparison variant, the model names would take maximum 50% of the width and would be aligned to either corner of the wrapper. If the content is too long, it will wrap." and "On mobile, the image will be as wide as the viewport. On desktop, it will be as wide as the content wrapper (1040px)"
@DanielaPedrochevd May you show me the image resources for responsive images?
@WendyKruger Can you support Marko on the above comment? In the meantime, he will use a dummy image to continue development.
Validated and able to get the correct result and hence, marking the issue to done status
Summary:
Agile requirement As a content editor, I want to be able to add a block that contains an image, a title, and a button with a white or grey background to achieve the design.
Description Develop a block with two variants.
The design follows these figma files:
The different background colors will be handled by the sections.
Acceptance criteria
Solution Direction https://cloudfour.com/thinks/building-an-accessible-image-comparison-web-component/