<!-- News & Events -->
<div class="updates">
<div class="updates_header">
<div class="fs-row">
<div class="fs-cell">
<div class="updates_header_inner">
<h2 class="updates_title">News & Events</h2>
</div>
</div>
</div>
</div>
<div class="updates_body">
<div class="fs-row">
<div class="fs-cell">
<div class="updates_body_inner">
<div class="updates_grid">
<div class="updates_featured">
<div class="updates_featured_item updates_featured_event">
<div class="updates_featured_media">
<figure class="updates_featured_item_figure">
<a class="updates_featured_item_figure_link" href="#" aria-label="Read more about Blending Art and Advocacy: A conversation with award-winning actress Mikayla Bartholomew" tabindex="-1">
<picture class="updates_featured_item_picture">
<source media="(min-width: 1220px)" srcset="https://images.fastspot.com/vcuarts/1440x960/1" width="1440" height="960">
<source media="(min-width: 980px)" srcset="https://images.fastspot.com/vcuarts/1220x814/1" width="1220" height="814">
<source media="(min-width: 740px)" srcset="https://images.fastspot.com/vcuarts/1220x686/1" width="1220" height="686">
<source media="(min-width: 500px)" srcset="https://images.fastspot.com/vcuarts/980x552/1" width="980" height="552">
<img class="updates_featured_item_image" src="//images.fastspot.com/vcuarts/740x416/1" alt="" loading="lazy" width="740" height="416">
</picture>
</a>
</figure>
<div class="updates_featured_item_calendar">
<span class="updates_featured_item_calendar_item">
<span class="updates_featured_item_calendar_month">Nov</span>
<span class="updates_featured_item_calendar_day">1</span>
</span>
<span class="updates_featured_item_calendar_separator"></span>
<span class="updates_featured_item_calendar_item">
<span class="updates_featured_item_calendar_month">Nov</span>
<span class="updates_featured_item_calendar_day">3</span>
</span>
</div>
</div>
<div class="updates_featured_item_wrapper">
<div class="updates_featured_item_header">
<h2 class="updates_featured_item_title">
<a href="#" class="updates_featured_item_title_link">
<span class="updates_featured_item_title_link_inner">
<span class="updates_featured_item_title_link_label">Blending Art and Advocacy: A conversation with award-winning actress Mikayla Bartholomew</span>
</span>
</a>
</h2>
<div class="updates_featured_item_meta">
<div class="updates_featured_item_categories">
<ul class="updates_featured_item_categories_list" aria-label="Categories">
<li class="updates_featured_item_categories_item">
<a class="updates_featured_item_categories_link" href="#">Event Category One</a>,
</li>
<li class="updates_featured_item_categories_item">
<a class="updates_featured_item_categories_link" href="#">Event Category Two</a>
</li>
</ul>
</div>
<div class="updates_featured_item_separator"></div>
<div class="updates_featured_item_organizer">
<span class="updates_featured_item_organizer_label">Organizer</span>
</div>
</div>
</div>
<div class="updates_featured_item_body">
<time class="updates_featured_item_date" datetime="2023-11-01 14:00:00">
<span class="updates_featured_item_date_start">Nov 1, 2023</span>
<span class="updates_featured_item_date_end"> - Nov 3, 2023</span>
@
<span class="updates_featured_item_date_time">2:00 PM - 3:00 PM</span>
</time>
<div class="updates_featured_item_location">
<span class="updates_featured_item_location_label">W. E. Singleton Center for the Performing Arts</span>
</div>
</div>
</div>
</div>
</div>
<div class="updates_events">
<div class="updates_events_body">
<div class="updates_events_item">
<div class="updates_events_item_media">
<figure class="updates_events_item_figure">
<a class="updates_events_item_figure_link" href="#" aria-label="Read more about Morgan Bassichis: More Little Ditties" tabindex="-1">
<img class="updates_events_item_image" srcset="https://images.fastspot.com/vcuarts/980x654/14 980w, https://images.fastspot.com/vcuarts/740x494/14 740w, https://images.fastspot.com/vcuarts/500x334/14 500w, https://images.fastspot.com/vcuarts/300x200/14 300w" sizes="25vw" src="https://images.fastspot.com/vcuarts/300x200/14" alt="" loading="lazy" width="300" height="200">
</a>
</figure>
<div class="updates_events_item_calendar">
<span class="updates_events_item_calendar_item">
<span class="updates_events_item_calendar_month">Nov</span>
<span class="updates_events_item_calendar_day">1</span>
</span>
<span class="updates_events_item_calendar_separator"></span>
<span class="updates_events_item_calendar_item">
<span class="updates_events_item_calendar_month">Nov</span>
<span class="updates_events_item_calendar_day">3</span>
</span>
</div>
</div>
<div class="updates_events_item_wrapper">
<div class="updates_events_item_header">
<h2 class="updates_events_item_title">
<a href="#" class="updates_events_item_title_link">
<span class="updates_events_item_title_link_inner">
<span class="updates_events_item_title_link_label">Morgan Bassichis: More Little Ditties</span>
</span>
</a>
</h2>
<div class="updates_events_item_meta">
<div class="updates_events_item_categories">
<ul class="updates_events_item_categories_list" aria-label="Categories">
<li class="updates_events_item_categories_item">
<a class="updates_events_item_categories_link" href="#">Event Category One</a>,
</li>
<li class="updates_events_item_categories_item">
<a class="updates_events_item_categories_link" href="#">Event Category Two</a>
</li>
</ul>
</div>
<div class="updates_events_item_separator"></div>
<div class="updates_events_item_organizer">
<span class="updates_events_item_organizer_label">Organizer</span>
</div>
</div>
</div>
<div class="updates_events_item_body">
<time class="updates_events_item_date" datetime="2023-11-01 14:00:00">
<span class="updates_events_item_date_start">Nov 1, 2023</span>
<span class="updates_events_item_date_end"> - Nov 3, 2023</span>
@
<span class="updates_events_item_date_time">2:00 PM - 3:00 PM</span>
</time>
<div class="updates_events_item_location">
<span class="updates_events_item_location_label">W. E. Singleton Center for the Performing Arts</span>
</div>
</div>
</div>
</div>
<div class="updates_events_item">
<div class="updates_events_item_media">
<figure class="updates_events_item_figure">
<a class="updates_events_item_figure_link" href="#" aria-label="Read more about Morgan Bassichis: More Little Ditties" tabindex="-1">
<img class="updates_events_item_image" srcset="https://images.fastspot.com/vcuarts/980x654/10 980w, https://images.fastspot.com/vcuarts/740x494/10 740w, https://images.fastspot.com/vcuarts/500x334/10 500w, https://images.fastspot.com/vcuarts/300x200/10 300w" sizes="25vw" src="https://images.fastspot.com/vcuarts/300x200/10" alt="" loading="lazy" width="300" height="200">
</a>
</figure>
<div class="updates_events_item_calendar">
<span class="updates_events_item_calendar_item">
<span class="updates_events_item_calendar_month">Oct</span>
<span class="updates_events_item_calendar_day">22</span>
</span>
</div>
</div>
<div class="updates_events_item_wrapper">
<div class="updates_events_item_header">
<h2 class="updates_events_item_title">
<a href="#" class="updates_events_item_title_link">
<span class="updates_events_item_title_link_inner">
<span class="updates_events_item_title_link_label">Morgan Bassichis: More Little Ditties</span>
</span>
</a>
</h2>
<div class="updates_events_item_meta">
<div class="updates_events_item_categories">
<ul class="updates_events_item_categories_list" aria-label="Categories">
<li class="updates_events_item_categories_item">
<a class="updates_events_item_categories_link" href="#">Event Category</a>
</li>
</ul>
</div>
<div class="updates_events_item_separator"></div>
<div class="updates_events_item_organizer">
<span class="updates_events_item_organizer_label">Organizer</span>
</div>
</div>
</div>
<div class="updates_events_item_body">
<time class="updates_events_item_date" datetime="2023-10-22 14:00:00">
<span class="updates_events_item_date_start">Oct 22, 2023</span>
@
<span class="updates_events_item_date_time">2:00 PM - 3:00 PM</span>
</time>
<div class="updates_events_item_location">
<span class="updates_events_item_location_label">W. E. Singleton Center for the Performing Arts</span>
</div>
</div>
</div>
</div>
</div>
<div class="updates_events_actions">
<div class="updates_events_action">
<a href="#" class="updates_events_action_link">
<span class="updates_events_action_link_inner">
<span class="updates_events_action_link_label">View All Events</span><span class="icon_nowrap updates_events_action_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 class="updates_news">
<div class="updates_news_body">
<div class="updates_news_item">
<div class="updates_news_media">
<figure class="updates_news_item_figure">
<a class="updates_news_item_figure_link" href="#" aria-label="Read more about CoStar Group announces $18M commitment to VCU for the construction of the CoStar Center for Arts and Innovation" tabindex="-1">
<img class="updates_news_item_image" srcset="https://images.fastspot.com/vcuarts/980x654/8 980w, https://images.fastspot.com/vcuarts/740x494/8 740w, https://images.fastspot.com/vcuarts/500x334/8 500w, https://images.fastspot.com/vcuarts/300x200/8 300w" sizes="(min-width: 980px) 20vw, 25vw" src="https://images.fastspot.com/vcuarts/300x200/8" alt="" loading="lazy" width="300" height="200">
</a>
</figure>
</div>
<div class="updates_news_item_wrapper">
<div class="updates_news_item_header">
<h2 class="updates_news_item_title">
<a href="#" class="updates_news_item_title_link">
<span class="updates_news_item_title_link_inner">
<span class="updates_news_item_title_link_label">CoStar Group announces $18M commitment to VCU for the construction of the CoStar Center for Arts and Innovation</span>
</span>
</a>
</h2>
<div class="updates_news_item_meta">
<div class="updates_news_item_categories">
<ul class="updates_news_item_categories_list" aria-label="Categories">
<li class="updates_news_item_categories_item">
<a class="updates_news_item_categories_link" href="#">News Category One</a>,
</li>
<li class="updates_news_item_categories_item">
<a class="updates_news_item_categories_link" href="#">News Category Two</a>
</li>
</ul>
</div>
<div class="updates_news_item_separator"></div>
<div class="updates_news_item_departments">
<ul class="updates_news_item_departments_list" aria-label="Departments">
<li class="updates_news_item_departments_item">
<a class="updates_news_item_departments_link" href="#">Department</a>
</li>
</ul>
</div>
</div>
</div>
<div class="updates_news_item_body">
<div class="updates_news_item_publish">
<span class="updates_news_item_publish_label">01/23/2023</span>
</div>
</div>
</div>
</div>
<div class="updates_news_item">
<div class="updates_news_media">
<figure class="updates_news_item_figure">
<a class="updates_news_item_figure_link" href="#" aria-label="Read more about Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus." tabindex="-1">
<img class="updates_news_item_image" srcset="https://images.fastspot.com/vcuarts/980x654/6 980w, https://images.fastspot.com/vcuarts/740x494/6 740w, https://images.fastspot.com/vcuarts/500x334/6 500w, https://images.fastspot.com/vcuarts/300x200/6 300w" sizes="(min-width: 980px) 20vw, 25vw" src="https://images.fastspot.com/vcuarts/300x200/6" alt="" loading="lazy" width="300" height="200">
</a>
</figure>
</div>
<div class="updates_news_item_wrapper">
<div class="updates_news_item_header">
<h2 class="updates_news_item_title">
<a href="#" class="updates_news_item_title_link">
<span class="updates_news_item_title_link_inner">
<span class="updates_news_item_title_link_label">Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus.</span>
</span>
</a>
</h2>
<div class="updates_news_item_meta">
<div class="updates_news_item_categories">
<ul class="updates_news_item_categories_list" aria-label="Categories">
<li class="updates_news_item_categories_item">
<a class="updates_news_item_categories_link" href="#">News Category One</a>
</li>
</ul>
</div>
<div class="updates_news_item_separator"></div>
<div class="updates_news_item_departments">
<ul class="updates_news_item_departments_list" aria-label="Departments">
<li class="updates_news_item_departments_item">
<a class="updates_news_item_departments_link" href="#">Department</a>
</li>
</ul>
</div>
</div>
</div>
<div class="updates_news_item_body">
<div class="updates_news_item_publish">
<span class="updates_news_item_publish_label">01/23/2023</span>
</div>
</div>
</div>
</div>
<div class="updates_news_item">
<div class="updates_news_media">
<figure class="updates_news_item_figure">
<a class="updates_news_item_figure_link" href="#" aria-label="Read more about CoStar Group announces $18M commitment to VCU for the construction of the CoStar Center for Arts and Innovation" tabindex="-1">
<img class="updates_news_item_image" srcset="https://images.fastspot.com/vcuarts/980x654/2 980w, https://images.fastspot.com/vcuarts/740x494/2 740w, https://images.fastspot.com/vcuarts/500x334/2 500w, https://images.fastspot.com/vcuarts/300x200/2 300w" sizes="(min-width: 980px) 20vw, 25vw" src="https://images.fastspot.com/vcuarts/300x200/2" alt="" loading="lazy" width="300" height="200">
</a>
</figure>
</div>
<div class="updates_news_item_wrapper">
<div class="updates_news_item_header">
<h2 class="updates_news_item_title">
<a href="#" class="updates_news_item_title_link">
<span class="updates_news_item_title_link_inner">
<span class="updates_news_item_title_link_label">CoStar Group announces $18M commitment to VCU for the construction of the CoStar Center for Arts and Innovation</span>
</span>
</a>
</h2>
<div class="updates_news_item_meta">
<div class="updates_news_item_categories">
<ul class="updates_news_item_categories_list" aria-label="Categories">
<li class="updates_news_item_categories_item">
<a class="updates_news_item_categories_link" href="#">News Category One</a>
</li>
</ul>
</div>
<div class="updates_news_item_separator"></div>
<div class="updates_news_item_departments">
<ul class="updates_news_item_departments_list" aria-label="Departments">
<li class="updates_news_item_departments_item">
<a class="updates_news_item_departments_link" href="#">Department</a>
</li>
</ul>
</div>
</div>
</div>
<div class="updates_news_item_body">
<div class="updates_news_item_publish">
<span class="updates_news_item_publish_label">01/23/2023</span>
</div>
</div>
</div>
</div>
</div>
<div class="updates_news_actions">
<div class="updates_news_action events">
<a href="#" class="updates_news_action_link">
<span class="updates_news_action_link_inner">
<span class="updates_news_action_link_label">View All Events</span><span class="icon_nowrap updates_news_action_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="updates_news_action news">
<a href="#" class="updates_news_action_link">
<span class="updates_news_action_link_inner">
<span class="updates_news_action_link_label">View All News</span><span class="icon_nowrap updates_news_action_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>
</div>
</div>
<!-- END: News & Events -->
{#
{% include '@component-news-events' with {
featured: {
type: 'event',
image: '1',
alt: '',
date: {
same_day: false,
all_day: false,
from: '2023-11-01 14:00:00',
to: '2023-11-03 15:00:00'
},
title: 'Featured Title',
url: '#',
location: 'Featured Location',
organizer: 'Featured Organizer',
categories: [
{
label: 'Featured Category',
url: '#'
}
]
},
events: [
{
image: '6',
alt: '',
date: {
same_day: true,
all_day: false,
from: '2023-10-22 14:00:00',
to: '2023-10-22 15:00:00'
},
title: 'Event Title',
url: '#',
location: 'Event Location',
organizer: 'Event Organizer',
categories: [
{
label: 'Event Category',
url: '#'
}
]
}
],
news: [
{
image: '8',
alt: '',
title: 'News Title',
publish: '2023-01-23 14:00:00',
url: '#',
department: 'News Department',
categories: [
{
label: 'News Category',
url: '#'
}
]
}
]
} %}
#}
<!-- News & Events -->
<div class="updates">
<div class="updates_header">
<div class="fs-row">
<div class="fs-cell">
<div class="updates_header_inner">
<h2 class="updates_title">News & Events</h2>
</div>
</div>
</div>
</div>
<div class="updates_body">
<div class="fs-row">
<div class="fs-cell">
<div class="updates_body_inner">
<div class="updates_grid">
<div class="updates_featured">
{% if featured.type == 'event' %}
<div class="updates_featured_item updates_featured_event">
<div class="updates_featured_media">
<figure class="updates_featured_item_figure">
<a class="updates_featured_item_figure_link" href="{{ featured.url }}" aria-label="Read more about {{ featured.title }}" tabindex="-1">
{% include '@partial-picture' with {
class: 'updates_featured_item',
image: featured.image,
alt: '',
loading: 'lazy',
default: img.wide.sml,
sources: {
'1220px': img.classic.xlrg,
'980px': img.classic.lrg,
'740px': img.wide.lrg,
'500px': img.wide.med
}
} %}
</a>
</figure>
<div class="updates_featured_item_calendar">
<span class="updates_featured_item_calendar_item">
<span class="updates_featured_item_calendar_month">{{ featured.date.from|date('M') }}</span>
<span class="updates_featured_item_calendar_day">{{ featured.date.from|date('j') }}</span>
</span>
{% if featured.date.same_day == false %}
<span class="updates_featured_item_calendar_separator"></span>
<span class="updates_featured_item_calendar_item">
<span class="updates_featured_item_calendar_month">{{ featured.date.to|date('M') }}</span>
<span class="updates_featured_item_calendar_day">{{ featured.date.to|date('j') }}</span>
</span>
{% endif %}
</div>
</div>
<div class="updates_featured_item_wrapper">
<div class="updates_featured_item_header">
<h2 class="updates_featured_item_title">
{% include '@partial-link' with {
class: 'updates_featured_item_title',
title: featured.title,
url: featured.url
} %}
</h2>
<div class="updates_featured_item_meta">
<div class="updates_featured_item_categories">
<ul class="updates_featured_item_categories_list" aria-label="Categories">
{% for category in featured.categories %}
<li class="updates_featured_item_categories_item">
<a class="updates_featured_item_categories_link" href="{{ category.url }}">{{ category.label }}</a>{% if not loop.last %}, {% endif %}
</li>
{% endfor %}
</ul>
</div>
<div class="updates_featured_item_separator"></div>
<div class="updates_featured_item_organizer">
<span class="updates_featured_item_organizer_label">{{ featured.organizer }}</span>
</div>
</div>
</div>
<div class="updates_featured_item_body">
<time class="updates_featured_item_date" datetime="{{ featured.date.from }}">
<span class="updates_featured_item_date_start">{{ featured.date.from|date('M j, Y') }}</span>
{% if featured.date.same_day == false %}
<span class="updates_featured_item_date_end"> - {{ featured.date.to|date('M j, Y') }}</span>
{% endif %}
@
<span class="updates_featured_item_date_time">{{ featured.date.from|date('g:i A') }} - {{ featured.date.to|date('g:i A') }}</span>
</time>
<div class="updates_featured_item_location">
<span class="updates_featured_item_location_label">{{ featured.location }}</span>
</div>
</div>
</div>
</div>
{% elseif featured.type == 'news' %}
<div class="updates_featured_item updates_featured_news">
<div class="updates_featured_media">
<figure class="updates_featured_item_figure">
<a class="updates_featured_item_figure_link" href="{{ featured.url }}" aria-label="Read more about {{ featured.title }}" tabindex="-1">
{% include '@partial-picture' with {
class: 'updates_featured_item',
image: featured.image,
alt: '',
loading: 'lazy',
default: img.wide.sml,
sources: {
'1220px': img.classic.xlrg,
'980px': img.classic.lrg,
'740px': img.wide.lrg,
'500px': img.wide.med
}
} %}
</a>
</figure>
</div>
<div class="updates_featured_item_wrapper">
<div class="updates_featured_item_header">
<h2 class="updates_featured_item_title">
{% include '@partial-link' with {
class: 'updates_featured_item_title',
title: featured.title,
url: featured.url
} %}
</h2>
<div class="updates_featured_item_meta">
<div class="updates_featured_item_categories">
<ul class="updates_featured_item_categories_list" aria-label="Categories">
{% for category in featured.categories %}
<li class="updates_featured_item_categories_item">
<a class="updates_featured_item_categories_link" href="{{ category.url }}">{{ category.label }}</a>{% if not loop.last %}, {% endif %}
</li>
{% endfor %}
</ul>
</div>
<div class="updates_featured_item_separator"></div>
<div class="updates_featured_item_departments">
<ul class="updates_featured_item_departments_list" aria-label="Departments">
{% for department in featured.departments %}
<li class="updates_featured_item_departments_item">
<a class="updates_featured_item_departments_link" href="{{ department.url }}">{{ department.label }}</a>{% if not loop.last %}, {% endif %}
</li>
{% endfor %}
</ul>
</div>
</div>
</div>
<div class="updates_featured_item_body">
<div class="updates_featured_item_publish">
<span class="updates_featured_item_publish_label">{{ featured.publish|date('m/d/Y') }}</span>
</div>
</div>
</div>
</div>
{% endif %}
</div>
<div class="updates_events">
<div class="updates_events_body">
{% for event in events %}
<div class="updates_events_item">
<div class="updates_events_item_media">
<figure class="updates_events_item_figure">
<a class="updates_events_item_figure_link" href="{{ event.url }}" aria-label="Read more about {{ event.title }}" tabindex="-1">
{% include '@partial-image' with {
class: 'updates_events_item',
alt: '',
image: event.image,
loading: 'lazy',
sources: [
img.classic.med,
img.classic.sml,
img.classic.xsml,
img.classic.xxsml
],
sizes: [
"25vw"
]
} %}
</a>
</figure>
<div class="updates_events_item_calendar">
<span class="updates_events_item_calendar_item">
<span class="updates_events_item_calendar_month">{{ event.date.from|date('M') }}</span>
<span class="updates_events_item_calendar_day">{{ event.date.from|date('j') }}</span>
</span>
{% if event.date.same_day == false %}
<span class="updates_events_item_calendar_separator"></span>
<span class="updates_events_item_calendar_item">
<span class="updates_events_item_calendar_month">{{ event.date.to|date('M') }}</span>
<span class="updates_events_item_calendar_day">{{ event.date.to|date('j') }}</span>
</span>
{% endif %}
</div>
</div>
<div class="updates_events_item_wrapper">
<div class="updates_events_item_header">
<h2 class="updates_events_item_title">
{% include '@partial-link' with {
class: 'updates_events_item_title',
title: event.title,
url: event.url
} %}
</h2>
<div class="updates_events_item_meta">
<div class="updates_events_item_categories">
<ul class="updates_events_item_categories_list" aria-label="Categories">
{% for category in event.categories %}
<li class="updates_events_item_categories_item">
<a class="updates_events_item_categories_link" href="{{ category.url }}">{{ category.label }}</a>{% if not loop.last %}, {% endif %}
</li>
{% endfor %}
</ul>
</div>
<div class="updates_events_item_separator"></div>
<div class="updates_events_item_organizer">
<span class="updates_events_item_organizer_label">{{ event.organizer }}</span>
</div>
</div>
</div>
<div class="updates_events_item_body">
<time class="updates_events_item_date" datetime="{{ event.date.from }}">
<span class="updates_events_item_date_start">{{ event.date.from|date('M j, Y') }}</span>
{% if event.date.same_day == false %}
<span class="updates_events_item_date_end"> - {{ event.date.to|date('M j, Y') }}</span>
{% endif %}
@
<span class="updates_events_item_date_time">{{ event.date.from|date('g:i A') }} - {{ event.date.to|date('g:i A') }}</span>
</time>
<div class="updates_events_item_location">
<span class="updates_events_item_location_label">{{ event.location }}</span>
</div>
</div>
</div>
</div>
{% endfor %}
</div>
<div class="updates_events_actions">
<div class="updates_events_action">
{% include '@partial-link' with {
class: 'updates_events_action',
title: 'View All Events',
url: '#',
icon: 'arrow_right',
nowrap: true
} %}
</div>
</div>
</div>
<div class="updates_news">
<div class="updates_news_body">
{% for item in news %}
<div class="updates_news_item">
<div class="updates_news_media">
<figure class="updates_news_item_figure">
<a class="updates_news_item_figure_link" href="{{ item.url }}" aria-label="Read more about {{ item.title }}" tabindex="-1">
{% include '@partial-image' with {
class: 'updates_news_item',
alt: '',
image: item.image,
loading: 'lazy',
sources: [
img.classic.med,
img.classic.sml,
img.classic.xsml,
img.classic.xxsml
],
sizes: [
"(min-width: 980px) 20vw",
"25vw"
]
} %}
</a>
</figure>
</div>
<div class="updates_news_item_wrapper">
<div class="updates_news_item_header">
<h2 class="updates_news_item_title">
{% include '@partial-link' with {
class: 'updates_news_item_title',
title: item.title,
url: item.url
} %}
</h2>
<div class="updates_news_item_meta">
<div class="updates_news_item_categories">
<ul class="updates_news_item_categories_list" aria-label="Categories">
{% for category in item.categories %}
<li class="updates_news_item_categories_item">
<a class="updates_news_item_categories_link" href="{{ category.url }}">{{ category.label }}</a>{% if not loop.last %}, {% endif %}
</li>
{% endfor %}
</ul>
</div>
<div class="updates_news_item_separator"></div>
<div class="updates_news_item_departments">
<ul class="updates_news_item_departments_list" aria-label="Departments">
{% for department in item.departments %}
<li class="updates_news_item_departments_item">
<a class="updates_news_item_departments_link" href="{{ department.url }}">{{ department.label }}</a>{% if not loop.last %}, {% endif %}
</li>
{% endfor %}
</ul>
</div>
</div>
</div>
<div class="updates_news_item_body">
<div class="updates_news_item_publish">
<span class="updates_news_item_publish_label">{{ item.publish|date('m/d/Y') }}</span>
</div>
</div>
</div>
</div>
{% endfor %}
</div>
<div class="updates_news_actions">
<div class="updates_news_action events">
{% include '@partial-link' with {
class: 'updates_news_action',
title: 'View All Events',
url: '#',
icon: 'arrow_right',
nowrap: true
} %}
</div>
<div class="updates_news_action news">
{% include '@partial-link' with {
class: 'updates_news_action',
title: 'View All News',
url: '#',
icon: 'arrow_right',
nowrap: true
} %}
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- END: News & Events -->
No notes defined.