diff --git a/elm-refactor/v8-to-v9/MessageV1.elm b/elm-refactor/v8-to-v9/MessageV1.elm index 5879277b..34231487 100644 --- a/elm-refactor/v8-to-v9/MessageV1.elm +++ b/elm-refactor/v8-to-v9/MessageV1.elm @@ -45,3 +45,30 @@ upgrade_Nri_Ui_BannerAlert_V6_alert content maybeOnDismiss = [ Maybe.map Message.onDismiss maybeOnDismiss ] ) + + +upgrade_Nri_Ui_BannerAlert_V6_error content maybeOnDismiss = + Message.banner Message.Error + (Message.Html content) + (List.filterMap identity + [ Maybe.map Message.onDismiss maybeOnDismiss + ] + ) + + +upgrade_Nri_Ui_BannerAlert_V6_neutral content maybeOnDismiss = + Message.banner Message.Tip + (Message.Html content) + (List.filterMap identity + [ Maybe.map Message.onDismiss maybeOnDismiss + ] + ) + + +upgrade_Nri_Ui_BannerAlert_V6_success content maybeOnDismiss = + Message.banner Message.Success + (Message.Html content) + (List.filterMap identity + [ Maybe.map Message.onDismiss maybeOnDismiss + ] + ) diff --git a/src/Nri/Ui/Message/V1.elm b/src/Nri/Ui/Message/V1.elm index 28bcc732..38667493 100644 --- a/src/Nri/Ui/Message/V1.elm +++ b/src/Nri/Ui/Message/V1.elm @@ -165,6 +165,18 @@ banner theme content attr = let config = case theme of + Error -> + { backgroundColor = Colors.purpleLight + , color = Colors.purpleDark + , icon = + inCircle + { backgroundColor = Colors.purple + , color = Colors.white + , height = Css.px 25 + , icon = UiIcon.attention + } + } + Warning -> { backgroundColor = Colors.sunshine , color = Colors.navy @@ -177,8 +189,29 @@ banner theme content attr = } } - _ -> - Debug.todo "other themes" + Tip -> + { backgroundColor = Colors.frost + , color = Colors.navy + , icon = + inCircle + { backgroundColor = Colors.navy + , color = Colors.mustard + , height = Css.px 32 + , icon = UiIcon.bulb + } + } + + Success -> + { backgroundColor = Colors.greenLightest + , color = Colors.greenDarkest + , icon = + inCircle + { backgroundColor = Colors.green + , color = Colors.white + , height = Css.px 20 + , icon = UiIcon.checkmark + } + } attributes = bannerConfigFromAttributes attr diff --git a/styleguide-app/Examples/Message.elm b/styleguide-app/Examples/Message.elm index f77aecc5..77f1a4a3 100644 --- a/styleguide-app/Examples/Message.elm +++ b/styleguide-app/Examples/Message.elm @@ -73,14 +73,20 @@ example = div [] [ h3 [] [ text "success" ] - , BannerAlert.success [ text "Nice! The alert message was dismissed. 👍" ] Nothing + , Message.banner Message.Success + (Message.Html [ text "Nice! The alert message was dismissed. 👍" ]) + [] , pre [] [ text "BannerAlert.success [ text \"Nice! The alert message was dismissed. 👍\" ] Nothing" ] ] , h3 [] [ text "error" ] - , BannerAlert.error [ text "This is an error message!" ] Nothing + , Message.banner Message.Error + (Message.Html [ text "This is an error message!" ]) + [] , pre [] [ text "BannerAlert.error [ text \"This is an error message!\" ] Nothing" ] , h3 [] [ text "neutral" ] - , BannerAlert.neutral [ text "This is a neutral message!" ] Nothing + , Message.banner Message.Tip + (Message.Html [ text "This is a neutral message!" ]) + [] , pre [] [ text "BannerAlert.neutral [ text \"This is a neutral message!\" ] Nothing" ] , h3 [] [ text "custom" ] , BannerAlert.custom @@ -102,20 +108,22 @@ example = """ ] , h3 [] [ text "with multi-line link and icon" ] - , BannerAlert.success - [ text "Click " - , a [ href "http://www.noredink.com", Attributes.target "_blank" ] - [ text - """here, yes, HERE, right here on this very long success message. - Wow, how successful! You're the biggest success I've ever seen! - You should feel great about yourself! Give yourself a very big round of applause! - """ - , div [ Attributes.css [ Css.display Css.inlineBlock, Css.width (Css.px 20) ] ] - [ Svg.toHtml UiIcon.gear ] + , Message.banner Message.Success + (Message.Html + [ text "Click " + , a [ href "http://www.noredink.com", Attributes.target "_blank" ] + [ text + """here, yes, HERE, right here on this very long success message. + Wow, how successful! You're the biggest success I've ever seen! + You should feel great about yourself! Give yourself a very big round of applause! + """ + , div [ Attributes.css [ Css.display Css.inlineBlock, Css.width (Css.px 20) ] ] + [ Svg.toHtml UiIcon.gear ] + ] + , text " to check out NoRedInk." ] - , text " to check out NoRedInk." - ] - Nothing + ) + [] , pre [] [ text """ BannerAlert.success