NoRedInk/noredink-ui
1
1
Fork 0
mirror of https://github.com/NoRedInk/noredink-ui.git synced 2024-09-22 12:48:43 +03:00
Code Issues Packages Projects Releases Wiki Activity

Add a helper for the close button

Browse Source
This commit is contained in:
Tessa Kelly 2020-09-02 14:32:57 -07:00
parent 1c184d8179
commit 1eda22c565
1 changed files with 14 additions and 24 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

38
styleguide-app/Examples/Modal.elm
View File

@ -164,12 +164,7 @@ makeFocusManager settings =
, Button.large , Button.large
, Button.custom [ modalOptions.autofocusElement ] , Button.custom [ modalOptions.autofocusElement ]
] ]
, ClickableText.button "Close" , closeClickableText modalOptions.lastFocusableElement
[ ClickableText.onClick ForceClose
, ClickableText.large
, ClickableText.custom modalOptions.lastFocusableElement
, ClickableText.css [ Css.marginTop (Css.px 12) ]
]
] ]
} }
@ -181,12 +176,7 @@ makeFocusManager settings =
, viewModalContent settings.content , viewModalContent settings.content
] ]
, footer = , footer =
[ ClickableText.button "Close" [ closeClickableText (modalOptions.autofocusElement :: modalOptions.lastFocusableElement)
[ ClickableText.onClick ForceClose
, ClickableText.large
, ClickableText.custom (modalOptions.autofocusElement :: modalOptions.lastFocusableElement)
, ClickableText.css [ Css.marginTop (Css.px 12) ]
]
] ]
} }
@ -229,12 +219,7 @@ makeFocusManager settings =
, Button.custom (modalOptions.autofocusElement :: modalOptions.firstFocusableElement) , Button.custom (modalOptions.autofocusElement :: modalOptions.firstFocusableElement)
, Button.large , Button.large
] ]
, ClickableText.button "Close" , closeClickableText modalOptions.lastFocusableElement
[ ClickableText.onClick ForceClose
, ClickableText.large
, ClickableText.custom modalOptions.lastFocusableElement
, ClickableText.css [ Css.marginTop (Css.px 12) ]
]
] ]
} }
@ -243,12 +228,7 @@ makeFocusManager settings =
(\{ onlyFocusableElement } -> (\{ onlyFocusableElement } ->
{ content = [ viewModalContent settings.content ] { content = [ viewModalContent settings.content ]
, footer = , footer =
[ ClickableText.button "Close" [ closeClickableText onlyFocusableElement
[ ClickableText.onClick ForceClose
, ClickableText.large
, ClickableText.custom onlyFocusableElement
, ClickableText.css [ Css.marginTop (Css.px 12) ]
]
] ]
} }
) )
@ -286,6 +266,16 @@ viewModalContent content =
] ]
closeClickableText : List (Html.Attribute Msg) -> Html Msg
closeClickableText attributes =
ClickableText.button "Close"
[ ClickableText.onClick ForceClose
, ClickableText.large
, ClickableText.custom attributes
, ClickableText.css [ Css.marginTop (Css.px 15) ]
]
{-| -} {-| -}
type Msg type Msg
= OpenModal String = OpenModal String