UIViewport

Usage

<ui-viewport appready.trigger="fn($event)">
  <ui-app-header>
    <!-- Menu Drawer Toggle -->
    <ui-drawer-toggle drawer.bind="menuDrawer"></ui-drawer-toggle>

    <!-- App Header Title -->
    <ui-app-title src="app logo" class="">
      <h6>
        <span>App Title</span>
        <small>App subtitle....</small>
      </h6>
      <ui-filler></ui-filler>

      <!-- Header right-side options -->
    </ui-app-title>
  </ui-app-header>

  <!-- Side Menu Drawer -->
  <ui-drawer ref="menuDrawer"></ui-drawer>

  <!-- Aurelia Route Container -->
  <ui-router-view></ui-router-view>

  <!-- App TaskBar Quick Links -->
  <ui-app-quick-links>
    <ui-button square>Search</ui-button>
  </ui-app-quick-links>

  <!-- App Footer -->
  <ui-app-footer>
    <small>Version</small>
    <small>Copyright</small>
  </ui-app-footer>
</ui-viewport>