diff --git a/elm-refactor/v8-to-v9/MessageV1.elm b/elm-refactor/v8-to-v9/MessageV1.elm index 7416c5d8..6f7adb57 100644 --- a/elm-refactor/v8-to-v9/MessageV1.elm +++ b/elm-refactor/v8-to-v9/MessageV1.elm @@ -10,5 +10,9 @@ upgrade_Nri_Ui_Alert_V4_error content = Message.tiny Message.Error (Message.Markdown content) +upgrade_Nri_Ui_Alert_V4_success content = + Message.tiny Message.Success (Message.Markdown content) + + upgrade_Nri_Ui_Alert_V4_somethingWentWrong errorMessageForEngineers = Message.somethingWentWrong errorMessageForEngineers diff --git a/src/Nri/Ui/Message/V1.elm b/src/Nri/Ui/Message/V1.elm index fdf3321b..365660ad 100644 --- a/src/Nri/Ui/Message/V1.elm +++ b/src/Nri/Ui/Message/V1.elm @@ -22,12 +22,13 @@ import Markdown import Nri.Ui import Nri.Ui.Colors.V1 as Colors import Nri.Ui.Fonts.V1 as Fonts -import Nri.Ui.SpriteSheet exposing (exclamationMark) +import Nri.Ui.SpriteSheet as SpriteSheet exposing (exclamationMark) import Nri.Ui.Svg.V1 as NriSvg exposing (Svg) type Theme = Error + | Success type Content msg @@ -45,9 +46,21 @@ tiny theme content = [ exclamation Colors.purple , alertString Colors.purple content ] + + Success -> + [ iconContainer + [ Css.color Colors.white + , Css.backgroundColor Colors.green + ] + (Html.div + [ css [ Css.width (Css.px 12), Css.marginTop (Css.px 1) ] ] + [ NriSvg.toHtml SpriteSheet.checkmark ] + ) + , alertString Colors.greenDarkest content + ] in Nri.Ui.styled Html.div - "Nri-Ui-Alert-V3__alert" + "Nri-Ui-Message-V1--alert" [ Css.displayFlex , Css.justifyContent Css.start , Css.alignItems Css.flexStart @@ -113,7 +126,7 @@ exclamation backgroundColor = iconContainer : List Css.Style -> Html msg -> Html msg iconContainer styles icon = Nri.Ui.styled Html.div - "Nri-Ui-Alert-V4__iconContainer" + "Nri-Ui-Message-V1--iconContainer" (styles ++ [ -- Content positioning Css.displayFlex @@ -148,7 +161,7 @@ alertString color content = [ html ] in Nri.Ui.styled Html.div - "Nri-Ui-Alert-V4--alert" + "Nri-Ui-Message-V1--alert" [ Css.color color , Fonts.baseFont , Css.fontSize (Css.px 13) diff --git a/styleguide-app/Examples/Message.elm b/styleguide-app/Examples/Message.elm index 06a59668..127f0c8b 100644 --- a/styleguide-app/Examples/Message.elm +++ b/styleguide-app/Examples/Message.elm @@ -53,7 +53,7 @@ example = , Message.tiny Message.Error (Message.Markdown "This is an **error**") , Alert.warning "This is a **warning**" , Alert.tip "This is a **tip**" - , Alert.success "This is a **success**" + , Message.tiny Message.Success (Message.Markdown "This is a **success**") , Html.hr [] [] , Heading.h3 [] [ text "Message.somethingWentWrong" ] , Message.somethingWentWrong exampleRailsError