Doggo Storybook 0.9.0

Button Link

Renders a link (<a>) that has the style of a button.

Read more Read less

Use this component when you need to style a link to a different page or a specific section within the same page as a button.

To perform an action on the same page, including toggles and revealing/hiding elements, you should always use a real button instead. See button/1, toggle_button/1, and disclosure_button/1.

Usage

<.button_link patch={~p"/confirm"}>
  Confirm
</.button_link>

<.button_link navigate={~p”/registration”}> Registration </.button_link>

Default Open in playground
click me 
<.button_link>
  click me
</.button_link>
Disabled Open in playground
click me 
<.button_link disabled>
  click me
</.button_link>
Variant Open in playground
primary secondary info success warning danger 
<.button_link variant="primary">
  primary
</.button_link>
<.button_link variant="secondary">
  secondary
</.button_link>
<.button_link variant="info">
  info
</.button_link>
<.button_link variant="success">
  success
</.button_link>
<.button_link variant="warning">
  warning
</.button_link>
<.button_link variant="danger">
  danger
</.button_link>
Size Open in playground
small normal medium large 
<.button_link size="small">
  small
</.button_link>
<.button_link size="normal">
  normal
</.button_link>
<.button_link size="medium">
  medium
</.button_link>
<.button_link size="large">
  large
</.button_link>
Fill Open in playground
solid outline text 
<.button_link fill="solid">
  solid
</.button_link>
<.button_link fill="outline">
  outline
</.button_link>
<.button_link fill="text">
  text
</.button_link>
Shape Open in playground
nil circle pill 
<.button_link shape={nil}>
  nil
</.button_link>
<.button_link shape="circle">
  circle
</.button_link>
<.button_link shape="pill">
  pill
</.button_link>