quay/static/partials/team-view.html

<div class="resource-view" resource="orgResource" error-message="'No matching organization'">
  <div class="team-view container">
    <div class="organization-header" organization="organization" team-name="teamname">
      <div ng-show="canEditMembers" class="side-controls">
        <div class="hidden-sm hidden-xs">
        <button class="btn btn-success" data-trigger="click"
                data-title="Add Team Member"
                data-content-template="/static/directives/team-view-add.html" 
                data-placement="bottom-right"
                bs-popover>
          <i class="fa fa-plus"></i>
          Add Team Member
        </button>
        </div>
      </div>
    </div>
    
    <div class="resource-view" resource="membersResource" error-message="'No matching team found'">
      <div class="description markdown-input" content="team.description" can-write="organization.is_admin"
           content-changed="updateForDescription" field-title="'team description'"></div>       

      <div class="empty-message" ng-if="!members.length">
        This team has no members
      </div>

      <div class="empty-message" ng-if="members.length && !(members | filter:search).length">
        No matching team members found
      </div>
      
      <table class="member-listing" style="margin-top: -20px" ng-show="members.length">
        <!-- Members -->
        <tr ng-if="(members | filter:search | filter: filterFunction(false, false)).length">
          <td colspan="2"><div class="section-header">Team Members</div></td>
        </tr>

        <tr ng-repeat="member in members | filter:search | filter: filterFunction(false, false) | orderBy: 'name'">
          <td class="user entity">
            <span class="entity-reference" entity="member" namespace="organization.name" show-gravatar="true" gravatar-size="32"></span>
          </td>
          <td>
            <span class="delete-ui" delete-title="'Remove ' + member.name  + ' From Team'" button-title="'Remove'"
                  perform-delete="removeMember(member.name)" ng-if="canEditMembers"></span>
          </td>
        </tr>     
        
        <!-- Robots -->
        <tr ng-if="(members | filter:search | filter: filterFunction(false, true)).length">
          <td colspan="2"><div class="section-header">Robot Accounts</div></td>
        </tr>

        <tr ng-repeat="member in members | filter:search | filter: filterFunction(false, true) | orderBy: 'name'">
          <td class="user entity">
            <span class="entity-reference" entity="member" namespace="organization.name"></span>
          </td>
          <td>
            <span class="delete-ui" delete-title="'Remove ' + member.name  + ' From Team'" button-title="'Remove'"
                  perform-delete="removeMember(member.name)" ng-if="canEditMembers"></span>
          </td>
        </tr>

        <!-- Invited -->
        <tr ng-if="(members | filter:search | filter: filterFunction(true, false)).length">
          <td colspan="2"><div class="section-header">Invited To Join</div></td>
        </tr>

        <tr ng-repeat="member in members | filter:search | filter: filterFunction(true, false) | orderBy: 'name'">
          <td class="user entity">
            <span ng-if="member.kind != 'invite'">
              <span class="entity-reference" entity="member" namespace="organization.name" show-gravatar="true" gravatar-size="32"></span>
            </span>
            <span class="invite-listing" ng-if="member.kind == 'invite'">
              <img class="gravatar"ng-src="//www.gravatar.com/avatar/{{ member.gravatar  }}?s=32&amp;d=identicon">
              {{ member.email }}
            </span>
          </td>
          <td>
          </td>
        </tr>
      </table>

      <div ng-show="canEditMembers">
        <div ng-if-media="'(max-width: 560px)'">
          <div ng-include="'/static/directives/team-view-add.html'"></div>
        </div>
      </div>

    </div>
  </div>
</div>

<!-- Modal message dialog -->
<div class="modal fade" id="cannotChangeTeamModal">
  <div class="modal-dialog">
    <div class="modal-content">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
        <h4 class="modal-title">Cannot change team</h4>
      </div>
      <div class="modal-body">
        You do not have permission to change properties of this team.
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
      </div>
    </div><!-- /.modal-content -->
  </div><!-- /.modal-dialog -->
</div><!-- /.modal -->

<!-- Modal message dialog -->
<div class="modal fade" id="cannotChangeMembersModal">
  <div class="modal-dialog">
    <div class="modal-content">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
        <h4 class="modal-title">Cannot change members</h4>
      </div>
      <div class="modal-body">
        You do not have permission to change the members of this team.
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
      </div>
    </div><!-- /.modal-content -->
  </div><!-- /.modal-dialog -->
</div><!-- /.modal -->