PF6.Card

PF6 Card component

A card is a square or rectangular container that can contain any kind of content. Cards symbolize units of information, and each one acts as an entry point for users to access more details.

See: https://www.patternfly.org/components/card

Definition

type Card msg

Opaque Card type

Constructor

card : List (Element msg) -> Card msg

Construct a Card with body content

withTitle : String -> Card msg -> Card msg

Add a title to the card header

withFooter : Element msg -> Card msg -> Card msg

Add footer content

withActions : Element msg -> Card msg -> Card msg

Add actions element to the card header (top-right)

Variant modifiers

withSelectable : Card msg -> Card msg

Make the card selectable (adds hover/cursor pointer behavior)

withSelected : Card msg -> Card msg

Mark the card as currently selected

withFlat : Card msg -> Card msg

Flat card — no box shadow

withCompact : Card msg -> Card msg

Compact card — reduced padding

withRounded : Card msg -> Card msg

Rounded card — larger border radius

Layout modifiers

withBodyPadding : Int -> Card msg -> Card msg

Set body padding

withBodyPaddingXY : Int -> Int -> Card msg -> Card msg

Set body padding on x and y axes

withBodySpacing : Int -> Card msg -> Card msg

Set spacing between body elements

Rendering

toMarkup : Theme -> Card msg -> Element msg

Render the Card as an Element msg

lenards/elm-ui-patternfly/4.0.2