Grid

3
3
3
3
4
4
4
6
6
7
1
4
10

Typography

Marquee Header 1
<div class="serif-3 marquee">Marquee Header 1</h3>
Marquee Header 2
<div class="serif-2 marquee">Marquee Header 2</h3>
Marquee Header 3
<div class="serif-1 marquee">Marquee Header 3</h3>
Header 1 - General
<div class="serif-1">Header 1 - General</h3>
Header 2 - General
<div class="sans-3">Header 2 - General</h3>
Header 3 - General & Quote
<div class="sans-2">Header 3 - General & Quote</h3>
Header 4 - General
<div class="sans-1 caps">Header 4 - General</h3>
Header 5 - General
<div class="sans-1">Header 5 - General</h3>
Meta 1 - General
<div class="meta">Meta 1 - General</h3>
Meta 2
<div class="meta-small">Meta 2</h3>

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut tempus nec ex non tempus. Suspendisse non ante rhoncus, tempor dui vitae, facilisis neque. Etiam tempor at ipsum vitae varius. Etiam libero arcu, congue sed turpis vel, tempus bibendum risus. Duis tristique egestas nulla, ac fermentum urna. Cras sodales eu magna vel consequat. Suspendisse potenti. Aliquam ac rutrum dui, eu varius augue.

<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut tempus nec ex non tempus. Suspendisse non ante rhoncus, tempor dui vitae, facilisis neque. Etiam tempor at ipsum vitae varius. Etiam libero arcu, congue sed turpis vel, tempus bibendum risus. Duis tristique egestas nulla, ac fermentum urna. Cras sodales eu magna vel consequat. Suspendisse potenti. Aliquam ac rutrum dui, eu varius augue.</p>

Icons & Buttons

{{ icon.calendar({ class: "shadow" }) }}
{{ icon.news({ class: "shadow" }) }}
{{ icon.stories({ class: "shadow" }) }}
{{ icon.smile({ class: "shadow" }) }}
{{ button.pill("#", "Learn More", { class: "" }) }}
{{ button.pill("#", "Learn More", { color: "green" }) }}
{{ button.pill("#", "Learn More", { color: "blue" }) }}
{{ button.pill("#", "Learn More", { color: "gold" }) }}
{{ button.pill("#", "Learn More", { color: "gold" }) }}
{{ button.pill("#", "Learn More", { color: "gold", icon: "calendar" }) }}
{{ button.pill("#", "Learn More", { color: "blue", icon: "news" }) }}
{{ button.pill("#", "Learn More", { color: "green", icon: "stories" }) }}
{{ button.block(data.url, "Read More") }}
{{ button.block(data.url, "Read More", { class: "blue" }) }}
{{ button.block(data.url, "Read More", { class: "green" }) }}
{{ button.block(data.url, "Read More", { class: "gold" }) }}

Stories & Announcements Cards

News Cards

{{ widgetItem.article({ title: "K Trip to the Clay Studio", publishedAt: "2016-03-24", url: "#", thumbnail: "/images/sg/example-2.jpg" })}}
{{ widgetItem.article({ title: "This week your Friday folder includes the winter issue of Tomorrow's Child.", publishedAt: "2016-03-24", url: "#" })}}
{{ widgetItem.article({ title: "Thank you for your generous donations to Greene Towne's 2015 Annual Thanksgiving Food Drive.", publishedAt: "2016-03-24", url: "#", thumbnail: "/images/sg/example-1.jpg" })}}
{{ widgetItem.article({ title: "The Montessori Minute Vid: Concentration", publishedAt: "2016-03-24", url: "#" })}}

News & Stories: List Items & Filters

March 24th, 2016

K Trip to the Clay Studio

Read More
{{ listItem.article({ type, "news", title: "K Trip to the Clay Studio", publishedAt: "2016-03-24", url: "#", thumbnail: "/images/sg/example-2.jpg"} )}}
March 24th, 2016

Music with Mr. Bromall

Read More
{{ listItem.article({ type: "stories", title: "Music with Mr. Bromall", publishedAt: "2016-03-24", url: "#", thumbnail: "/images/sg/example-1.jpg" })}}

Filter by Class

    Event Cards

    East and West Primary Parent/Child Classroom Visit

    March 31st, 2016
    See Details

    Holiday Toy Drive Begins

    March 31st, 2016
    See Details

    Staff Winter Party

    March 31st, 2016
    See Details

    Parent Workshop: Promoting Emotional and Social Intelligence

    March 31st, 2016
    See Details
    {{ widgetItem.article({ title: "K Trip to the Clay Studio", publishedAt: "2016-03-24", url: "#", thumbnail: "/images/sg/example-2.jpg" })}}
    {{ widgetItem.article({ title: "This week your Friday folder includes the winter issue of Tomorrow's Child.", publishedAt: "2016-03-24", url: "#" })}}
    {{ widgetItem.article({ title: "Thank you for your generous donations to Greene Towne's 2015 Annual Thanksgiving Food Drive.", publishedAt: "2016-03-24", url: "#", thumbnail: "/images/sg/example-1.jpg" })}}
    {{ widgetItem.article({ title: "The Montessori Minute Vid: Concentration", publishedAt: "2016-03-24", url: "#" })}}
    

    Event Index List Items

    School-wide Early Dismissal

    March 31st, 2016
    {{ listItem.event({ title: "School-wide Early Dismissal", url: "#", startDate: "2016-3-31", startTime: "8am", endDate: "2016-3-31", endTime: "8am" }) }}
    

    Staff Cards

    Helena Grady
    Head of School
    Maria Kaminstein
    Assistant Head of School
    Erika Goldberg
    Director of Advancement
    Nicole Leapheart
    Director of Communications
    Bonnie Clark
    Director of Development
    Joanna Hutchinson
    Business Manager
    Eileen Doyle
    Adinistrative Assistant-East
    Shawna Edmundson
    Administrative Assistant-West
    {{ widgetItem.person({ name: "Helena Grady", title: "Head of School", headshot: "/images/sg/example-2.jpg" }) }}
    {{ widgetItem.person({ name: "Maria Kaminstein", title: "Assistant Head of School", headshot: "/images/sg/example-2.jpg" }) }}
    {{ widgetItem.person({ name: "Erika Goldberg", title: "Director of Advancement", headshot: "/images/sg/example-2.jpg" }) }}
    {{ widgetItem.person({ name: "Nicole Leapheart", title: "Director of Communications", headshot: "/images/sg/example-2.jpg" }) }}
    
    {{ widgetItem.person({ name: "Bonnie Clark", title: "Director of Development" }) }}
    {{ widgetItem.person({ name: "Joanna Hutchinson", title: "Business Manager" }) }}
    {{ widgetItem.person({ name: "Eileen Doyle", title: "Adinistrative Assistant-East" }) }}
    {{ widgetItem.person({ name: "Shawna Edmundson", title: "Administrative Assistant-West" }) }}
    

    Program Navigation Cards

    Elemantary, my dear Watson

    Ages 8 - 12 years

    LEARN MORE
      // takes args title, subtitle, page and imagePath
      {{ program.base("Elemantary, my dear Watson", "Ages 8 - 12 years", { _url: "/" }, "#") }}
    

    Building Block Grid

    {{ aposSingleton(page, "bb1", "buildingBlock") }}
    {{ aposSingleton(page, "bb2", "buildingBlock") }}
    {{ aposSingleton(page, "bb3", "buildingBlock") }}
    

    Document Cards

    This is a document to read

    .pdf

    DOWNLOAD
    // takes args for label, path and extension
    {{ document.base("This is a document to read", "#", ".pdf") }}
    

    Slideshow

    {{ aposSingleton(page, "slideshowTest", "slideshow", defaults.slideshow) }}
    

    Rich Text