Now on stage: Explore upcoming performances and get tickets — New Oak Theatre

Component Playground

Kitchen-sink demo of sections and components commonly used on site pages. Use this as a reference when composing new pages.

BasicHero — Headline & CTA

Use BasicHero for simple page intros with optional subheader and button theming.

Marquee

Section Header

ImageBoxGrid

Use for a lead image with flexible text content. Great for About and Education pages.

CheckeredImages

Flexible text + image layout

Swap image sides, set max-width, and theme background/text colors using tokens or hex.

Community photo

Flexible text + image layout

Swap image sides, set max-width, and theme background/text colors using tokens or hex.

Performance photo

Flexible text + image layout

Swap image sides, set max-width, and theme background/text colors using tokens or hex.

Event photo

Card One

Any content can go here—buttons, links, or text.

Card Two

Use predefined themes or your own utility classes.

Card Three

Mix with other components for flexible layouts.

BenefitsHero

Primary CTA

Clear calls to action

Guide visitors to events, donations, auditions, and newsletter.

Flexible layouts

Compose sections as needed: hero, grid, lists, FAQs.

SEO friendly

Semantic headings, JSON-LD FAQ, and internal links.

FeatureList

Engagement

  • Carousel hero
  • Asymmetric grid
  • Inline signup

Content

  • Image + copy grid
  • FAQ component
  • Feature list

CTA

  • Basic hero CTA
  • Benefits hero with button

Theming

  • Azure/Tangerine/Neutral themes
  • Utility overrides

AsymectricGrid

Savannah GA Theatre FAQ