div(layout="column" layout-fill class="images" ng-controller="ImagesCtrl" flex)
  md-toolbar(layout="column" md-theme="none" flex style="max-height: 64px;")
    md-list(layout="row" role="list" md-theme="default")
      md-item(flex=10 layout-align="center center" layout="column")
        md-item-content(layout-align="center center")
          md-tooltip All
          md-switch(ng-model="queryParams.all" aria-label="All")
      md-item(flex=15 layout-align="center center" layout="column")
        md-item-content(layout-align="center center")
          md-tooltip Filters
          md-input-container(flex)
            label Filters
            input(ng-model="queryParamsFilters")
      md-item
        md-item-content
          md-button(aria-label="Push Image" ng-click="push($event)")
            md-tooltip Push on the registry
            div.icon.svg-ic_cloud_upload_24px
      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="!images || images.length === 0")
        md-item-content(layout-align="center center")
          div No Images
      md-item(ng-repeat="image in images")
        md-divider(ng-if="!$first")
        md-item-content
          div(class="md-tile-left")
            div.icon.svg-ic_photo_24px(style="margin: 0 auto;")
          div(class="md-tile-content")
            h3(ng-init="image.Id = (image.Id | limitTo: 12)" title="{{ image.Id }}")
              span ID: 
              a(ng-href="#/images/{{ image.Id }}") {{ image.Id }}
            h4 Repository: {{ getRepo(image.RepoTags) }}
            p Tags: {{ getTags(image.RepoTags) }}
            p Size: {{ image.Size | prettyBytes }}
            p VirtualSize: {{ image.VirtualSize | prettyBytes }}
            p
              span Created: 
              span(am-time-ago="image.Created" am-preprocess="unix")
