<div class="c-media-mentions-view">
<h2 id="js-filter-content-title" tabIndex="-1" class="u-sr-only"></h2>
<div id="js-filter-content" class="o-filter-content-container">
<div class="o-filter-content-container__loader">
<div class="o-filter-content-container__loader-icon"></div>
<span class="u-sr-only">Loading...</span>
</div>
<div id="js-replace-content" class="o-filter-content-container__inner">
<div class="o-column-panel c-c-media-mentions-view-year o-column-panel--collapsed" data-bkg-theme="base">
<div class="o-container">
<div class="o-row">
<div class="o-column-panel__header o-col o-col-sm-md-4">
<div class="o-column-panel__header-content">
<h2 class="o-column-panel__title f-title--h3">2021</h2>
</div>
</div>
<div class="o-column-panel__content o-col o-col-sm-md-8">
<ul class="c-media-mentions-view-year__list-items">
<li class="o-list-card c-media-mentions-view-year__list-item js-watch u-watch--fade-up">
<a href="" class="o-list-card__link o-list-card__link--no-image">
<div class="o-list-card__content">
<h4 class="o-list-card__title f-title--h5">
<span class="u-hover-drawline">Academy Science Camp: Life before dinosaurs</span>
</h4>
<p class="o-list-card__description f-text--small">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam a purus auctor massa in.</p>
<p class="o-list-card__date f-text--time">Thursday, February 12</p>
</div>
</a>
</li>
<li class="o-list-card c-media-mentions-view-year__list-item js-watch u-watch--fade-up">
<a href="" class="o-list-card__link o-list-card__link--no-image">
<div class="o-list-card__content">
<h4 class="o-list-card__title f-title--h5">
<span class="u-hover-drawline">Paleo Playdate</span>
</h4>
<p class="o-list-card__description f-text--small">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam a purus auctor massa in.</p>
<p class="o-list-card__date f-text--time">Thursday, February 12</p>
</div>
</a>
</li>
<li class="o-list-card c-media-mentions-view-year__list-item js-watch u-watch--fade-up">
<a href="" class="o-list-card__link o-list-card__link--no-image">
<div class="o-list-card__content">
<h4 class="o-list-card__title f-title--h5">
<span class="u-hover-drawline">Academy Science Camp: Secrets of the museum</span>
</h4>
<p class="o-list-card__description f-text--small">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam a purus auctor massa in.</p>
<p class="o-list-card__date f-text--time">Thursday, February 12</p>
</div>
</a>
</li>
</ul>
</div>
</div>
</div>
</div>
<div class="o-column-panel c-c-media-mentions-view-year o-column-panel--collapsed" data-bkg-theme="base">
<div class="o-container">
<div class="o-row">
<div class="o-column-panel__header o-col o-col-sm-md-4">
<div class="o-column-panel__header-content">
<h2 class="o-column-panel__title f-title--h3">2022</h2>
</div>
</div>
<div class="o-column-panel__content o-col o-col-sm-md-8">
<ul class="c-media-mentions-view-year__list-items">
<li class="o-list-card c-media-mentions-view-year__list-item js-watch u-watch--fade-up">
<a href="" class="o-list-card__link o-list-card__link--no-image">
<div class="o-list-card__content">
<h4 class="o-list-card__title f-title--h5">
<span class="u-hover-drawline">Academy Science Camp: Life before dinosaurs</span>
</h4>
<p class="o-list-card__description f-text--small">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam a purus auctor massa in.</p>
<p class="o-list-card__date f-text--time">Thursday, February 13</p>
</div>
</a>
</li>
<li class="o-list-card c-media-mentions-view-year__list-item js-watch u-watch--fade-up">
<a href="" class="o-list-card__link o-list-card__link--no-image">
<div class="o-list-card__content">
<h4 class="o-list-card__title f-title--h5">
<span class="u-hover-drawline">Academy Science Camp: Life before dinosaurs</span>
</h4>
<p class="o-list-card__description f-text--small">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam a purus auctor massa in.</p>
<p class="o-list-card__date f-text--time">Thursday, February 13</p>
</div>
</a>
</li>
<li class="o-list-card c-media-mentions-view-year__list-item js-watch u-watch--fade-up">
<a href="" class="o-list-card__link o-list-card__link--no-image">
<div class="o-list-card__content">
<h4 class="o-list-card__title f-title--h5">
<span class="u-hover-drawline">Academy Science Camp: Life before dinosaurs</span>
</h4>
<p class="o-list-card__description f-text--small">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam a purus auctor massa in.</p>
<p class="o-list-card__date f-text--time">Thursday, February 13</p>
</div>
</a>
</li>
</ul>
</div>
</div>
</div>
</div>
<div class="c-pagination-column o-container">
<div class="o-row">
<div class="c-pagination-column__content o-col o-col-sm-8 o-col-sm--offset-4">
<div class="o-pagination">
<nav class="o-pagination__nav" aria-label="Pagination">
<ul class="o-pagination__items" aria-label="Pagination links">
<li class="o-pagination__item">
<a href="#1" class="o-pagination__link" aria-current="page" aria-label="Current Page - Page 1">1</a>
</li>
<li class="o-pagination__item">
<a href="#2" class="o-pagination__link" aria-label="Page 2">2</a>
</li>
<li class="o-pagination__item">
<a href="#3" class="o-pagination__link" aria-label="Page 3">3</a>
</li>
<li class="o-pagination__item">
<a href="#4" class="o-pagination__link" aria-label="Page 4">4</a>
</li>
<li class="o-pagination__item o-pagination__item--elipsis">
<span class="o-pagination__elipsis"> … </span>
</li>
<li class="o-pagination__item">
<a href="#11" class="o-pagination__link" aria-label="Page 11">11</a>
</li>
</ul>
<div class="o-pagination__next">
<a href="#next" class="o-pagination__dir-link">
<span class="u-sr-only">Next Page</span>
<span class="o-pagination__dir-icon" aria-hidden="true">
<svg width="7" height="12" viewBox="0 0 7 12" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M1 1L6 6L1 11" class="u-ct-stroke" />
</svg>
</span>
</a>
</div>
</nav>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="c-media-mentions-view">
{% embed "04-objects/filters/filter-content-container" %}
{% block filterContainerContent %}
{% for year in years %}
{% include "06-components/press-room-views/helpers/media-mentions-view-year" with {
year: year.year,
items: year.items
} only %}
{% endfor %}
{% include "06-components/pagination-column" with pagination only %}
{% endblock %}
{% endembed %}
</div>
{
"pageColorTheme": "teal",
"years": [
{
"year": "2021",
"items": [
{
"title": "Academy Science Camp: Life before dinosaurs",
"image": "<img src=\"/images/experience/AcademyScienceCamp.jpg\" alt=\"\" />",
"description": "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam a purus auctor massa in.",
"date": "Thursday, February 12",
"time": "1:00p.m.–2:30p.m."
},
{
"title": "Paleo Playdate",
"image": "<img src=\"/images/experience/AcademyScienceCamp.jpg\" alt=\"\" />",
"description": "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam a purus auctor massa in.",
"date": "Thursday, February 12",
"time": "4:00p.m.–5:30p.m."
},
{
"title": "Academy Science Camp: Secrets of the museum",
"image": "<img src=\"/images/experience/AcademyScienceCamp.jpg\" alt=\"\" />",
"description": "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam a purus auctor massa in.",
"date": "Thursday, February 12",
"time": "2:00p.m.–3:00p.m."
}
]
},
{
"year": "2022",
"items": [
{
"title": "Academy Science Camp: Life before dinosaurs",
"image": "<img src=\"/images/experience/AcademyScienceCamp.jpg\" alt=\"\" />",
"description": "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam a purus auctor massa in.",
"date": "Thursday, February 13",
"time": "1:00p.m.–2:30p.m."
},
{
"title": "Academy Science Camp: Life before dinosaurs",
"image": "<img src=\"/images/experience/AcademyScienceCamp.jpg\" alt=\"\" />",
"description": "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam a purus auctor massa in.",
"date": "Thursday, February 13",
"time": "1:00p.m.–2:30p.m."
},
{
"title": "Academy Science Camp: Life before dinosaurs",
"image": "<img src=\"/images/experience/AcademyScienceCamp.jpg\" alt=\"\" />",
"description": "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam a purus auctor massa in.",
"date": "Thursday, February 13",
"time": "1:00p.m.–2:30p.m."
}
]
}
],
"pagination": {
"data": {
"prev": false,
"items": [
{
"title": "1",
"link": "#1",
"isCurrent": true
},
{
"title": "2",
"link": "#2"
},
{
"title": "3",
"link": "#3"
},
{
"title": "4",
"link": "#4"
},
{
"isElipsis": true
},
{
"link": "#11",
"title": "11"
}
],
"next": {
"title": "Next Page",
"link": "#next"
}
}
}
}
No notes defined.