✏️ Use Nri.Ui.styled data attribute helpers

This commit is contained in:
Tessa Kelly 2018-08-16 16:56:20 -07:00
parent 5a43d7ef67
commit c2ff2afd15

View File

@ -21,6 +21,7 @@ import Css.Foreign
import Html.Styled exposing (fromUnstyled)
import Html.Styled.Attributes exposing (css)
import Markdown
import Nri.Ui
import Nri.Ui.Colors.V1 as Colors
import Nri.Ui.Fonts.V1 as Fonts
import Nri.Ui.Icon.V3 as Icon
@ -72,19 +73,19 @@ warning assets content =
alert : List (Html msg) -> Html msg
alert =
Html.div
[ css
Nri.Ui.styled Html.div
"Nri-Ui-Alert-V2__alert"
[ Css.displayFlex
, Css.padding4 (Css.px 6) (Css.px 8) (Css.px 8) (Css.px 30)
, Css.position Css.relative
]
]
[]
iconContainer : List Css.Style -> Html msg -> Html msg
iconContainer styles icon =
Html.div
[ css
Nri.Ui.styled Html.div
"Nri-Ui-Alert-V2__iconContainer"
(styles
++ [ -- Positioning
Css.position Css.absolute
@ -104,14 +105,14 @@ iconContainer styles icon =
, Css.minWidth (Css.px 25)
]
)
]
[]
[ icon ]
viewAlertContent : Css.ColorValue compatible -> String -> Html.Styled.Html msg
viewAlertContent color content =
Html.div
[ css
Nri.Ui.styled Html.div
"Nri-Ui-Alert-V2__viewAlertContent"
[ Css.color color
, Fonts.baseFont
, Css.fontSize (Css.px 13)
@ -119,5 +120,5 @@ viewAlertContent color content =
, Css.listStyleType Css.none
, Css.Foreign.descendants [ Css.Foreign.p [ Css.margin Css.zero ] ]
]
]
[]
(Markdown.toHtml Nothing content |> List.map fromUnstyled)