button groups for vault

This commit is contained in:
Kyle Spearrin 2017-03-30 23:49:35 -04:00
parent 11002c2881
commit a678f03284
2 changed files with 43 additions and 69 deletions

View File

@ -26,24 +26,6 @@ angular
$(document).off('click', '.sidebar li a'); $(document).off('click', '.sidebar li a');
} }
$('.table-responsive').on('shown.bs.dropdown', function (e) {
var t = $(this),
m = $(e.target).find('.dropdown-menu'),
tb = t.offset().top + t.height(),
mb = m.offset().top + m.outerHeight(true),
d = 20; // Space for shadow + scrollbar.
if (t[0].scrollWidth > t.innerWidth()) {
if (mb + d > tb) {
t.css('padding-bottom', ((mb + d) - tb));
}
}
else {
t.css('overflow', 'visible');
}
}).on('hidden.bs.dropdown', function () {
$(this).css({ 'padding-bottom': '', 'overflow': '' });
});
}); });
$scope.$on('$stateChangeSuccess', function (event, toState, toParams, fromState, fromParams) { $scope.$on('$stateChangeSuccess', function (event, toState, toParams, fromState, fromParams) {

View File

@ -38,37 +38,33 @@
<button type="button" ng-click="addLogin(null, true)" class="btn btn-default btn-flat">Add a Login</button> <button type="button" ng-click="addLogin(null, true)" class="btn btn-default btn-flat">Add a Login</button>
</div> </div>
<div class="table-responsive" ng-show="favoriteLogins.length"> <div class="table-responsive" ng-show="favoriteLogins.length">
<table class="table table-striped table-hover table-selectable"> <table class="table table-striped table-hover table-vmiddle">
<thead>
<tr>
<th style="width: 75px; min-width: 75px;"></th>
<th>Name</th>
<th style="width: 300px;">Username</th>
</tr>
</thead>
<tbody> <tbody>
<tr ng-repeat="login in favoriteLogins = (logins | filter: { favorite: true } | <tr ng-repeat="login in favoriteLogins = (logins | filter: { favorite: true } |
filter: (main.searchVaultText || '') | orderBy: ['name', 'username'])"> filter: (main.searchVaultText || '') | orderBy: ['name', 'username'])">
<td class="actions"> <td style="width: 70px;">
<button type="button" ng-click="deleteLogin(login)" class="btn btn-link btn-table" <div class="btn-group">
uib-tooltip="Delete"> <button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown">
<i class="fa fa-lg fa-trash"></i> <i class="fa fa-cog"></i> <span class="caret"></span>
</button>
<div class="tooltip-wrapper"
uib-tooltip="{{login.organizationId ? 'Already shared.' : 'Share'}}">
<button type="button" ng-click="share(login)" class="btn btn-link btn-table"
ng-disabled="login.organizationId !== null">
<i class="fa fa-lg fa-share-alt"></i>
</button> </button>
<ul class="dropdown-menu">
<li ng-show="!login.organizationId">
<a href="javascript:void(0)" ng-click="share(login)">
<i class="fa fa-fw fa-share-alt"></i> Share
</a>
</li>
<li>
<a href="javascript:void(0)" ng-click="deleteLogin(login)" class="text-red">
<i class="fa fa-fw fa-trash"></i> Delete
</a>
</li>
</ul>
</div> </div>
</td> </td>
<td ng-click="editLogin(login)"> <td>
<span ng-click="$event.stopPropagation()"> <a href="javascript:void(0)" ng-click="editLogin(login)">{{login.name}}</a>
<a href="javascript:void(0)" ng-click="editLogin(login)">{{login.name}}</a> <i class="fa fa-user text-muted" uib-tooltip="Shared" ng-show="login.organizationId"></i>
</span> <div class="text-sm text-muted">{{login.username}}</div>
</td>
<td ng-click="editLogin(login)">
<span ng-click="$event.stopPropagation()">{{login.username}}</span>
</td> </td>
</tr> </tr>
</tbody> </tbody>
@ -112,38 +108,34 @@
<button type="button" ng-click="addLogin(folder)" class="btn btn-default btn-flat">Add a Login</button> <button type="button" ng-click="addLogin(folder)" class="btn btn-default btn-flat">Add a Login</button>
</div> </div>
<div class="table-responsive" ng-show="folderLogins.length"> <div class="table-responsive" ng-show="folderLogins.length">
<table class="table table-striped table-hover table-selectable"> <table class="table table-striped table-hover table-vmiddle">
<thead>
<tr>
<th style="width: 75px; min-width: 75px;"></th>
<th>Name</th>
<th style="width: 300px;">Username</th>
</tr>
</thead>
<tbody> <tbody>
<tr ng-repeat="login in folderLogins = (logins | filter: { folderId: folder.id } | <tr ng-repeat="login in folderLogins = (logins | filter: { folderId: folder.id } |
filter: (main.searchVaultText || '') | orderBy: ['name', 'username'])"> filter: (main.searchVaultText || '') | orderBy: ['name', 'username'])">
<td class="actions"> <td style="width: 70px;">
<button type="button" ng-click="deleteLogin(login)" class="btn btn-link btn-table" <div class="btn-group">
uib-tooltip="Delete"> <button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown">
<i class="fa fa-lg fa-trash"></i> <i class="fa fa-cog"></i> <span class="caret"></span>
</button>
<div class="tooltip-wrapper"
uib-tooltip="{{login.organizationId ? 'Already shared.' : 'Share'}}">
<button type="button" ng-click="share(login)" class="btn btn-link btn-table"
ng-disabled="login.organizationId !== null">
<i class="fa fa-lg fa-share-alt"></i>
</button> </button>
<ul class="dropdown-menu">
<li ng-show="!login.organizationId">
<a href="javascript:void(0)" ng-click="share(login)">
<i class="fa fa-fw fa-share-alt"></i> Share
</a>
</li>
<li>
<a href="javascript:void(0)" ng-click="deleteLogin(login)" class="text-red">
<i class="fa fa-fw fa-trash"></i> Delete
</a>
</li>
</ul>
</div> </div>
</td> </td>
<td ng-click="editLogin(login)"> <td>
<span ng-click="$event.stopPropagation()"> <a href="javascript:void(0)" ng-click="editLogin(login)">{{login.name}}</a>
<a href="javascript:void(0)" ng-click="editLogin(login)">{{login.name}}</a> <i class="fa fa-star text-muted" uib-tooltip="Favorite" ng-show="login.favorite"></i>
<i class="fa fa-star text-muted" uib-tooltip="Favorite" ng-show="login.favorite"></i> <i class="fa fa-user text-muted" uib-tooltip="Shared" ng-show="login.organizationId"></i>
</span> <div class="text-sm text-muted">{{login.username}}</div>
</td>
<td ng-click="editLogin(login)">
<span ng-click="$event.stopPropagation()">{{login.username}}</span>
</td> </td>
</tr> </tr>
</tbody> </tbody>