Message.V1 replaces BannerAlert.V6.neutral, success, error

This commit is contained in:
Aaron VonderHaar 2020-04-27 16:35:24 -07:00
parent 3efc6fcf8f
commit 5afa50ca9c
3 changed files with 86 additions and 18 deletions

View File

@ -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
]
)

View File

@ -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

View File

@ -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