Framework Component Library

Event Actions 

<!-- Event Actions -->
<section class="event-actions" id="event-actions-1" aria-labelledby="event-actions-1__title">
    <div class="fw-container">
        <div class="event-actions__inner">
            <div class="event-actions__header">
                <h2 class="event-actions__title" id="event-actions-1__title">
                    Event Actions
                </h2>
            </div>
            <div class="event-actions__body">
                <ul class="event-actions__list" aria-labelledby="event-actions-1__title">
                    <li class="event-actions__item">

                        <a class="button-filled
 		 			button-filled--large
 				" href="#">
                            <span class="button-filled__inner"> <span class="button-filled__label">Register</span>
                            </span>
                        </a>
                    </li>
                    <li class="event-actions__item">

                        <a class="button-filled
 		 			button-filled--large
 				" href="#">
                            <span class="button-filled__inner"> <span class="button-filled__label">Tickets</span>
                            </span>
                        </a>
                    </li>
                    <li class="event-actions__item">

                        <a class="button-filled
 		 			button-filled--large
 				" href="#">
                            <span class="button-filled__inner"> <span class="button-filled__label">Add to Calendar</span>
                            </span>
                        </a>
                    </li>
                    <li class="event-actions__item">

                        <a class="button-filled
 		 			button-filled--large
 				" href="#">
                            <span class="button-filled__inner"> <span class="button-filled__label">Add to Google</span>
                            </span>
                        </a>
                    </li>
                </ul>
            </div>
        </div>
    </div>
</section>
<!-- END: Event Actions -->
 
{#
	{% include '@component-event-actions' with {
		items: [
			{
				title: 'Action Title',
				url: '#'
			}
		]
	} %}
#}

{% set id = uniqid('event-actions') %}
{% set heading_level = heading_level ?? 2 %}
{% set heading_tag = 'h' ~ (heading_level) %}

<!-- Event Actions -->
<section
	class="event-actions"
	id="{{ id }}"
	aria-labelledby="{{ id ~ '__title' }}"
>
	<div class="fw-container">
		<div class="event-actions__inner">
			<div class="event-actions__header">
				<{{ heading_tag }} class="event-actions__title" id="{{ id ~ '__title' }}">
					Event Actions
				</{{ heading_tag }}>
			</div>
			<div class="event-actions__body">
				<ul class="event-actions__list" aria-labelledby="{{ id ~ '__title' }}">
					{% for item in items %}
						<li class="event-actions__item">
							{% include '@partial-link' with {
								classes: {
									base: 'button-filled',
									modifiers: [
										'large'
									]
								},
								title: item.title,
								url: item.url
							} only %}
						</li>
					{% endfor %}
				</ul>
			</div>
		</div>
	</div>
</section>
<!-- END: Event Actions -->

No notes defined.