1.7 KiB
title, icon, badges
title | icon | badges | |||||||||||||||||||
---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|
Button Link | lucide:external-link |
|
Usage
::stack ::div{class="p-3 flex gap-4"} ::button-link{right-icon="lucide:arrow-up-right" to="/getting-started" target="_blank"} Get Started :: ::button-link{left-icon="lucide:github" variant="outline" to="https://github.com/ZTL-UwU/shadcn-docs-nuxt" target="_blank"} GitHub :: ::button-link{left-icon="lucide:ghost" variant="ghost" href="https://github.com/ZTL-UwU/shadcn-docs-nuxt" blank} Ghost :: ::
::button-link{right-icon="lucide:arrow-up-right" to="/getting-started" target="_blank"}
Get Started
::
::button-link{left-icon="lucide:github" variant="outline" to="https://github.com/ZTL-UwU/shadcn-docs-nuxt" target="_blank"}
GitHub
::
::button-link{left-icon="lucide:ghost" variant="ghost" href="https://github.com/ZTL-UwU/shadcn-docs-nuxt" blank}
Ghost
::
::
Props
::field-group
:field{name="variant" type="'default' | 'secondary' | 'link' | 'destructive' | 'outline' | 'ghost'" default-value="'default'"}
:field{name="size" type="'default' | 'icon' | 'sm' | 'xs' | 'lg'" default-value="'default'"}
:field{name="leftIcon" type="string"}[Icon on the left]
:field{name="rightIcon" type="string"}[Icon on the right]
:field{name="to" type="string"}[Link URL]
:field{name="href" type="string"}[Alias to to
]
:field{name="target" type="Target"}[A target
attribute value to apply on the link]
:field{name="blank" type="boolean"}[Alias to target='_blank'
]
::