mirror of
https://github.com/NoRedInk/noredink-ui.git
synced 2024-09-11 07:05:38 +03:00
Message.V1 replaces BannerAlert.V6.custom
This commit is contained in:
parent
5afa50ca9c
commit
fdf69538ce
@ -72,3 +72,18 @@ upgrade_Nri_Ui_BannerAlert_V6_success content maybeOnDismiss =
|
||||
[ Maybe.map Message.onDismiss maybeOnDismiss
|
||||
]
|
||||
)
|
||||
|
||||
|
||||
upgrade_Nri_Ui_BannerAlert_V6_custom config =
|
||||
Message.banner
|
||||
(Message.Custom
|
||||
{ color = config.color
|
||||
, backgroundColor = config.backgroundColor
|
||||
, icon = config.icon
|
||||
}
|
||||
)
|
||||
(Message.Html config.content)
|
||||
(List.filterMap identity
|
||||
[ Maybe.map Message.onDismiss config.dismiss
|
||||
]
|
||||
)
|
||||
|
@ -38,6 +38,11 @@ type Theme
|
||||
| Warning
|
||||
| Tip
|
||||
| Success
|
||||
| Custom
|
||||
{ color : Color
|
||||
, backgroundColor : Color
|
||||
, icon : Svg
|
||||
}
|
||||
|
||||
|
||||
{-| Prefer using the simplest variant that meets your needs.
|
||||
@ -75,6 +80,8 @@ contentToHtml content =
|
||||
view =
|
||||
Message.tiny Message.Tip (Message.Markdown "Don't tip too much, or your waitress will **fall over**!")
|
||||
|
||||
NOTE: When using a `Custom` theme, `tiny` ignores the custom `backgroundColor`.
|
||||
|
||||
-}
|
||||
tiny : Theme -> Content msg -> Html msg
|
||||
tiny theme content =
|
||||
@ -107,6 +114,11 @@ tiny theme content =
|
||||
)
|
||||
, alertString Colors.greenDarkest content
|
||||
]
|
||||
|
||||
Custom config ->
|
||||
[ iconContainer [ color config.color ] (NriSvg.toHtml config.icon)
|
||||
, alertString config.color content
|
||||
]
|
||||
in
|
||||
Nri.Ui.styled div
|
||||
"Nri-Ui-Message-V1--tiny"
|
||||
@ -213,6 +225,12 @@ banner theme content attr =
|
||||
}
|
||||
}
|
||||
|
||||
Custom customTheme ->
|
||||
{ backgroundColor = customTheme.backgroundColor
|
||||
, color = customTheme.color
|
||||
, icon = NriSvg.toHtml customTheme.icon
|
||||
}
|
||||
|
||||
attributes =
|
||||
bannerConfigFromAttributes attr
|
||||
in
|
||||
|
@ -5,7 +5,6 @@ import Css
|
||||
import Example exposing (Example)
|
||||
import Html.Styled as Html exposing (Html, a, div, h3, pre, text)
|
||||
import Html.Styled.Attributes as Attributes exposing (href, title)
|
||||
import Nri.Ui.BannerAlert.V6 as BannerAlert
|
||||
import Nri.Ui.Callout.V1 as Callout exposing (callout)
|
||||
import Nri.Ui.Colors.V1 as Colors
|
||||
import Nri.Ui.Heading.V2 as Heading
|
||||
@ -53,6 +52,14 @@ example =
|
||||
, Message.tiny Message.Warning (Message.Markdown "This is a **warning**")
|
||||
, Message.tiny Message.Tip (Message.Markdown "This is a **tip**")
|
||||
, Message.tiny Message.Success (Message.Markdown "This is a **success**")
|
||||
, Message.tiny
|
||||
(Message.Custom
|
||||
{ color = Colors.aquaDark
|
||||
, backgroundColor = Colors.gray92
|
||||
, icon = Pennant.premiumFlag
|
||||
}
|
||||
)
|
||||
(Message.Markdown "This is a **custom theme**")
|
||||
, Html.hr [] []
|
||||
, Heading.h3 [] [ text "Message.somethingWentWrong" ]
|
||||
, Message.somethingWentWrong exampleRailsError
|
||||
@ -89,13 +96,15 @@ example =
|
||||
[]
|
||||
, pre [] [ text "BannerAlert.neutral [ text \"This is a neutral message!\" ] Nothing" ]
|
||||
, h3 [] [ text "custom" ]
|
||||
, BannerAlert.custom
|
||||
{ color = Colors.aquaDark
|
||||
, backgroundColor = Colors.gray92
|
||||
, icon = Pennant.premiumFlag
|
||||
, content = [ text "This is a a custom message!" ]
|
||||
, dismiss = Nothing
|
||||
}
|
||||
, Message.banner
|
||||
(Message.Custom
|
||||
{ color = Colors.aquaDark
|
||||
, backgroundColor = Colors.gray92
|
||||
, icon = Pennant.premiumFlag
|
||||
}
|
||||
)
|
||||
(Message.Html [ text "This is a a custom message!" ])
|
||||
[]
|
||||
, pre []
|
||||
[ text
|
||||
"""BannerAlert.custom
|
||||
|
Loading…
Reference in New Issue
Block a user