TheaterMania Component Library

Text Banner 

<div class="text-banner">
    <div class="text-banner__info contain">
        <div class="text-banner__info--copy">
            <h1 class="heading-xlarge">New York City Shows &amp; Tickets</h1>
            <div class="text-banner-text-container">
                <p class="text-banner-info-text">Here is a where a couple sentences will be to describe booking tickets at great prices. Enjoy everything at the best deals. Cum sociis natoque penatibus et magnis lorem ipsum dolor sit amet.</p>
            </div>
        </div>
    </div>
    <div class="text-banner__image">
        <div class="banner">
            <img src="/assets/images/guidepage/banner2.jpg" alt="image-alt" class="banner-image" />
        </div>

    </div>
</div>
 
<div class="text-banner{{#if class}} {{class}}{{/if}}">
  <div class="text-banner__info contain">
    {{#if image}}
      <img class="thumbnail text-banner__info-image" src="/assets/images/{{image}}" alt="{{image-alt}}" />
    {{/if}}
    <div class="text-banner__info--copy">
      <h1 class="heading-xlarge">{{title}}</h1>
      {{#if info}}
        <div class="text-banner-text-container">
          <p class="text-banner-info-text">{{info}}</p>
        </div>
      {{/if}}
    </div>
  </div>
  {{#if banner}}
    <div class="text-banner__image">
      {{render '@banner' banner-modifiers merge=true}}
    </div>
  {{/if}}
</div>
 
{
  "banner": true,
  "image": null,
  "title": "New York City Shows & Tickets",
  "info": "Here is a where a couple sentences will be to describe booking tickets at great prices. Enjoy everything at the best deals. Cum sociis natoque penatibus et magnis lorem ipsum dolor sit amet.",
  "banner-modifiers": {
    "full-banner": null,
    "image": "/assets/images/guidepage/banner2.jpg"
  }
}

There are no notes for this item.