{{template "base/head" .}}
<div class="repository settings collaboration">
	{{template "repo/header" .}}
	<div class="ui container">
    {{template "repo/sidebar" .}}
		<div class="ui grid">
			{{template "repo/settings/navbar" .}}
			<div class="twelve wide column content">
				{{template "base/alert" .}}
				<h4 class="ui top attached header">
				  {{.i18n.Tr "repo.settings.collaboration"}}
				</h4>
				<div class="ui attached segment collaborator list">
	        {{range .Collaborators}}
					<div class="item">
	          {{if not (eq .Id $.Owner.Id)}}
	          <a href="{{$.RepoLink}}/settings/collaboration?remove={{.Name}}" class="ui right text red"><i class="fa fa-times"></i></a>
	          {{end}}
						<a href="{{AppSubUrl}}/{{.Name}}">
					    <img class="ui avatar image" src="{{.AvatarLink}}">
					    {{.DisplayName}}
						</a>
					</div>
	        {{end}}
        </div>
        <div class="ui bottom attached segment">
				  <form class="ui form" id="repo-collab-form" action="{{.Link}}" method="post">
				    {{.CsrfTokenHtml}}
				    <div class="inline field ui left">
				    	<div id="search-user-box">
				    	  <div class="ui input">
				    	    <input class="prompt" name="collaborator" placeholder="{{.i18n.Tr "repo.settings.search_user_placeholder"}}" autocomplete="off" required>
				    	  </div>
				    	  <div class="ui segment results hide"></div>
				    	</div>
				    </div>
	          <button class="ui green button">{{.i18n.Tr "repo.settings.add_collaborator"}}</button>
          </form>
        </div>
      </div>
    </div>
	</div>
</div>
{{template "base/footer" .}}