Citizen University Component Library

Testimonial: Light Gray 

<!-- Testimonial -->
<div class="testimonial theme_light_gray" data-anim="any-threshold" data-anim-type="fade-up">
    <div class="fs-row">
        <div class="fs-cell">
            <div class="testimonial_inner">
                <div class="testimonial_bg">

                    <svg class="icon icon_wave">
                        <use href="/images/icons.svg#wave" />
                    </svg>

                </div>

                <figure class="testimonial_figure">
                    <div class="testimonial_figure_inner">
                        <div class="testimonial_media">
                            <span class="lazy_image_wrapper testimonial_image_wrapper">
                                <img class="js-lazy js-lazyload testimonial_image" data-sizes="auto" src="//images.fastspot.com/citizen-university/100x100/1" data-src="//images.fastspot.com/citizen-university/300x300/1" data-srcset="//images.fastspot.com/citizen-university/300x300/1 300w, //images.fastspot.com/citizen-university/100x100/1 100w" alt="">
                            </span>
                            <noscript>
                                <img class="testimonial_image" src="https://images.fastspot.com/citizen-university/100x100/1" srcset="https://images.fastspot.com/citizen-university/100x100/1 100w, https://images.fastspot.com/citizen-university/300x300/1 300w" sizes="100vw" alt="">
                            </noscript>
                        </div>

                        <div class="testimonial_quote_wrap">
                            <blockquote class="testimonial_quote">
                                <p>The image of ‘we’ as a democracy will never be complete without each one of us seeing ourselves as part of the <a href="#">final picture</a>.</p>
                            </blockquote>
                        </div>
                    </div>

                    <figcaption class="testimonial_figcaption">
                        <span class="testimonial_info">
                            <span class="testimonial_quote_name">Martha Flores</span>
                            <span class="testimonial_quote_title">Project Manager, Miami FL</span>
                        </span>
                    </figcaption>
                </figure>
            </div>
        </div>
    </div>
</div>
<!-- END: Testimonial -->
 
<!-- Testimonial -->
<div class="testimonial theme_{{ theme }}" data-anim="any-threshold" data-anim-type="fade-up">
	<div class="fs-row">
		<div class="fs-cell">
			<div class="testimonial_inner">
				<div class="testimonial_bg">
					{{ icon("wave") }}
				</div>

				<figure class="testimonial_figure">
					<div class="testimonial_figure_inner">
						{% if image %}
							<div class="testimonial_media">
								{% include "@partial-image" with {
									class: "testimonial",
									alt: "",
									image: image,
									sources: [
										img.square.xxsml,
										img.square.thumb
									]
								} %}
							</div>
						{% endif %}

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

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

No notes defined.