<div class="forecast-section js-forecast-section" data-show-location="" data-warning-title="" data-warning-subtitle="" data-warning-type="" data-warning-icon="" data-index="">
<div class="forecast-section__background">
<figure class="image js-image " data-module="imagelazy" data-is-small-image="">
<img class="image__lowres js-image-lazyload" data-object-fit data-src="" alt="">
<picture class="image__container">
<img class="js-image-lazyload js-fallback-image" data-object-fit data-src="" alt="">
</picture>
</figure>
</div>
<div class="forecast-section__inner">
<div class="forecast-section__content">
<div class="forecast-section__content-inner js-forecast-content">
<h2 class="forecast-section__title"></h2>
</div>
</div>
</div>
</div>
<div class="forecast-section{{#if @first}} is-active{{/if}} js-forecast-section" data-show-location="{{showLocation}}" data-warning-title="{{weatherWarning.title}}" data-warning-subtitle="{{weatherWarning.subtitle}}" data-warning-type="{{weatherWarning.type}}" data-warning-icon="{{weatherWarning.icon}}" data-index="{{@index}}" {{#if isDefault}}data-is-default="true"{{/if}}>
<div class="forecast-section__background">
{{> @cp-medium-image backgroundResponsiveImage}}
</div>
<div class="forecast-section__inner">
<div class="forecast-section__content">
<div class="forecast-section__content-inner js-forecast-content">
<h2 class="forecast-section__title">{{title}}</h2>
{{#if subtitle}}<p class="forecast-section__subtitle">{{subtitle}}</p>{{/if}}
{{#if weather}}
<div class="forecast-section__main-forecast">
<div class="forecast-section__forecast-block forecast-section__forecast-block--weather">
<div class="forecast-section__icon">{{{weather.icon}}}</div>
<p class="forecast-section__text">{{weather.text}}</p>
</div>
{{#unless temperature}}</div>{{/unless}}
{{/if}}
{{#if temperature}}
{{#unless weather}}<div class="forecast-section__main-forecast">{{/unless}}
<div class="forecast-section__forecast-block forecast-section__forecast-block--temperature">
<p class="forecast-section__text">
<span class="forecast-section__celsius">{{{temperature.averageCelsius}}}</span>
<span class="forecast-section__fahrenheit">{{{temperature.averageFahrenheit}}}</span>
</p>
<p class="forecast-section__text">
<span class="forecast-section__celsius">{{temperature.rangeCelsius}}</span>
<span class="forecast-section__fahrenheit">{{{temperature.rangeFahrenheit}}}</span>
</p>
</div>
</div>
{{/if}}
{{#if weekForecast}}
<div class="forecast-section__information{{#unless weather}}{{#unless temperature}} forecast-section__information--no-main-forecast{{/unless}}{{/unless}}">
{{#each weekForecast}}
<div class="forecast-section__forecast-block">
<div class="forecast-section__icon">{{{icon}}}</div>
<p class="forecast-section__text">{{text}}</p>
<p class="forecast-section__text">
<span class="forecast-section__celsius">{{temperatureCelsius}}</span>
<span class="forecast-section__fahrenheit">{{{temperatureFahrenheit}}}</span>
</p>
</div>
{{/each}}
</div>
{{/if}}
{{#if informationItems}}
<div class="forecast-section__information">
{{#each informationItems}}
<div class="forecast-section__forecast-block">
<div class="forecast-section__icon">{{{icon}}}</div>
<p class="forecast-section__text">{{text}}</p>
</div>
{{/each}}
</div>
{{/if}}
</div>
</div>
</div>
</div>
/* No context defined for this component. */
There are no notes for this item.