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

add missing button example headings

Browse Source
This commit is contained in:
charbelrami 2023-09-11 18:17:59 -03:00
parent f3c6aed490
commit 923f104ea6
1 changed files with 46 additions and 17 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

63
component-catalog/src/Examples/Button.elm
View File

@ -313,15 +313,28 @@ viewButtonExamples ellieLinkConfig state =
}
, Heading.h2
[ Heading.plaintext "Interactive example"
, Heading.css [ Css.margin2 Spacing.verticalSpacerPx Css.zero ]
, Heading.css
[ Css.margin2 Spacing.verticalSpacerPx Css.zero
, Css.marginBottom (Css.px 10)
]
]
, viewCustomizableExample model
, Heading.h2
[ Heading.plaintext "Non-interactive examples"
, Heading.css [ Css.marginTop Spacing.verticalSpacerPx ]
, Heading.css
[ Css.marginTop Spacing.verticalSpacerPx
, Css.marginBottom (Css.px 10)
]
]
, buttonsTable
, toggleButtons state.pressedToggleButtons
, Heading.h2
[ Heading.plaintext "Link with tracking"
, Heading.css
[ Css.marginTop Spacing.verticalSpacerPx
, Css.marginBottom (Css.px 10)
]
]
, Button.link "linkExternalWithTracking"
[ Button.unboundedWidth
, Button.secondary
@ -330,28 +343,41 @@ viewButtonExamples ellieLinkConfig state =
, track = ShowItWorked "ButtonExample" "linkExternalWithTracking clicked"
}
]
, Heading.h2
[ Heading.plaintext "Disabled form submit button"
, Heading.css
[ Css.marginTop Spacing.verticalSpacerPx
, Css.marginBottom (Css.px 10)
]
]
, form
[ css [ Css.marginTop Spacing.verticalSpacerPx ] ]
[]
[ Button.button "Submit"
[ Button.submit
, Button.disabled
]
]
, div [ css [ Css.marginTop Spacing.verticalSpacerPx ] ]
[ Tooltip.view
{ trigger =
\attrs ->
Button.button "Disabled with tooltip"
[ Button.disabled
, Button.custom (Aria.describedBy [ tooltipId ] :: attrs)
]
, id = tooltipId
}
[ Tooltip.open True
, Tooltip.paragraph "The quick brown fox jumps over the lazy dog."
, Tooltip.onRight
, Heading.h2
[ Heading.plaintext "Disabled button with tooltip"
, Heading.css
[ Css.marginTop Spacing.verticalSpacerPx
, Css.marginBottom (Css.px 10)
]
]
, Tooltip.view
{ trigger =
\attrs ->
Button.button "Save"
[ Button.disabled
, Button.custom (Aria.describedBy [ tooltipId ] :: attrs)
]
, id = tooltipId
}
[ Tooltip.open True
, Tooltip.paragraph "Reasons why you can't save"
, Tooltip.onRight
, Tooltip.fitToContent
]
]
|> div []
@ -450,7 +476,10 @@ toggleButtons pressedToggleButtons =
div []
[ Heading.h2
[ Heading.plaintext "Button toggle"
, Heading.css [ Css.marginTop Spacing.verticalSpacerPx ]
, Heading.css
[ Css.marginTop Spacing.verticalSpacerPx
, Css.marginBottom (Css.px 10)
]
]
, div [ css [ Css.displayFlex, Css.marginBottom (Css.px 20) ] ]
[ Button.button "5"