<!-- Event Card -->
<div class="card card_event card_type_contained">
    <div class="card_inner card_event_inner">
        <div class="card_event_grid">
            <div class="card_event_group">
                <div class="card_event_header">
                    <h3 class="card_event_title">
                        <a class="card_event_title_link" href="#">Name of an Upcoming Admission Q&A Session</a>
                    </h3>
                    <time class="card_event_date" datetime="2023-02-12 16:00:00">
                        <span class="card_event_date_label">
                            February 12, 2023
                        </span>
                    </time>
                </div>
                <p class="card_event_time">Time: 4-5 pm UTC</p>
            </div>
            <figure class="card_event_figure">
                <a class="card_event_figure_link" href="#" aria-label="Read more about Name of an Upcoming Admission Q&A Session" tabindex="-1">

                    <img class="card_event_image" srcset="https://images.fastspot.com/jhusoe/980x654/1 980w, https://images.fastspot.com/jhusoe/740x494/1 740w, https://images.fastspot.com/jhusoe/500x334/1 500w, https://images.fastspot.com/jhusoe/300x200/1 300w" sizes="(min-width: 1394px) 290px, (min-width: 1220px) 265px, (min-width: 980px) 250px, (min-width: 600px) 332px, 90vw" src="https://images.fastspot.com/jhusoe/300x200/1" alt="" loading="lazy" width="300" height="200">
                </a>
            </figure>
        </div>
    </div>
</div>
<!-- END: Event Card -->
{#
	{% include '@partial-event-card' with {
		item: {
			type: 'default',
			image: '1',
			alt: 'alt',
			title: 'Title',
			url: '#',
			date: {
				same_day: true,
				all_day: false,
				from: '2023-05-31 17:00:00',
				to: '2023-05-31 19:00:00'
			}
		}
	} %}
#}

<!-- Event Card -->
<div class="card card_event card_type_{{ item.type ?: 'default' }}">
	<div class="card_inner card_event_inner">
		<div class="card_event_grid">
			<div class="card_event_group">
				<div class="card_event_header">
				{% if group_title %}
					<h2 class="card_event_title">
						<a class="card_event_title_link" href="{{ item.url }}">{{ item.title }}</a>
					</h2>
				{% else %}
					<h3 class="card_event_title">
						<a class="card_event_title_link" href="{{ item.url }}">{{ item.title }}</a>
					</h3>
				{% endif %}
					<time class="card_event_date" datetime="{{ item.date.from }}">
						<span class="card_event_date_label">
							{% if item.date.same_day == false %}
								{{ item.date.from|date('F d') }}-{{ item.date.to|date('d, Y') }}
							{% else %}
								{{ item.date.from|date('F d, Y') }}
							{% endif %}
						</span>
					</time>
				</div>
				{% if item.date.all_day == false %}
					<p class="card_event_time">Time: {{ item.date.from|date('g') }}-{{ item.date.to|date('g a T') }}</p>
				{% endif %}
			</div>
			{% if item.image %}
				<figure class="card_event_figure">
					<a class="card_event_figure_link" href="{{ item.url }}" aria-label="Read more about {{ item.title }}" tabindex="-1">
						{% include '@partial-image' with {
							class: 'card_event',
							alt: item.alt,
							image: item.image,
							loading: 'lazy',
							sources: [
								img.classic.med,
								img.classic.sml,
								img.classic.xsml,
								img.classic.xxsml
							],
							sizes: [
								'(min-width: 1394px) 290px',
								'(min-width: 1220px) 265px',
								'(min-width: 980px) 250px',
								'(min-width: 600px) 332px',
								'90vw'
							]
						} %}
					</a>
				</figure>
			{% endif %}
		</div>
	</div>
</div>
<!-- END: Event Card -->

No notes defined.