<div class="formElmsView">
<h1>Sidebar component..</h1>
<channelApps-sidebar-container>

      <!-- A sidebar -->
      <channelApps-sidebar [(opened)]="_opened"  [showBackdrop]="_showBackdrop" [mode]="'push'"  [sidebarClass]="'demo-sidebar'"
        [ariaLabel]="'My sidebar'"  [closeOnClickOutside]="_closeOnClickOutside">
        <a routerLink="/home"><img class="logoImg" src="images/logo.png"></a>

         
      </channelApps-sidebar>

<!-- Page header -->
 
<!-- Page header -->
      <!-- Page content -->
      <section class="demo-contents">
          <button class="btn btn-primary" (click)="_toggleSidebar()">{{_opened ?'Close Sidebar':'Open Sidebar'}}</button>
          
     
       
      </section>
      <!-- Page content -->
     

    </channelApps-sidebar-container>
    <!--<footer></footer>-->

 <h1>Usage of Component</h1>
    <tabs>
      <tab tabTitle="HTML"> 
        
         
        <pre><code>
        &lt;channelApps-sidebar  > &lt;/channelApps-sidebar> 
 </code>
</pre>
      </tab>
      <tab tabTitle="TypeScript">
        
        <pre><code>
Import sidebar Component in app.module.ts

  "import &lt;sidebarComponen&gt; from './components/sidebar'";<br>

    </code>
</pre></tab>
      <tab tabTitle="CSS"></tab>
    </tabs>

</div>

