Better UX for managing teams
- Moves the add team member to an inline box, rather than a popup - Feedback bar is now used to show when a member is added, invited or removed - Fixes bugs around using the view on mobile Fixes #1509
This commit is contained in:
parent
949ceae4eb
commit
b272771147
6 changed files with 69 additions and 51 deletions
|
@ -16,27 +16,25 @@
|
|||
</div>
|
||||
|
||||
<div class="co-main-content-panel">
|
||||
<div class="team-view-header">
|
||||
<div ng-show="canEditMembers" class="side-controls">
|
||||
<div class="hidden-xs">
|
||||
<button class="btn btn-primary"
|
||||
id="showAddMember"
|
||||
data-title="Add Team Member"
|
||||
data-content-template="/static/directives/team-view-add.html"
|
||||
data-placement="bottom-right"
|
||||
bs-popover="bs-popover">
|
||||
<i class="fa fa-plus"></i>
|
||||
Add Team Member
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="feedback-bar" feedback="feedback"></div>
|
||||
|
||||
<!-- Description -->
|
||||
<div class="section-header">Team Description</div>
|
||||
<div class="team-view-header">
|
||||
<div class="description markdown-input" content="team.description"
|
||||
can-write="organization.is_admin"
|
||||
content-changed="updateForDescription"
|
||||
field-title="'team description'"></div>
|
||||
</div>
|
||||
|
||||
<!-- Members -->
|
||||
<div ng-show="canEditMembers" style="float:right; margin-top: 10px;">
|
||||
<div class="hidden-xs">
|
||||
<div ng-include="'/static/directives/team-view-add.html'" style="max-width: 500px;"></div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="section-header">Team Members</div>
|
||||
|
||||
<div class="empty" ng-if="!members.length">
|
||||
<div class="empty-primary-msg">This team has no members.</div>
|
||||
<div class="empty-secondary-msg">
|
||||
|
@ -57,7 +55,7 @@
|
|||
<span class="entity-reference" entity="member" namespace="organization.name"
|
||||
show-avatar="true" avatar-size="24"></span>
|
||||
</td>
|
||||
<td>
|
||||
<td class="options-col">
|
||||
<span class="cor-options-menu" ng-if="canEditMembers">
|
||||
<span class="cor-option" option-click="removeMember(member.name)">
|
||||
<i class="fa fa-times"></i> Remove {{ member.name }}
|
||||
|
@ -77,7 +75,7 @@
|
|||
<td class="user entity">
|
||||
<span class="entity-reference" entity="member" namespace="organization.name"></span>
|
||||
</td>
|
||||
<td>
|
||||
<td class="options-col">
|
||||
<span class="cor-options-menu" ng-if="canEditMembers">
|
||||
<span class="cor-option" option-click="removeMember(member.name)">
|
||||
<i class="fa fa-times"></i> Remove {{ member.name }}
|
||||
|
@ -103,7 +101,7 @@
|
|||
{{ member.email }}
|
||||
</span>
|
||||
</td>
|
||||
<td>
|
||||
<td class="options-col">
|
||||
<span class="cor-options-menu" ng-if="canEditMembers">
|
||||
<span class="cor-option" option-click="revokeInvite(member)">
|
||||
<i class="fa fa-times"></i> Revoke invite
|
||||
|
@ -113,12 +111,13 @@
|
|||
</tr>
|
||||
</table>
|
||||
|
||||
<!-- Add team member (mobile) -->
|
||||
<div ng-show="canEditMembers">
|
||||
<div ng-if-media="'(max-width: 767px)'">
|
||||
<div ng-include="'/static/directives/team-view-add.html'"></div>
|
||||
<div class="visible-xs" style="margin-top: 20px; padding-top: 10px; border-top: 1px solid #eee;">
|
||||
<div class="section-header">Add team member</div>
|
||||
<div ng-include="'/static/directives/team-view-add.html'" style="max-width: 500px;"></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
Reference in a new issue