<div ng-controller="AppCtrl" layout="column" style="height:600px" ng-cloak>

  <md-toolbar md-scroll-shrink ng-if="true" ng-controller="TitleController">
    <div class="md-toolbar-tools">
      <h3>
        <span>{{title}}</span>
      </h3>
    </div>
  </md-toolbar>

  <md-content flex>

    <md-list>

      <md-list-item class="md-3-line" ng-repeat="item in todos">
        <img ng-src="{{item.face}}" alt="{{item.who}}" class="md-avatar">

        <div class="md-list-item-text">
          <h3>{{item.what}}</h3>
          <h4>{{item.who}}</h4>

          <p>
            {{item.notes}}
          </p>
        </div>
        <md-divider inset></md-divider>
      </md-list-item>

    </md-list>

  </md-content>

</div>
