CGCC Component Library

Testimonial 

<!-- Testimonial -->
<div class="testimonial">
    <div class="fs-row">
        <div class="fs-cell fs-xl-10 fs-xl-justify-center">
            <div class="testimonial_inner">
                <div class="testimonial_inner_item is_media">
                    <figure class="testimonial_figure">

                        <img class="testimonial_image" srcset="https://images.fastspot.com/columbia-gorge-community-college/740x740/3 740w, https://images.fastspot.com/columbia-gorge-community-college/500x500/3 500w" src="https://images.fastspot.com/columbia-gorge-community-college/500x500/3" alt="" loading="lazy" width="500" height="500">
                    </figure>
                </div>

                <div class="testimonial_inner_item is_content">
                    <div class="testimonial_quote_banner">
                        <div class="testimonial_quote_banner_icon">

                            <svg class="icon icon_quote_purple">
                                <use href="/images/icons.svg#quote_purple" />
                            </svg>

                        </div>
                    </div>

                    <blockquote class="testimonial_quote">
                        <p>More students are returning to Columbia Gorge Community College, working hard to complete their education in spite of the pandemic.</p>
                    </blockquote>

                    <div class="testimonial_info">
                        <span class="testimonial_quote_name">Full Name</span>
                        <span class="testimonial_quote_title">Senior Director of Department</span>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
<!-- END: Testimonial -->
 
{#
	{% include '@component-testimonial' with {
		quote: '"Quote"',
		name: 'Name',
		title: 'Title',
		image: '1'
	} %}
#}

<!-- Testimonial -->
<div class="testimonial">
	<div class="fs-row">
		<div class="fs-cell fs-xl-10 fs-xl-justify-center">
			<div class="testimonial_inner">
				{% if image %}
					<div class="testimonial_inner_item is_media">
						<figure class="testimonial_figure">
							{% include '@partial-image' with {
									class: 'testimonial',
									alt: '',
									image: image,
									loading: 'lazy',
									sources: [
										img.square.sml,
										img.square.xsml
									]
								} %}
						</figure>
					</div>
				{% endif %}

				<div class="testimonial_inner_item is_content">
					<div class="testimonial_quote_banner">
						<div class="testimonial_quote_banner_icon">
							{{ icon("quote_purple") }}
						</div>
					</div>

					<blockquote class="testimonial_quote">
						<p>{{ quote }}</p>
					</blockquote>

					{% if name or title %}
						<div class="testimonial_info">
							<span class="testimonial_quote_name">{{ name }}</span>
							{% if title %}
								<span class="testimonial_quote_title">{{ title }}</span>
							{% endif %}
						</div>
					{% endif %}
				</div>
			</div>
		</div>
	</div>
</div>
<!-- END: Testimonial -->

No notes defined.