Builds the border radius to pass to ShadowBevel.

Cards are used to group similar concepts and tasks together for merchants to scan, read, and get things done. It displays content in a familiar and recognizable style.

Examples

<.card><.text as="h2">Content inside a card</.text></.card> <.card rounded_above="sm" background="bg-surface-secondary" padding="400"><.text as="h2">Content inside a card</.text></.card> See

• https://polaris.shopify.com/components/layout-and-structure/card
• https://github.com/Shopify/polaris/blob/main/polaris-react/src/components/Card/tests/Card.test.tsx

Attributes

• background (:string) - Defaults to "bg-surface".
• border_radius (:list) - Border Radius passed to the ShadowBevel.
• padding (:list) - A tuple with the size and Space token. Defaults to [xs: "400"].
• class (:any) - A class name to be added to the component class name. Defaults to "".
• rounded_above (:string) - Border radius value above a set breakpoint.Must be one of "xs", "sm", "md", "lg", or "xl".
• style (:string) - Style attribute.
• display (:string) - Style attribute.
• margin (:string) - Style attribute.
• max_height (:string) - Style attribute.
• min_height (:string) - Style attribute.
• object_fit (:string) - Style attribute.
• flex_grow (:string) - Style attribute.
• justify_content (:string) - Style attribute.
• grid_auto_rows (:string) - Style attribute.
• grid_template_columns (:string) - Style attribute.
• grid_template_rows (:string) - Style attribute.
• align_items (:string) - Style attribute.
• align_self (:string) - Style attribute.
• Global attributes are accepted.

Slots

• inner_block (required)