div(layout="column" layout-fill class="images" ng-controller="ContainersCtrl" flex)
  md-toolbar(layout="column" md-theme="none" flex style="max-height: 64px;")
    md-list(layout="row" md-theme="default" role="list")
      md-item(flex=10 layout-align="center center" layout="column")
        md-item-content
          md-tooltip All
          md-switch(ng-model="queryParams.all" aria-label="All")
      md-item(flex=10 layout-align="center center" layout="column")
        md-item-content
          md-tooltip Size
          md-switch(ng-model="queryParams.size" aria-label="Size")
      md-item(flex=15 layout-align="center center" layout="column")
        md-item-content
          md-tooltip Since
          md-input-container
            label Since
            input(ng-model="queryParams.since")
      md-item(flex=15 layout-align="center center" layout="column")
        md-item-content
          md-tooltip Before
          md-input-container
            label Before
            input(ng-model="queryParams.before")
      md-item(flex=15 layout-align="center center" layout="column")
        md-item-content
          md-tooltip Limit
          md-input-container
            label Limit
            input(ng-model="queryParams.limit")
      md-item(flex=15 layout-align="center center" layout="column")
        md-item-content
          md-tooltip Filters
          md-input-container
            label Filters
            input(ng-model="queryParamsFilters")
      md-item(style="position: absolute; right: 0;")
        md-item-content
          md-tooltip Search
          md-button(aria-label="Search" ng-click="search()")
            div.icon.svg-ic_search_24px

  md-content(style="margin-top: 16px;")
    md-list
      md-item(ng-if="!containers || containers.length === 0")
        md-item-content(layout-align="center center")
          div No Containers
      md-item(ng-repeat="container in containers")
        md-divider(ng-if="!$first")
        md-item-content
          div(class="md-tile-left")
            div.icon.svg-ic_crop_original_24px(style="margin: 0 auto;")
          div(class="md-tile-content")
            h3(ng-init="container.Id = (container.Id | limitTo: 12)" title="{{ container.Id }}")
              span ID:
              a(ng-href="#/containers/{{ container.Id }}") {{ container.Id }}
            p Names: {{ container.Names.join(', ') }}
            p
              span Created: 
              span(am-time-ago="container.Created" am-preprocess="unix")
            p
              span Status: 
              span {{ container.Status }}
            p Ports: {{ displayablePorts(container.Ports) }}
            p(ng-if="container.SizeRw >= 0") SizeRw: {{ container.SizeRw | prettyBytes }}
            p(ng-if="container.SizeRootFs >= 0") SizeRootFs: {{ container.SizeRootFs | prettyBytes }}
            p
              | Command: <span style="background: #eee;">{{ container.Command }}</span>
            p
              span Image:
              a(ng-init="container.Image = (container.Image | formatImageId)" ng-href="#/images/{{ container.Image | escape }}") {{ container.Image }}