<!-- Showcase -->
<section class="showcase comp_style__light" id="showcase-1" data-js-accordion='{"grouped":false}' aria-labelledby="showcase-1__title">
<div class="fw-container">
<div class="showcase__inner">
<div class="showcase__header">
<h2 class="showcase__title" id="showcase-1__title">A Day in the Life</h2>
</div>
<div class="showcase__items">
<div class="showcase__item" id="showcase-1__item-1" data-js-accordion-item>
<h3 class="showcase__item-heading">
<button class="showcase__item-button" id="showcase-1__item-1-button" data-js-accordion-swap aria-controls="showcase-1__item-1-meta" aria-expanded="false">
<span class="showcase__item-button-inner">
<span class="showcase__item-button-label">
<span class="showcase__item-button-title">Start With Art</span>
<span class="showcase__item-button-prefix">8:30 a.m.</span>
</span>
</span>
</button>
</h3>
<div class="showcase__item-meta" id="showcase-1__item-1-meta" role="region" aria-labelledby="showcase-1__item-1-button">
<div class="showcase__item-meta-description">
Dream Academy Charter transforms teaching and learning through a vibrant, arts & artist integrated approach that empowers every student to achieve.
</div>
<div class="showcase__item-meta-link">
<a class="button-paint
button-paint--light
" href="#">
<span class="button-paint__inner"> <span class="button-paint__label">Learn More</span>
</span>
</a>
</div>
</div>
</div>
<div class="showcase__item" id="showcase-1__item-2" data-js-accordion-item>
<h3 class="showcase__item-heading">
<button class="showcase__item-button" id="showcase-1__item-2-button" data-js-accordion-swap aria-controls="showcase-1__item-2-meta" aria-expanded="false">
<span class="showcase__item-button-inner">
<span class="showcase__item-button-label">
<span class="showcase__item-button-title">Core Curriculum</span>
<span class="showcase__item-button-prefix">9:30 a.m.</span>
</span>
</span>
</button>
</h3>
<div class="showcase__item-meta" id="showcase-1__item-2-meta" role="region" aria-labelledby="showcase-1__item-2-button">
<div class="showcase__item-meta-description">
Dream Academy Charter transforms teaching and learning through a vibrant, arts & artist integrated approach that empowers every student to achieve. Sed pretium, ligula sollicitudin laoreet viverra, tortor libero sodales leo, eget blandit nunc tortor eu nibh.
</div>
<div class="showcase__item-meta-link">
<a class="button-paint
button-paint--light
" href="#">
<span class="button-paint__inner"> <span class="button-paint__label">Learn More</span>
</span>
</a>
</div>
</div>
</div>
<div class="showcase__item" id="showcase-1__item-3" data-js-accordion-item>
<h3 class="showcase__item-heading">
<button class="showcase__item-button" id="showcase-1__item-3-button" data-js-accordion-swap aria-controls="showcase-1__item-3-meta" aria-expanded="false">
<span class="showcase__item-button-inner">
<span class="showcase__item-button-label">
<span class="showcase__item-button-title">Interdisciplinary Enrichment</span>
<span class="showcase__item-button-prefix">11:00 a.m.</span>
</span>
</span>
</button>
</h3>
<div class="showcase__item-meta" id="showcase-1__item-3-meta" role="region" aria-labelledby="showcase-1__item-3-button">
<div class="showcase__item-meta-description">
Dream Academy Charter transforms teaching and learning through a vibrant, arts & artist integrated approach that empowers every student to achieve.
</div>
<div class="showcase__item-meta-link">
<a class="button-paint
button-paint--light
" href="#">
<span class="button-paint__inner"> <span class="button-paint__label">Learn More</span>
</span>
</a>
</div>
</div>
</div>
<div class="showcase__item" id="showcase-1__item-4" data-js-accordion-item>
<h3 class="showcase__item-heading">
<button class="showcase__item-button" id="showcase-1__item-4-button" data-js-accordion-swap aria-controls="showcase-1__item-4-meta" aria-expanded="false">
<span class="showcase__item-button-inner">
<span class="showcase__item-button-label">
<span class="showcase__item-button-title">Lunch & Creative Play</span>
<span class="showcase__item-button-prefix">12:00 p.m.</span>
</span>
</span>
</button>
</h3>
<div class="showcase__item-meta" id="showcase-1__item-4-meta" role="region" aria-labelledby="showcase-1__item-4-button">
<div class="showcase__item-meta-description">
Dream Academy Charter transforms teaching and learning through a vibrant, arts & artist integrated approach that empowers every student to achieve. Lorem ipsum dolor sit amet, consectetuer adipiscing elit.
</div>
<div class="showcase__item-meta-link">
<a class="button-paint
button-paint--light
" href="#">
<span class="button-paint__inner"> <span class="button-paint__label">Learn More</span>
</span>
</a>
</div>
</div>
</div>
<div class="showcase__item" id="showcase-1__item-5" data-js-accordion-item>
<h3 class="showcase__item-heading">
<button class="showcase__item-button" id="showcase-1__item-5-button" data-js-accordion-swap aria-controls="showcase-1__item-5-meta" aria-expanded="false">
<span class="showcase__item-button-inner">
<span class="showcase__item-button-label">
<span class="showcase__item-button-title">Core Curriculum</span>
<span class="showcase__item-button-prefix">1:00 p.m.</span>
</span>
</span>
</button>
</h3>
<div class="showcase__item-meta" id="showcase-1__item-5-meta" role="region" aria-labelledby="showcase-1__item-5-button">
<div class="showcase__item-meta-description">
Dream Academy Charter transforms teaching and learning through a vibrant, arts & artist integrated approach that empowers every student to achieve.
</div>
<div class="showcase__item-meta-link">
<a class="button-paint
button-paint--light
" href="#">
<span class="button-paint__inner"> <span class="button-paint__label">Learn More</span>
</span>
</a>
</div>
</div>
</div>
<div class="showcase__item" id="showcase-1__item-6" data-js-accordion-item>
<h3 class="showcase__item-heading">
<button class="showcase__item-button" id="showcase-1__item-6-button" data-js-accordion-swap aria-controls="showcase-1__item-6-meta" aria-expanded="false">
<span class="showcase__item-button-inner">
<span class="showcase__item-button-label">
<span class="showcase__item-button-title">Interdisciplinary Enrichment</span>
<span class="showcase__item-button-prefix">2:00 p.m.</span>
</span>
</span>
</button>
</h3>
<div class="showcase__item-meta" id="showcase-1__item-6-meta" role="region" aria-labelledby="showcase-1__item-6-button">
<div class="showcase__item-meta-description">
Dream Academy Charter transforms teaching and learning through a vibrant, arts & artist integrated approach that empowers every student to achieve.Donec nec justo eget felis facilisis fermentum. Aliquam porttitor mauris sit amet orci.
</div>
<div class="showcase__item-meta-link">
<a class="button-paint
button-paint--light
" href="#">
<span class="button-paint__inner"> <span class="button-paint__label">Learn More</span>
</span>
</a>
</div>
</div>
</div>
<div class="showcase__item" id="showcase-1__item-7" data-js-accordion-item>
<h3 class="showcase__item-heading">
<button class="showcase__item-button" id="showcase-1__item-7-button" data-js-accordion-swap aria-controls="showcase-1__item-7-meta" aria-expanded="false">
<span class="showcase__item-button-inner">
<span class="showcase__item-button-label">
<span class="showcase__item-button-title">Activity Through Art</span>
<span class="showcase__item-button-prefix">2:30 p.m.</span>
</span>
</span>
</button>
</h3>
<div class="showcase__item-meta" id="showcase-1__item-7-meta" role="region" aria-labelledby="showcase-1__item-7-button">
<div class="showcase__item-meta-description">
Dream Academy Charter transforms teaching and learning through a vibrant, arts & artist integrated approach that empowers every student to achieve.
</div>
<div class="showcase__item-meta-link">
<a class="button-paint
button-paint--light
" href="#">
<span class="button-paint__inner"> <span class="button-paint__label">Learn More</span>
</span>
</a>
</div>
</div>
</div>
<div class="showcase__item" id="showcase-1__item-8" data-js-accordion-item>
<h3 class="showcase__item-heading">
<button class="showcase__item-button" id="showcase-1__item-8-button" data-js-accordion-swap aria-controls="showcase-1__item-8-meta" aria-expanded="false">
<span class="showcase__item-button-inner">
<span class="showcase__item-button-label">
<span class="showcase__item-button-title">After School Programming</span>
<span class="showcase__item-button-prefix">3:00 p.m.</span>
</span>
</span>
</button>
</h3>
<div class="showcase__item-meta" id="showcase-1__item-8-meta" role="region" aria-labelledby="showcase-1__item-8-button">
<div class="showcase__item-meta-description">
Dream Academy Charter transforms teaching and learning through a vibrant, arts & artist integrated approach that empowers every student to achieve.
</div>
<div class="showcase__item-meta-link">
<a class="button-paint
button-paint--light
" href="#">
<span class="button-paint__inner"> <span class="button-paint__label">Learn More</span>
</span>
</a>
</div>
</div>
</div>
</div>
</div>
</div>
</section>
<!-- END: Showcase -->
{#
{% include '@component-showcase' with {
group_title: 'Group Title',
items: [
{
prefix: 'Item Prefix',
title: 'Item Title',
description: 'Item Description',
image: '2',
alt: '',
link: {
label: 'Item Link Label',
url: '#'
}
}
]
} %}
#}
{% set id = uniqid('showcase') %}
{% set has_group_title = group_title is not empty %}
{% set heading_level = heading_level ?? 2 %}
{% set base_tag = has_group_title ? 'section' : 'div' %}
{% set group_heading_tag = 'h' ~ (heading_level) %}
{% set item_heading_tag = has_group_title ? 'h' ~ (heading_level + 1) : 'h' ~ (heading_level) %}
{% set comp_style = group_style ? 'comp_style__' ~ group_style : 'comp_style__light' %}
<!-- Showcase -->
<{{ base_tag }}
class="showcase {{ comp_style }}"
id="{{ id }}"
data-js-accordion='{{ { grouped: grouped }|json_encode }}'
{% if group_title %}
aria-labelledby="{{ id ~ '__title' }}"
{% endif %}
>
<div class="fw-container">
<div class="showcase__inner">
{% if group_title %}
<div class="showcase__header">
<{{ group_heading_tag }} class="showcase__title" id="{{ id ~ '__title' }}">
{{- group_title -}}
</{{ group_heading_tag }}>
</div>
{% endif %}
<div class="showcase__items">
{% for item in items %}
{% set item_id = id ~ '__item-' ~ loop.index %}
{% set toggle_id = item_id ~ '-meta' %}
<div
class="showcase__item"
id="{{ item_id }}"
data-js-accordion-item
>
<{{ item_heading_tag }} class="showcase__item-heading">
<button
class="showcase__item-button"
id="{{ item_id ~ '-button' }}"
data-js-accordion-swap
aria-controls="{{ toggle_id }}"
aria-expanded="false"
>
<span class="showcase__item-button-inner">
<span class="showcase__item-button-label">
<span class="showcase__item-button-title">
{{- item.title -}}
</span>
{% if item.prefix %}
<span class="showcase__item-button-prefix">
{{- item.prefix -}}
</span>
{% endif %}
</span>
</span>
</button>
</{{ item_heading_tag }}>
<div
class="showcase__item-meta"
id="{{ toggle_id }}"
role="region"
aria-labelledby="{{ item_id ~ '-button' }}"
>
<div class="showcase__item-meta-description">
{{ item.description }}
</div>
<div class="showcase__item-meta-link">
{% if item.link %}
{% include '@partial-link' with {
classes: {
base: 'button-paint',
modifiers: [
'light'
]
},
title: item.link.label,
url: item.link.url,
icon: null
} only %}
{% endif %}
</div>
</div>
</div>
{% endfor %}
</div>
</div>
</div>
</{{ base_tag }}>
<!-- END: Showcase -->
No notes defined.