When you want to draw someone's attention to a link without putting it in a callout, buttons are an elegant way to do that.
Button breakdown
Buttons are created with the <Button> component.
<Button role="button" to="Button URL" variant="primary"> Click me!</Button>;The component has three props:
Field | Description |
|---|---|
| The function of the component. Use the value |
| The button's URL. |
| The style of the button. Use the value For an alternative button style, use |
Button variations
If you need it, you can put two or more buttons in a row with the <ButtonGroup> and <ButtonLink> components. Simply include additional ButtonLink components within ButtonGroup.
The source for those buttons looks like this:
<ButtonGroup> <ButtonLink role="button" to="https://docs.newrelic.com" variant="primary"> Button one </ButtonLink>
<ButtonLink role="button" to="https://docs.newrelic.com" variant="primary"> Button two </ButtonLink>
<ButtonLink role="button" to="https://docs.newrelic.com" variant="secondary"> Secondary button </ButtonLink></ButtonGroup>;