[Figma] Callout with media

[RichKummer]

Add the Callout with media component to Figma kit. Remember we are only building variants for xlg, md, and sm.

Design specs Website

Must haves:

• [ ] Content should be flexible - the designer should be able to condense or stretch the component and the content should respond. Removing text for example should maintain the right padding automatically through auto layout.
• [ ] This component uses a fluid type token for the heading. If this is not created already, create a base to help swap the header type based on breakpoint size. See Content group in the library. This should be tested with for Cards.
• [ ] Bring in any Image or Video components directly into the _Base component.
• [ ] Designers should be able to toggle Copy on or off.
• [ ] Designer should be able to include Image, Video, or no media as a variant.
• [ ] The header is a fluid typeface, consider creating a separate base to handle the responsive type.

Resources

• C4IBM.com Component checklist is available in the Read Me 👀 page of the Figma library
• Bases demo from the Figma Fridays (Episode 23)
• Reference the best practices from Figma guild
• Info on auto layout

[RichKummer]

Moved off to fix sizing issue with Image with caption

[stale[bot]]

We've marked this issue as stale because there hasn't been any activity for 60 days. If there's no further activity on this issue in the next three days then we'll close it. You can keep the conversation going with just a short comment. Thanks for your contributions.