NoRedInk/noredink-ui
1
1
Fork 0
mirror of https://github.com/NoRedInk/noredink-ui.git synced 2024-09-21 04:07:54 +03:00
Code Issues Packages Projects Releases Wiki Activity

Merge pull request #1611 from NoRedInk/tessa/accordion-styling-warnings

Browse Source 
Adds accordion demo link
This commit is contained in:
Tessa 2024-02-01 14:46:35 -07:00 committed by GitHub
commit 460ec3ada1
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
1 changed files with 15 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

17
component-catalog/src/Examples/Accordion.elm
View File

@ -10,7 +10,7 @@ module Examples.Accordion exposing
-}
import Accessibility.Styled as Html exposing (Html)
import Accessibility.Styled as Html exposing (..)
import Browser.Dom as Dom
import Category exposing (Category(..))
import Code
@ -24,6 +24,7 @@ import Example exposing (Example)
import Html.Styled.Attributes as Attributes exposing (css, src)
import KeyboardSupport exposing (Key(..))
import Nri.Ui.Accordion.V4 as Accordion exposing (AccordionEntry(..))
import Nri.Ui.ClickableText.V4 as ClickableText
import Nri.Ui.Colors.Extra as ColorsExtra
import Nri.Ui.Colors.V1 as Colors
import Nri.Ui.FocusRing.V1 as FocusRing
@ -69,7 +70,19 @@ example =
, Text.caption [ Text.plaintext "Accordion content." ]
]
]
, about = []
, about =
[ ul [ css [ paddingLeft (px 16), margin zero ] ]
[ li [] [ text "The Accordion component is designed to be used when you have either a list or a tree of expandables. It may also be used when there's only one expandable. " ]
, li []
[ text "Devs should watch the entirety of "
, ClickableText.link "Tessa's Accordion demo"
[ ClickableText.linkExternal "https://noredink.zoom.us/rec/play/kLjOvS0PX5y-YYas6VmtUf5eEb1ViqNKKB-01gCELXG5tMjINEdop6dXrmfCyfC1A3Xj9kTUK8eIDe0.LO5NQR0X3udwz13x?canPlayFromShare=true&from=share_recording_detail&startTime=1681398154000&componentName=rec-play&originRequestUrl=https%3A%2F%2Fnoredink.zoom.us%2Frec%2Fshare%2F6R2Tk0FkzAYJ-44Q4Qs2Dx2RPR1GCXOCcaQsEai6vbtkO8oo9Ke8-_goIVwPDn9I.VVXdtb2PlpuTEqGs%3FstartTime%3D1681398154000"
, ClickableText.appearsInline
]
, text " before using. Discussion of how to attach styles correctly begins at 5:10."
]
]
]
, view = view
, categories = [ Layout ]
, keyboardSupport =