fix(console): project role ui optimization, disable resend init mail btn for reader (#2615)

* fix: new role button alignment

* disable init mail btn

* stylelint
This commit is contained in:
Max Peintner 2021-11-09 12:21:40 +01:00 committed by GitHub
parent b1ef990785
commit 659d1b1252
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 55 additions and 44 deletions

View File

@ -1,41 +1,45 @@
<div class="container">
<div class="abort-container">
<button (click)="close()" mat-icon-button>
<mat-icon>close</mat-icon>
<div class="abort-container">
<button (click)="close()" mat-icon-button>
<mat-icon>close</mat-icon>
</button>
<span class="abort">{{ 'PROJECT.ROLE.ADDTITLE' | translate }}</span><span class="abort-2">Step
{{ currentCreateStep }} of
{{ createSteps }}</span>
</div>
<h1>{{'PROJECT.ROLE.ADDDESCRIPTION' | translate}}</h1>
<form @list (ngSubmit)="addRole()">
<div @animate *ngFor="let formGroup of formArray.controls; index as i" class="newrole-content">
<ng-container [formGroup]="$any(formGroup)">
<div class="newrole">
<cnsl-form-field class="formfield">
<cnsl-label>{{ 'PROJECT.ROLE.KEY' | translate }}</cnsl-label>
<input cnslInput formControlName="key" />
</cnsl-form-field>
<cnsl-form-field class="formfield">
<cnsl-label>{{ 'PROJECT.ROLE.DISPLAY_NAME' | translate }}</cnsl-label>
<input cnslInput formControlName="displayName" />
</cnsl-form-field>
<cnsl-form-field class="formfield">
<cnsl-label>{{ 'PROJECT.ROLE.GROUP' | translate }}</cnsl-label>
<input cnslInput formControlName="group" />
</cnsl-form-field>
</div>
<button *ngIf="i !== 0" mat-icon-button (click)="removeEntry(i)" type="button" color="warn"
matTooltip="{{ 'ACTIONS.REMOVE' | translate }}">
<i class="las la-trash"></i>
</button>
<span class="abort">{{ 'PROJECT.ROLE.ADDTITLE' | translate }}</span><span class="abort-2">Step
{{ currentCreateStep }} of
{{ createSteps }}</span>
</ng-container>
</div>
<h1>{{'PROJECT.ROLE.ADDDESCRIPTION' | translate}}</h1>
<button class="add-line-btn" color="primary" type="button" mat-stroked-button (click)="addEntry()">
{{'PROJECT.ROLE.ADDNEWLINE' | translate}}
{{'PROJECT.ROLE.ADDNEWLINE' | translate}}
</button>
<form @list (ngSubmit)="addRole()">
<div @animate *ngFor="let formGroup of formArray.controls; index as i" class="content">
<ng-container [formGroup]="$any(formGroup)">
<cnsl-form-field appearance="outline" class="formfield">
<cnsl-label>{{ 'PROJECT.ROLE.KEY' | translate }}</cnsl-label>
<input cnslInput formControlName="key" />
</cnsl-form-field>
<cnsl-form-field appearance="outline" class="formfield">
<cnsl-label>{{ 'PROJECT.ROLE.DISPLAY_NAME' | translate }}</cnsl-label>
<input cnslInput formControlName="displayName" />
</cnsl-form-field>
<cnsl-form-field appearance="outline" class="formfield">
<cnsl-label>{{ 'PROJECT.ROLE.GROUP' | translate }}</cnsl-label>
<input cnslInput formControlName="group" />
</cnsl-form-field>
<button *ngIf="i !== 0" mat-icon-button (click)="removeEntry(i)" type="button" color="warn"
matTooltip="{{ 'ACTIONS.REMOVE' | translate }}">
<i class="las la-trash"></i>
</button>
</ng-container>
</div>
<button color="primary" mat-raised-button class="continue-button" [disabled]="formArray.invalid" type="submit">
{{ 'ACTIONS.SAVE' | translate }}
</button>
</form>
<button color="primary" mat-raised-button class="continue-button" [disabled]="formArray.invalid" type="submit">
{{ 'ACTIONS.SAVE' | translate }}
</button>
</form>
</div>

View File

@ -1,4 +1,3 @@
.container {
padding: 4rem 4rem 2rem 4rem;
@ -29,21 +28,28 @@
}
}
.content {
.newrole-content {
padding-top: 1rem;
padding-bottom: 1rem;
display: flex;
margin: 0 -.5rem;
flex-wrap: wrap;
border-bottom: 1px solid #ffffff20;
margin-bottom: 1rem;
display: flex;
.formfield {
margin: 0 .5rem;
.newrole {
display: grid;
grid-template-columns: 1fr;
flex: 1;
@media only screen and (max-width: 450px) {
flex-basis: 100%;
@media only screen and (min-width: 1000px) {
grid-template-columns: 1fr 1fr 1fr;
grid-gap: 1rem;
}
}
button {
align-self: flex-end;
margin-bottom: 1rem;
}
}
.continue-button {

View File

@ -65,8 +65,9 @@
<button pwdAction [disabled]="(canWrite$ | async) === false" (click)="sendSetPasswordNotification()"
mat-stroked-button color="primary" *ngIf="user.state === UserState.USER_STATE_INITIAL">{{
'USER.PASSWORD.RESENDNOTIFICATION' | translate }}</button>
<button emailAction class="resendemail" *ngIf="user.state === UserState.USER_STATE_INITIAL" mat-stroked-button
color="primary" (click)="resendInitEmail()">{{'USER.RESENDINITIALEMAIL' |
<button emailAction [disabled]="(canWrite$ | async) === false" class="resendemail"
*ngIf="user.state === UserState.USER_STATE_INITIAL" mat-stroked-button color="primary"
(click)="resendInitEmail()">{{'USER.RESENDINITIALEMAIL' |
translate}}</button>
</cnsl-contact>
</cnsl-card>