mirror of
https://github.com/NoRedInk/noredink-ui.git
synced 2024-11-28 18:24:04 +03:00
Keep the premium flag around
This commit is contained in:
parent
f918183bc6
commit
74b1ec9eeb
@ -122,13 +122,13 @@ buildCheckbox assets modifierClasses model labelContent =
|
||||
, display inlineBlock
|
||||
, case model.selected of
|
||||
Selected ->
|
||||
backgroundImage (assetPathUrl assets.checkboxChecked_svg)
|
||||
backgroundImage assets.checkboxChecked_svg
|
||||
|
||||
NotSelected ->
|
||||
backgroundImage (assetPathUrl assets.checkboxUnchecked_svg)
|
||||
backgroundImage assets.checkboxUnchecked_svg
|
||||
|
||||
PartiallySelected ->
|
||||
backgroundImage (assetPathUrl assets.checkboxCheckedPartially_svg)
|
||||
backgroundImage assets.checkboxCheckedPartially_svg
|
||||
, Css.batch <|
|
||||
case colorTheme of
|
||||
Gray ->
|
||||
@ -145,7 +145,7 @@ buildCheckbox assets modifierClasses model labelContent =
|
||||
{ containerClasses = toClassList (modifierClasses ++ [ "LockOnInsideClass" ])
|
||||
, labelStyles =
|
||||
css
|
||||
[ backgroundImage (assetPathUrl assets.checkboxLockOnInside_svg)
|
||||
[ backgroundImage assets.checkboxLockOnInside_svg
|
||||
, backgroundRepeat noRepeat
|
||||
, backgroundSize (px 24)
|
||||
, color Colors.gray20
|
||||
@ -168,7 +168,7 @@ buildCheckbox assets modifierClasses model labelContent =
|
||||
}
|
||||
|
||||
Premium ->
|
||||
{ containerClasses = toClassList (modifierClasses ++ [ "SquareClass", "PremiumClass" ])
|
||||
{ containerClasses = toClassList (modifierClasses ++ [ "SquareClass" ])
|
||||
, labelStyles = premiumLabelStyles assets.iconPremiumFlag_svg model
|
||||
, labelClasses = labelClass model.selected
|
||||
, labelContent = labelContent
|
||||
@ -289,7 +289,7 @@ premiumLabelStyles image model =
|
||||
, width (px 26)
|
||||
, height (px 24)
|
||||
, marginLeft (px 8)
|
||||
, backgroundImage (assetPathUrl image)
|
||||
, backgroundImage image
|
||||
, backgroundRepeat noRepeat
|
||||
, backgroundPosition Css.center
|
||||
]
|
||||
@ -302,16 +302,6 @@ premiumLabelStyles image model =
|
||||
)
|
||||
|
||||
|
||||
assetPathUrl : Asset -> BackgroundImage {}
|
||||
assetPathUrl =
|
||||
url << Nri.Ui.AssetPath.Css.url
|
||||
|
||||
|
||||
indeterminateAttr : RootHtml.Attribute msg
|
||||
indeterminateAttr =
|
||||
RootAttributes.property "indeterminate" (Json.Encode.bool True)
|
||||
|
||||
|
||||
{-| -}
|
||||
type Theme
|
||||
= Square ColorTheme
|
||||
@ -333,7 +323,11 @@ type alias Assets r =
|
||||
, checkboxChecked_svg : Asset
|
||||
, checkboxCheckedPartially_svg : Asset
|
||||
, iconPremiumUnlocked_png : Asset
|
||||
, iconPremiumLocked_png : Asset
|
||||
, checkboxLockOnInside_svg : Asset
|
||||
, iconPremiumFlag_svg : Asset
|
||||
}
|
||||
|
||||
|
||||
backgroundImage =
|
||||
Nri.Ui.AssetPath.Css.url
|
||||
>> property "background-image"
|
||||
|
@ -7,7 +7,10 @@ module Nri.Ui.PremiumCheckbox.V1 exposing (PremiumConfig, premium)
|
||||
-}
|
||||
|
||||
import Accessibility.Styled as Html
|
||||
import Css exposing (..)
|
||||
import Html.Styled.Attributes as Attributes exposing (css)
|
||||
import Nri.Ui.AssetPath exposing (Asset(..))
|
||||
import Nri.Ui.AssetPath.Css
|
||||
import Nri.Ui.Checkbox.V3 as Checkbox
|
||||
import Nri.Ui.Data.PremiumLevel as PremiumLevel exposing (PremiumLevel(..))
|
||||
|
||||
@ -55,19 +58,41 @@ premium assets config =
|
||||
else
|
||||
Checkbox.Square Checkbox.Default
|
||||
in
|
||||
Checkbox.viewWithLabel assets
|
||||
{ identifier = config.id
|
||||
, label = config.label
|
||||
, setterMsg =
|
||||
if isLocked then
|
||||
\_ -> config.onLockedClick
|
||||
else
|
||||
config.onChange
|
||||
, selected = config.selected
|
||||
, disabled = config.disabled
|
||||
, theme = theme
|
||||
, noOpMsg = config.noOpMsg
|
||||
}
|
||||
Html.span []
|
||||
[ Checkbox.viewWithLabel assets
|
||||
{ identifier = config.id
|
||||
, label = config.label
|
||||
, setterMsg =
|
||||
if isLocked then
|
||||
\_ -> config.onLockedClick
|
||||
else
|
||||
config.onChange
|
||||
, selected = config.selected
|
||||
, disabled = config.disabled
|
||||
, theme = theme
|
||||
, noOpMsg = config.noOpMsg
|
||||
}
|
||||
, if
|
||||
(isLocked && config.showFlagWhenLocked)
|
||||
|| (not isLocked && config.contentPremiumLevel /= Free)
|
||||
then
|
||||
Html.div
|
||||
[ Attributes.class "checkbox-PremiumClass"
|
||||
, css
|
||||
[ property "content" "''"
|
||||
, display inlineBlock
|
||||
, width (px 26)
|
||||
, height (px 24)
|
||||
, marginLeft (px 8)
|
||||
, backgroundImage assets.iconPremiumFlag_svg
|
||||
, backgroundRepeat noRepeat
|
||||
, backgroundPosition Css.center
|
||||
]
|
||||
]
|
||||
[]
|
||||
else
|
||||
Html.text ""
|
||||
]
|
||||
|
||||
|
||||
{-| The assets used in this module.
|
||||
@ -82,3 +107,8 @@ type alias Assets r =
|
||||
, checkboxLockOnInside_svg : Asset
|
||||
, iconPremiumFlag_svg : Asset
|
||||
}
|
||||
|
||||
|
||||
backgroundImage =
|
||||
Nri.Ui.AssetPath.Css.url
|
||||
>> property "background-image"
|
||||
|
Loading…
Reference in New Issue
Block a user