Partial Component
Icon
The Icon partial renders SVG icons from the project's icon library. Icons are mostly from https://feathericons.com/. Icons can be standalone or wrapped in links.
Manifest
{
"name": "icon",
"type": "_partials",
"styles": ["icon.css"],
"scripts": [],
"requires": []
}
Configuration
icon:
icon: 'feather'
url: ''
title: 'Feather Icon'
or
icon: 'feather'
Configuration Options
| Property | Type | Required | Description |
|---|---|---|---|
icon | string | Yes | Icon name (matches filename in icons/) |
url | string | No | Link URL for clickable icons |
title | string | No | Title/alt text for accessibility |
Example
Usage in Templates
{% from "components/_partials/icon/icon.njk" import icon %}
{# Standalone icon #}
{{ icon('feather') }}
{# Linked icon #}
{{ icon({
icon: 'external-link',
url: 'https://example.com',
title: 'Visit Example'
}) }}
Features
- Uses SVG icons from
/lib/layouts/icons/ - Optional linking
- ARIA labels for linked external icons
- External links get
rel="noopener noreferrer"