text: <demo-page-title>
      <div header>Sidebar</div>
      <div sub-header>
          <p>A sidebar hides additional content beside a page</p>
      </div>
  </demo-page-title>
  <demo-page-content>
      <h2 class="ui dividing header">Examples</h2>
      <demo-example [code]="exampleStandardTemplate">
          <div info>
              <h4 class="ui header">Sidebar</h4>
              <p>A basic sidebar</p>
          </div>
          <example-sidebar-standard result></example-sidebar-standard>
      </demo-example>
      <demo-example [code]="exampleStandardTemplate">
          <div info>
              <h4 class="ui header">Direction</h4>
              <p>Sidebars can have a custom direction</p>
          </div>
          <div result>
              <example-sidebar-direction></example-sidebar-direction>
          </div>
      </demo-example>
      <p>For a full page sidebar, just place all of your page content within a <code>sui-sidebar-container</code>.</p>
      <h2 id="api" class="ui dividing header">API</h2>
      <demo-api [api]="api"></demo-api>
  </demo-page-content>
  