Skip to content

Action link

<ns-action-link>

Overview

Action links are decorative links used to navigate to another page or perform an action.

✨ This is an auto-generated AI summary of the ns-action-link's documentation. It may not be accurate. ✨

Examples

Guidance

Standard

Labelled diagram of ns-action-link

Key

KeyField typeGuidelines
ALabelKeep the text short, relevant, and actionable. It should not exceed 24 characters.
BDecorationUse to support and highlight the label. See illustrations.

Implementation

Placement

The ns-action-link component can only be used as a child of the <ns-column> element.

Specification

Attributes

href
Property
href
Description
The link to another page or section in the same page.
Type
string
Default
label
Property
label
Description
The text to display and needs to be related to the link.
Type
string
Default
decoration
Property
decoration
Description
The decorative illustration to provide visual aid to the link.
Type
string
Options
Refer to our illustrations.
Default
type
Property
type
Description
The type of action link.
Type
string
Options
standard stacked
Default
standard

Specification notes

<ns-action-link> can be wrapped within an <a> tag. If so, href attribute in <ns-action-link> can be omitted.

<a href="#!">
<ns-action-link label="Boilers from £185" decoration="boiler"></ns-action-link>
</a>

Last updated: