Stats

<div class="stats component_has_radius">
    <div class="stats_wrap">
        <div class="fs-row fs-xl-justify-center">
            <div class="fs-cell">
                <header class="stats_header">
                    <h2 class="stats_title">
                        We don't aim to be a good school, but a great one.
                    </h2>

                    <div class="stats_desc">
                        A description for this section. Hilbert strives to cultivate a community that respects and appreciates the dignity and uniqueness of all.
                    </div>
                </header>

                <div class="stats_content">
                    <div class="js-carousel-embla embla__overlay-controls" data-carousel-embla='{"loop":false,"slidesToScroll":1,"breakpoints":{"(min-width: 87.125rem)":{"active":false}}}'>
                        <div class="embla">
                            <div id="stats-viewport-1" class="embla__viewport" data-js="viewport">
                                <ul class="embla__container" data-js="container">
                                    <li class="embla__slide">
                                        <div class="stats_grid_item">
                                            <div class="stats_item">
                                                <h3 class="stats_item_stat">
                                                    #1
                                                </h3>

                                                <div class="stats_item_desc">
                                                    Undergraduate Forensic Science School in the nation
                                                </div>

                                                <div class="stats_source_wrap">
                                                    <a href="https://plexuss.com" class="stats_link">
                                                        plexuss
                                                    </a>
                                                </div>
                                            </div>
                                        </div>
                                    </li>
                                    <li class="embla__slide">
                                        <div class="stats_grid_item">
                                            <div class="stats_item">
                                                <h3 class="stats_item_stat">
                                                    #10
                                                </h3>

                                                <div class="stats_item_desc">
                                                    Among Regional Colleges in the North for top performers in social mobility
                                                </div>

                                                <div class="stats_source_wrap">
                                                    <a href="https://duckduckgo.com" class="stats_link">
                                                        U.S. News & World Report
                                                    </a>
                                                </div>
                                            </div>
                                        </div>
                                    </li>
                                    <li class="embla__slide">
                                        <div class="stats_grid_item">
                                            <div class="stats_item">
                                                <h3 class="stats_item_stat">
                                                    #8
                                                </h3>

                                                <div class="stats_item_desc">
                                                    Undergraduate Cybersecurity School in the Nation
                                                </div>

                                                <div class="stats_source_wrap">
                                                    <a href="https://duckduckgo.com" class="stats_link">
                                                        plexuss
                                                    </a>
                                                </div>
                                            </div>
                                        </div>
                                    </li>
                                    <li class="embla__slide">
                                        <div class="stats_grid_item">
                                            <div class="stats_item">
                                                <h3 class="stats_item_stat">
                                                    #12
                                                </h3>

                                                <div class="stats_item_desc">
                                                    Best College Campuses in New York
                                                </div>

                                            </div>
                                        </div>
                                    </li>
                                </ul>
                            </div>
                        </div>
                    </div>
                </div>

                <div class="stats_ctas_wrap">
                    <div class="stats_ctas">
                        <div class="stats_ctas_item">

                            <a href="#" class="btn_link theme_gold">
                                <span class="btn_link_inner">
                                    <span class="btn_link_label">Admissions</span>
                                    <span class="btn_link_icon" aria-hidden="true">
                                        <svg class="icon icon_arrow_right">
                                            <use href="/images/icons.svg#arrow_right" />
                                        </svg>
                                    </span>
                                </span>
                            </a>
                        </div>
                        <div class="stats_ctas_item">

                            <a href="#" class="btn_link theme_gold">
                                <span class="btn_link_inner">
                                    <span class="btn_link_label">Financial Aid</span>
                                    <span class="btn_link_icon" aria-hidden="true">
                                        <svg class="icon icon_arrow_right">
                                            <use href="/images/icons.svg#arrow_right" />
                                        </svg>
                                    </span>
                                </span>
                            </a>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
{% set uuid_viewport = uniqid("stats-viewport") %}
{% set carousel_json = {
	loop: false,
	slidesToScroll: 1,
	breakpoints: {
		'(min-width: 87.125rem)': {
			active: false
		}
	}
}|json_encode %}

<div class="stats component_has_radius">
	<div class="stats_wrap">
		<div class="fs-row fs-xl-justify-center">
			<div class="fs-cell">
				{% if title or description %}
					<header class="stats_header">
						<h2 class="stats_title">
							{{ title }}
						</h2>

						{% if description %}
							<div class="stats_desc">
								{{ description }}
							</div>
						{% endif %}
					</header>
				{% endif %}

				<div class="stats_content">
					<div class="js-carousel-embla embla__overlay-controls" data-carousel-embla='{{ carousel_json }}'>
						<div class="embla">
							<div id="{{ uuid_viewport }}" class="embla__viewport" data-js="viewport">
								<ul class="embla__container" data-js="container">
									{% for item in items %}
										<li class="embla__slide">
											<div class="stats_grid_item">
												<div class="stats_item">
													<h3 class="stats_item_stat">
														{{ item.stat }}
													</h3>

													<div class="stats_item_desc">
														{{ item.description }}
													</div>

													{% if item.source %}
														<div class="stats_source_wrap">
															<a href="{{ item.source.url }}" class="stats_link">
																{{ item.source.title }}
															</a>
														</div>
													{% endif %}
												</div>
											</div>
										</li>
									{% endfor %}
								</ul>
							</div>
						</div>
					</div>
				</div>

				{% if ctas|length %}
					<div class="stats_ctas_wrap">
						<div class="stats_ctas">
							{% for item in ctas %}
								<div class="stats_ctas_item">
									{% include '@partial-link' with {
											title: item.title,
											url: item.url,
											target: '',
											class: 'btn',
											theme: 'gold',
											js: false,
											icon: 'arrow_right',
											aria: '',
											nowrap: false
										} %}
								</div>
							{% endfor %}
						</div>
					</div>
				{% endif %}
			</div>
		</div>
	</div>
</div>

No notes defined.