Framework Component Library

Testimonial 

<!-- Testimonial -->
<div class="testimonial" id="testimonial-1">
    <div class="fw-container">
        <div class="testimonial__inner">
            <figure class="testimonial__figure">
                <blockquote class="testimonial__quote">
                    <span class="testimonial__quote-mark testimonial__quote-mark--open">&ldquo;</span>
                    <p>Lorem ipsum dolor sit amet, <strong>consectetur adipiscing elit</strong>. Praesent eget est sed ex pretium fringilla. Vivamus <em>ac turpis quis eros consectetur</em> ornare. Proin pulvinar, magna id vulputate commodo, metus massa tincidunt lorem, <a href="#">non elementum urna dui sed</a> neque. Nulla non ipsum fermentum, fermentum tellus ut, viverra est. Interdum et malesuada fames ac ant faucibus&rdquo;.</p>
                </blockquote>
                <figcaption class="testimonial__figcaption">
                    <span class="testimonial__media">

                        <img class="testimonial__image" srcset="https://images.fastspot.com/framework/300x300/1 300w, https://images.fastspot.com/framework/100x100/1 100w" src="https://images.fastspot.com/framework/100x100/1" alt="" loading="lazy" width="100" height="100">
                    </span>
                    <span class="testimonial__info">
                        <cite class="testimonial__quote-name">Zak Cooper</cite> <span class="testimonial__quote-title">Senior Director of Department</span>
                    </span>
                </figcaption>
            </figure>
        </div>
    </div>
</div>
<!-- END: Testimonial -->
 
{#
	{% include '@component-testimonial' with {
		quote: '"Quote"',
		name: 'Name',
		job_title: 'Job Title',
		image: '1',
		alt: ''
	} %}
#}

{% set id = uniqid('testimonial') %}

<!-- Testimonial -->
<div class="testimonial" id="{{ id }}">
	<div class="fw-container">
		<div class="testimonial__inner">
			<figure class="testimonial__figure">
				<blockquote class="testimonial__quote">
					<span class="testimonial__quote-mark testimonial__quote-mark--open">&ldquo;</span>
					<p>{{ quote }}</p>
				</blockquote>
				<figcaption class="testimonial__figcaption">
					{% if image %}
						<span class="testimonial__media">
							{% include '@partial-image' with {
								class: 'testimonial__image',
								image: image,
								alt: alt,
								loading: 'lazy',
								crop: 'square',
								max: 'xxsml'
							} only %}
						</span>
					{% endif %}
					<span class="testimonial__info">
						<cite class="testimonial__quote-name">
							{{- name -}}
						</cite>
						{% if job_title %}
							<span class="testimonial__quote-title">
								{{- job_title -}}
							</span>
						{% endif %}
					</span>
				</figcaption>
			</figure>
		</div>
	</div>
</div>
<!-- END: Testimonial -->

No notes defined.