Designsystemet.Paragraph

Body text: a <p> with Designsystemet's paragraph styles.

Mirrors Paragraph from @digdir/designsystemet-react.

Paragraph.view [ Paragraph.long ]
    [ Html.text "Saken er sendt til behandling. Du får svar innen tre uker." ]

React → Elm

view : List (Attribute msg) -> List (Html msg) -> Html msg

A <p class="ds-paragraph">.

(List (Attribute msg) -> List (Html msg) -> Html msg)

-> List (Attribute msg)

-> List (Html msg)

-> Html msg

Paragraph styles on another element (React's asChild), e.g. when the text contains block elements that can't go in a <p>.

Paragraph.viewAs Html.div [] [ Html.text "Vedlegg:", attachmentList ]

Line height for long or short text. Leave it out for the default.

long : Attribute msg

More line height, for long running text like articles.

short : Attribute msg

Less line height, for short text like an ingress or a card summary.

type Size

= ExtraSmall

| Small

| Medium

| Large

| ExtraLarge

Paragraphs have their own size scale, wider than Designsystemet.Size.

size : Size -> Attribute msg

Set the paragraph's data-size.