This is Center Stage

Center Stage is on every view in The City

Use it for the page title. Here's the basic usage:

<header class="center_stage">
  <h1>This is your title</h1>
  <div class="context_bar"></div>
</header>

There's an empty div there for the context bar. You need it in your markup. It'll show when you need it and not when you have tabs.

Add tabs for free.

If your content needs tabs, Center Stage is the place to put them. Place the following markup before the context bar div:

<nav class="stage-tabs">
  <ul>
    <li><a href="#">Foo</a></li>
    <li><a href="#">Bar</a></li>
    <li><a href="#">These</a></li>
    <li><a href="#">Are</a></li>
    <li><a href="#">Tabs</a></li>
  </ul>
</nav>

Full example

<header class="center_stage">
  <h1>This is your title</h1>
  <nav class="stage-tabs">
    <ul>
      <li><a href="#">Foo</a></li>
      <li><a href="#">Bar</a></li>
      <li><a href="#">These</a></li>
      <li><a href="#">Are</a></li>
      <li><a href="#">Tabs</a></li>
    </ul>
  </nav>
  <div class="context_bar"></div>
</header>