<div class="c-news-summary" data-bkg-theme="light">
<div class="c-news-summary__content o-container ">
<h2 class="c-news-summary__title f-title--h3" id="news-summary4018">In the news</h2>
<ul class="o-row c-news-summary__list" aria-labelledby="news-summary4018">
<li class="c-news-summary__item o-col o-col-sm-6">
<a href="" class="c-news-summary__item-link">
<h3 class="c-news-summary__item-title f-text--small f-bold u-expanding-cta-arrow u-hover-drawline--parent--thin">
<span class="u-hover-drawline--child">Fun for Philly families this week</span>
<span class="c-news-summary__item-title-icon" aria-hidden="true"><svg width="31" height="16" viewBox="0 0 31 16" fill="none" xmlns="http://www.w3.org/2000/svg" class="u-cta-arrow">
<path class="u-ct-stroke u-cta-arrow__path" d="M0 8H20M20 8L13 1M20 8L13 15" />
</svg>
</span>
</h3>
<p class="c-news-summary__item-label f-text--tag f-upper f-spaced">Philadelphia Inquirer</p>
<p class="f-text--xsmall c-news-summary__item-desc">"Earth and Water Science Celebration with photo: “Leave it to the Academy of Natural Sciences to come up with activities we haven’t done with our own kids yet.”</p>
<p class="f-text--tag c-news-summary__item-date">Month/dd/yyyy</p>
</a>
</li>
<li class="c-news-summary__item o-col o-col-sm-6">
<a href="" class="c-news-summary__item-link">
<h3 class="c-news-summary__item-title f-text--small f-bold u-expanding-cta-arrow u-hover-drawline--parent--thin">
<span class="u-hover-drawline--child">Philly Gets Millions to Support Museums, Cultural Institutions</span>
<span class="c-news-summary__item-title-icon" aria-hidden="true"><svg width="31" height="16" viewBox="0 0 31 16" fill="none" xmlns="http://www.w3.org/2000/svg" class="u-cta-arrow">
<path class="u-ct-stroke u-cta-arrow__path" d="M0 8H20M20 8L13 1M20 8L13 15" />
</svg>
</span>
</h3>
<p class="c-news-summary__item-label f-text--tag f-upper f-spaced">Patch</p>
<p class="f-text--xsmall c-news-summary__item-desc">Academy receives $471,298 grant from the state’s COVID-19 Cultural and Museum Preservation Grant Program for cultural organizations and museums.</p>
<p class="f-text--tag c-news-summary__item-date">Month/dd/yyyy</p>
</a>
</li>
<li class="c-news-summary__item o-col o-col-sm-6">
<a href="" class="c-news-summary__item-link">
<h3 class="c-news-summary__item-title f-text--small f-bold u-expanding-cta-arrow u-hover-drawline--parent--thin">
<span class="u-hover-drawline--child">Academy of Natural Sciences showcasing first-of-its-kind wildlife exhibition on the East Coast</span>
<span class="c-news-summary__item-title-icon" aria-hidden="true"><svg width="31" height="16" viewBox="0 0 31 16" fill="none" xmlns="http://www.w3.org/2000/svg" class="u-cta-arrow">
<path class="u-ct-stroke u-cta-arrow__path" d="M0 8H20M20 8L13 1M20 8L13 15" />
</svg>
</span>
</h3>
<p class="c-news-summary__item-label f-text--tag f-upper f-spaced">KYW Newsradio</p>
<p class="f-text--xsmall c-news-summary__item-desc">An Interview with Scott Cooper about Wildlife Photographer of the Year exhibit.</p>
<p class="f-text--tag c-news-summary__item-date">Month/dd/yyyy</p>
</a>
</li>
<li class="c-news-summary__item o-col o-col-sm-6">
<a href="" class="c-news-summary__item-link">
<h3 class="c-news-summary__item-title f-text--small f-bold u-expanding-cta-arrow u-hover-drawline--parent--thin">
<span class="u-hover-drawline--child">What kind of bees or wasps are lurking in your backyard?</span>
<span class="c-news-summary__item-title-icon" aria-hidden="true"><svg width="31" height="16" viewBox="0 0 31 16" fill="none" xmlns="http://www.w3.org/2000/svg" class="u-cta-arrow">
<path class="u-ct-stroke u-cta-arrow__path" d="M0 8H20M20 8L13 1M20 8L13 15" />
</svg>
</span>
</h3>
<p class="c-news-summary__item-label f-text--tag f-upper f-spaced">CBS 3</p>
<p class="f-text--xsmall c-news-summary__item-desc">Entomology Curator Jon Gelhaus explains the difference between wasp and bee encounters to anchor who encountered them.</p>
<p class="f-text--tag c-news-summary__item-date">Month/dd/yyyy</p>
</a>
</li>
</ul>
</div>
</div>
{% set panelColorTheme = panelColorTheme ? panelColorTheme : 'base' %}
{% set hID = 'news-summary' ~ random(5000) %}
<div class="c-news-summary" data-bkg-theme="{{ panelColorTheme }}">
<div class="c-news-summary__content o-container ">
<h2 class="c-news-summary__title f-title--h3" id="{{hID}}">{{title}}</h2>
<ul class="o-row c-news-summary__list" aria-labelledby="{{hID}}">
{% for item in items %}
<li class="c-news-summary__item o-col o-col-sm-6">
<a href="{{downloadLink}}" class="c-news-summary__item-link">
<h3 class="c-news-summary__item-title f-text--small f-bold u-expanding-cta-arrow u-hover-drawline--parent--thin">
<span class="u-hover-drawline--child">{{item.title}}</span>
<span class="c-news-summary__item-title-icon" aria-hidden="true">{% include "03-icons/cta-expanding-arrow" %}</span>
</h3>
<p class="c-news-summary__item-label f-text--tag f-upper f-spaced">{{item.label}}</p>
<p class="f-text--xsmall c-news-summary__item-desc">{{item.description}}</p>
<p class="f-text--tag c-news-summary__item-date">{{item.date}}</p>
</a>
</li>
{% endfor %}
</ul>
</div>
</div>
{
"pageColorTheme": "teal",
"title": "In the news",
"panelColorTheme": "light",
"items": [
{
"label": "Philadelphia Inquirer",
"title": "Fun for Philly families this week",
"description": "\"Earth and Water Science Celebration with photo: “Leave it to the Academy of Natural Sciences to come up with activities we haven’t done with our own kids yet.”",
"date": "Month/dd/yyyy"
},
{
"label": "Patch",
"title": "Philly Gets Millions to Support Museums, Cultural Institutions",
"description": "Academy receives $471,298 grant from the state’s COVID-19 Cultural and Museum Preservation Grant Program for cultural organizations and museums.",
"date": "Month/dd/yyyy"
},
{
"label": "KYW Newsradio",
"title": "Academy of Natural Sciences showcasing first-of-its-kind wildlife exhibition on the East Coast",
"description": "An Interview with Scott Cooper about Wildlife Photographer of the Year exhibit.",
"date": "Month/dd/yyyy"
},
{
"label": "CBS 3",
"title": "What kind of bees or wasps are lurking in your backyard?",
"description": "Entomology Curator Jon Gelhaus explains the difference between wasp and bee encounters to anchor who encountered them.",
"date": "Month/dd/yyyy"
}
]
}
.c-news-summary {
margin: 6.4rem 0;
@include break($sm) {
margin: 20rem 0;
}
&[data-bkg-theme="light"] {
margin: 0;
padding: 6.4rem 0;
@include break($sm) {
margin: 0;
padding: 12rem 0;
}
}
}
.c-news-summary__title {
margin-bottom: 5rem;
}
.c-news-summary__item {
width: 100%;
margin: 2rem 0;
@include break($md){
margin: 2rem 0 7rem;
}
}
.c-news-summary__item-link {
display: flex;
flex-direction: column;
border-top: 0.1rem solid var(--ct-txt);
}
.c-news-summary__item-label {
margin: 2rem 0;
order: 1;
}
.c-news-summary__item-title {
margin: 1.5rem 0 0.5rem;
order: 2;
}
.c-news-summary__item-title-icon{
padding-left: 1rem;
}
.c-news-summary__item-desc {
margin: 1.6rem 0;
width: 95%;
order: 3;
@include break($xl){
width: 80%;
}
}
.c-news-summary__item-date {
order: 4;
}
No notes defined.