Nri.Ui.Mark.V3

type alias Mark =

{ name : Maybe String

, startStyles : List Style

, styles : List Style

, endStyles : List Style

}

(content -> List Style -> Html msg)

-> List ( content, Maybe Mark )

-> List (Html msg)

When elements are marked, wrap them in a single mark html node.

(content -> List Style -> Html msg)

-> List ( content, Maybe Mark )

-> List (Html msg)

When elements are marked, wrap them in a single mark html node.

Show the label for the mark, if present, in-line with the emphasized content.

{ renderSegment : c -> List Style -> Html msg

, backgroundColor : Color

, maybeMarker : Maybe Mark

, labelPosition : Maybe LabelPosition

, labelState : LabelState

, labelId : Maybe String

, labelContentId : Maybe String

}

-> List c

-> List (Html msg)

When elements are marked, wrap them in a single mark html node.

Show the label for the mark, if present, in a balloon centered above the emphasized content.

(content -> List Style -> Html msg)

-> List ( content, List Mark )

-> List (Html msg)

When elements are marked, add ::before and ::after elements indicating the start and end of the highlight.

(We can't use a mark HTML element here because of the tree structure of HTML)

= Visible

| FadeOut

Controls label animations.

Visible will fade in when first displayed. FadeOut will start visible and then fade out.

NoRedInk/noredink-ui/27.7.0