github
/
portainer
mirror of https://github.com/portainer/portainer
1
0
Fork 0
Code Issues Releases Wiki Activity

feat(roles): updated roles view css UI (#7389) 

* feat(roles): updated roles view css UI

* feat(roles): updated icons
pull/7429/head
fhanportainer 2022-08-05 10:26:33 +12:00 committed by GitHub
parent 5e74b90780
commit f2d93654f5
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
4 changed files with 46 additions and 29 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

35
app/portainer/rbac/components/access-viewer/access-viewer-datatable/access-viewer-datatable.html
View File

@ -1,25 +1,36 @@
<div class="datatable"> <div class="datatable">
<div class="searchBar"> <div class="searchBar">
<i class="fa fa-search searchIcon" aria-hidden="true"></i> <pr-icon icon="'search'" class="vertical-center" feather="true"></pr-icon>
<input type="text" class="searchInput" ng-model="$ctrl.state.textFilter" ng-change="$ctrl.onTextFilterChange()" placeholder="Search..." ng-model-options="{ debounce: 300 }" /> <input
type="text"
class="searchInput ml-1"
ng-model="$ctrl.state.textFilter"
ng-change="$ctrl.onTextFilterChange()"
placeholder="Search..."
ng-model-options="{ debounce: 300 }"
/>
</div> </div>
<div class="table-responsive"> <div class="table-responsive">
<table class="table table-hover nowrap-cells"> <table class="table table-hover nowrap-cells">
<thead> <thead>
<tr> <tr>
<th> <th>
<a ng-click="$ctrl.changeOrderBy('EndpointName')"> <table-column-header
Environment col-title="'Environment'"
<i class="fa fa-sort-alpha-down" aria-hidden="true" ng-if="$ctrl.state.orderBy === 'EndpointName' && !$ctrl.state.reverseOrder"></i> can-sort="true"
<i class="fa fa-sort-alpha-up" aria-hidden="true" ng-if="$ctrl.state.orderBy === 'EndpointName' && $ctrl.state.reverseOrder"></i> is-sorted="$ctrl.state.orderBy === 'EndpointName'"
</a> is-sorted-desc="$ctrl.state.orderBy === 'EndpointName' && $ctrl.state.reverseOrder"
ng-click="$ctrl.changeOrderBy('EndpointName')"
></table-column-header>
</th> </th>
<th> <th>
<a ng-click="$ctrl.changeOrderBy('RoleName')"> <table-column-header
Role col-title="'Role'"
<i class="fa fa-sort-alpha-down" aria-hidden="true" ng-if="$ctrl.state.orderBy === 'RoleName' && !$ctrl.state.reverseOrder"></i> can-sort="true"
<i class="fa fa-sort-alpha-up" aria-hidden="true" ng-if="$ctrl.state.orderBy === 'RoleName' && $ctrl.state.reverseOrder"></i> is-sorted="$ctrl.state.orderBy === 'RoleName'"
</a> is-sorted-desc="$ctrl.state.orderBy === 'RoleName' && $ctrl.state.reverseOrder"
ng-click="$ctrl.changeOrderBy('RoleName')"
></table-column-header>
</th> </th>
<th>Access origin</th> <th>Access origin</th>
</tr> </tr>

6
app/portainer/rbac/components/access-viewer/access-viewer.html
View File

@ -1,6 +1,6 @@
<div class="col-sm-12" style="margin-bottom: 0px"> <div class="col-sm-12" style="margin-bottom: 0px">
<rd-widget> <rd-widget>
<rd-widget-header icon="fa-user-lock"> <rd-widget-header icon="svg-userlock" feather-icon="true">
<header-title> <header-title>
Effective access viewer Effective access viewer
<be-feature-indicator feature="$ctrl.limitedFeature" class="space-left"></be-feature-indicator> <be-feature-indicator feature="$ctrl.limitedFeature" class="space-left"></be-feature-indicator>
@ -25,8 +25,8 @@
<div class="col-sm-12 form-section-title"> Access </div> <div class="col-sm-12 form-section-title"> Access </div>
<div> <div>
<div class="small text-muted" style="margin-bottom: 15px"> <div class="small text-muted vertical-center" style="margin-bottom: 15px">
<i class="fa fa-info-circle blue-icon space-right" aria-hidden="true"></i> <pr-icon icon="'info'" mode="'primary'" feather="true" size="'sm'" class="vertical-center"></pr-icon>
Effective role for each environment will be displayed for the selected user Effective role for each environment will be displayed for the selected user
</div> </div>
</div> </div>

32
app/portainer/rbac/components/roles-datatable/roles-datatable.html
View File

@ -2,13 +2,15 @@
<rd-widget> <rd-widget>
<rd-widget-body classes="no-padding"> <rd-widget-body classes="no-padding">
<div class="toolBar"> <div class="toolBar">
<div class="toolBarTitle"> <i class="fa" ng-class="$ctrl.titleIcon" aria-hidden="true" style="margin-right: 2px"></i> {{ $ctrl.titleText }} </div> <div class="toolBarTitle vertical-center">
<pr-icon icon="$ctrl.titleIcon" feather="true" class="vertical-center" class-name="'icon-white icon-primary icon-nested-blue'"></pr-icon>{{ $ctrl.titleText }}
</div>
</div> </div>
<div class="searchBar"> <div class="searchBar">
<i class="fa fa-search searchIcon" aria-hidden="true"></i> <pr-icon icon="'search'" class="vertical-center" feather="true"></pr-icon>
<input <input
type="text" type="text"
class="searchInput" class="searchInput ml-1"
ng-model="$ctrl.state.textFilter" ng-model="$ctrl.state.textFilter"
ng-change="$ctrl.onTextFilterChange()" ng-change="$ctrl.onTextFilterChange()"
placeholder="Search..." placeholder="Search..."
@ -21,18 +23,22 @@
<thead> <thead>
<tr> <tr>
<th> <th>
<a ng-click="$ctrl.changeOrderBy('Name')"> <table-column-header
Name col-title="'Name'"
<i class="fa fa-sort-alpha-down" aria-hidden="true" ng-if="$ctrl.state.orderBy === 'Name' && !$ctrl.state.reverseOrder"></i> can-sort="true"
<i class="fa fa-sort-alpha-up" aria-hidden="true" ng-if="$ctrl.state.orderBy === 'Name' && $ctrl.state.reverseOrder"></i> is-sorted="$ctrl.state.orderBy === 'Name'"
</a> is-sorted-desc="$ctrl.state.orderBy === 'Name' && $ctrl.state.reverseOrder"
ng-click="$ctrl.changeOrderBy('Name')"
></table-column-header>
</th> </th>
<th> <th>
<a ng-click="$ctrl.changeOrderBy('Description')"> <table-column-header
Description col-title="'Description'"
<i class="fa fa-sort-alpha-down" aria-hidden="true" ng-if="$ctrl.state.orderBy === 'Description' && !$ctrl.state.reverseOrder"></i> can-sort="true"
<i class="fa fa-sort-alpha-up" aria-hidden="true" ng-if="$ctrl.state.orderBy === 'Description' && $ctrl.state.reverseOrder"></i> is-sorted="$ctrl.state.orderBy === 'Description'"
</a> is-sorted-desc="$ctrl.state.orderBy === 'Description' && $ctrl.state.reverseOrder"
ng-click="$ctrl.changeOrderBy('Description')"
></table-column-header>
</th> </th>
<th class="be-visual-indicator-col"></th> <th class="be-visual-indicator-col"></th>
</tr> </tr>

2
app/portainer/rbac/views/roles/roles.html
View File

@ -2,7 +2,7 @@
<div class="row"> <div class="row">
<div class="col-sm-12"> <div class="col-sm-12">
<roles-datatable title-text="Roles" title-icon="fa-file-code" dataset="$ctrl.roles" table-key="roles"></roles-datatable> <roles-datatable title-text="Roles" title-icon="svg-filecode" dataset="$ctrl.roles" table-key="roles"></roles-datatable>
</div> </div>
</div> </div>