NoRedInk / noredink-ui / Nri.Ui.Mark.V2

Patch changes


type alias Mark =
{ name : Maybe String
, startStyles : List Css.Style
, styles : List Css.Style
, endStyles : List Css.Style 
}

view : (content -> List Css.Style -> Html.Styled.Html msg) -> List ( content, Maybe Mark ) -> List (Html.Styled.Html msg)

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

viewWithInlineTags : (content -> List Css.Style -> Html.Styled.Html msg) -> List ( content, Maybe Mark ) -> List (Html.Styled.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.

viewWithBalloonTags : { renderSegment : c -> List Css.Style -> Html.Styled.Html msg, backgroundColor : Css.Color, maybeMarker : Maybe Mark, labelPosition : Maybe LabelPosition, labelId : Maybe String, labelContentId : Maybe String } -> List c -> List (Html.Styled.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.

viewWithOverlaps : (content -> List Css.Style -> Html.Styled.Html msg) -> List ( content, List Mark ) -> List (Html.Styled.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)