ButtonA

Button-styled navigation links

ButtonA

A component that renders navigation links with button styling. Useful for call-to-action links in documentation.

Usage

Use the ::ButtonA MDC syntax with a to or href attribute:

::ButtonA{to="/docs/getting-started"}
Get Started
::

Get Started

For internal pages, use the to attribute:

::ButtonA{to="/docs/installation"}
Installation Guide
::

For external URLs, use the href attribute:

::ButtonA{href="https://github.com/org/repo" target="_blank"}
View on GitHub
::

With Icons

You can include icons in the button text:

::ButtonA{to="/docs/components"}
Browse Components →
::

Browse Components →

Props

The component accepts all NuxtLink props:

PropTypeDefaultDescription
tostring | RouteLocation-Internal route destination
hrefstring-External URL
targetstring-Link target (_blank, etc.)
externalboolean-Force external link behavior

Slots

SlotDescription
defaultButton text content

Styling

The component:

  • Uses the small (sm) button size variant
  • Applies top margin (mt-6) for spacing
  • Removes underline decoration
  • Inherits all shadcn-vue Button styling