Build a Component for Rounded Containers with Rich Content #316
Description
- Component or Package Name: jsx-email
- Component or Package Version: 2.7.0
Feature Use Case
I have a Button that has rich content and rounded corners. This renders perfectly fine for modern Clients but does not work with Outlook: It generates a roundrect vml that displays a rounded button, but the rich content is not inside that button but rendered below.
There is a hack for this using shapes in the corners with additional table cells:
https://kontent.ai/blog/emails-outlook-containers-rounded-courners/
I can write this using the <Raw /> and <Conditional /> component, but this is tedious.
Feature Proposal
I would like to have a Component or option in existing components that does this automatically. For example, when using a <Container />, it should optimally recognize the Tailwind "rounded" class and add the vml comments from the article above. I don't know if that already happens, otherwise this sounds like a lot of work. Alternatively a simple <RoundRichContainer /> which always places these would also suffice.
Thank you in advance for considering it.