Fix some styling issues with users listing
This commit is contained in:
parent
c62cc1068a
commit
b5a9aa9ad3
|
@ -25,7 +25,7 @@
|
||||||
display: flex;
|
display: flex;
|
||||||
justify-content: center;
|
justify-content: center;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
width: 67px;
|
min-width: 67px;
|
||||||
height: 28px;
|
height: 28px;
|
||||||
color: #00c4ff;
|
color: #00c4ff;
|
||||||
background: #d3f5ff 0% 0% no-repeat padding-box;
|
background: #d3f5ff 0% 0% no-repeat padding-box;
|
||||||
|
@ -35,13 +35,15 @@
|
||||||
opacity: 1;
|
opacity: 1;
|
||||||
margin-top: 0.5em;
|
margin-top: 0.5em;
|
||||||
margin-bottom: 0.5em;
|
margin-bottom: 0.5em;
|
||||||
|
padding-left: 10px;
|
||||||
|
padding-right: 10px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.manager {
|
.manager {
|
||||||
display: flex;
|
display: flex;
|
||||||
justify-content: center;
|
justify-content: center;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
width: 90px;
|
min-width: 90px;
|
||||||
height: 28px;
|
height: 28px;
|
||||||
color: #568b5a;
|
color: #568b5a;
|
||||||
background: #9dd1a1 0% 0% no-repeat padding-box;
|
background: #9dd1a1 0% 0% no-repeat padding-box;
|
||||||
|
@ -51,13 +53,15 @@
|
||||||
opacity: 1;
|
opacity: 1;
|
||||||
margin-top: 0.5em;
|
margin-top: 0.5em;
|
||||||
margin-bottom: 0.5em;
|
margin-bottom: 0.5em;
|
||||||
|
padding-left: 10px;
|
||||||
|
padding-right: 10px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.admin {
|
.admin {
|
||||||
display: flex;
|
display: flex;
|
||||||
justify-content: center;
|
justify-content: center;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
width: 77px;
|
min-width: 77px;
|
||||||
height: 28px;
|
height: 28px;
|
||||||
color: #ff3d33;
|
color: #ff3d33;
|
||||||
background: #ffd5d3 0% 0% no-repeat padding-box;
|
background: #ffd5d3 0% 0% no-repeat padding-box;
|
||||||
|
@ -67,6 +71,8 @@
|
||||||
opacity: 1;
|
opacity: 1;
|
||||||
margin-top: 0.5em;
|
margin-top: 0.5em;
|
||||||
margin-bottom: 0.5em;
|
margin-bottom: 0.5em;
|
||||||
|
padding-left: 10px;
|
||||||
|
padding-right: 10px;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -15,7 +15,7 @@
|
||||||
<ng-container cdkColumnDef="avatar">
|
<ng-container cdkColumnDef="avatar">
|
||||||
<mat-header-cell *matHeaderCellDef></mat-header-cell>
|
<mat-header-cell *matHeaderCellDef></mat-header-cell>
|
||||||
<mat-cell *matCellDef="let row">
|
<mat-cell *matCellDef="let row">
|
||||||
<img mat-card-avatar *ngIf="row.avatarUrl" class="my-mat-card-avatar" [src]="row.avatarUrl">
|
<img mat-card-avatar *ngIf="row.avatarUrl" class="my-mat-card-avatar" [src]="row.avatarUrl" (error)="this.setDefaultAvatar($event)">
|
||||||
<img mat-card-avatar *ngIf="!row.avatarUrl" class="my-mat-card-avatar" [src]="'assets/images/profile-placeholder.png'">
|
<img mat-card-avatar *ngIf="!row.avatarUrl" class="my-mat-card-avatar" [src]="'assets/images/profile-placeholder.png'">
|
||||||
</mat-cell>
|
</mat-cell>
|
||||||
</ng-container>
|
</ng-container>
|
||||||
|
|
|
@ -182,6 +182,10 @@ export class UserListingComponent extends BaseComponent implements OnInit, After
|
||||||
return filename;
|
return filename;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
public setDefaultAvatar(ev: Event) {
|
||||||
|
(ev.target as HTMLImageElement).src = 'assets/images/profile-placeholder.png';
|
||||||
|
}
|
||||||
|
|
||||||
// public principalHasAvatar(): boolean {
|
// public principalHasAvatar(): boolean {
|
||||||
// return this.authentication.current().avatarUrl != null && this.authentication.current().avatarUrl.length > 0;
|
// return this.authentication.current().avatarUrl != null && this.authentication.current().avatarUrl.length > 0;
|
||||||
// }
|
// }
|
||||||
|
|
Loading…
Reference in New Issue