Link

<a class="
 				" href="#">
    <span class="__inner"> <span class="__label"></span>
    </span>
</a>
{#
	{% include '@partial-link' with {
		classes: {
			base: 'base_class',
			modifiers: [],
			utility: ''
		},
		attributes: {'attribute': 'value'},
		title: 'Button Text',
		url: '#',
		icon: '',
		nowrap: false
	} only %}
#}

{% set separator = '__' in classes.base ? '-' : '__' %}

<a
	class="
		{{- classes.base }}
 		{% for modifier in classes.modifiers %}
 			{{ classes.base ~ '--' ~ modifier }}
 		{% endfor %}
		{{ classes.utility -}}
	"
	{% if id %}
		id="{{ id }}"
	{% endif %}
	{% for attribute, value in attributes %}
		{{ attribute }}="{{ value }}"
	{% endfor %}
	{% if attributes.target == '_blank' %}
		rel="{{ attributes.rel|default('noopener') }}"
		title="{{ attributes.title|default('opens in a new window') }}"
	{% endif %}
	href="{{ url ?: '#' }}">
	<span class="{{ classes.base ~ separator ~ 'inner' }}">
		{% if nowrap %}
			{% spaceless %}
				<span class="{{ classes.base ~ separator ~ 'label' }}">
					{{- title -}}
				</span>
				<span
					class="{{ classes.base ~ separator ~ 'icon' }} icon-nowrap"
					aria-hidden="true"
				>
					{{- '&#xfeff;' ~ icon(icon) -}}
				</span>
			{% endspaceless %}
		{% else %}
			<span class="{{ classes.base ~ separator ~ 'label' }}">
				{{- title -}}
			</span>
			{% if icon %}
				<span
					class="{{ classes.base ~ separator ~ 'icon' }}"
					aria-hidden="true"
				>
					{{ icon(icon) }}
				</span>
			{% endif %}
		{% endif %}
	</span>
</a>

No notes defined.