Nri.Ui.Mark.V5

- Fix line-height for spacer element reducing the amount of vertical space consumed by the balloons
- Fix SR experience for <mark> tags

- Remove `LabelState` from API, the consumer will manage animations through `labelCss`

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

, labelCss : List Style

, 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)

NoRedInk/noredink-ui/27.8.2