styling changes on add-account dialog

This commit is contained in:
Sofia Papacharalampous 2024-05-13 16:06:27 +03:00
parent 953f59aeb3
commit 40396f5937
3 changed files with 29 additions and 19 deletions

View File

@ -1,27 +1,37 @@
<div class="template-container"> <div class="template-container">
<div mat-dialog-title class="row d-flex mb-4"> <div mat-dialog-title class="mb-3">
<div class="col p-0"> <div class="row">
<span class="title">{{'USER-PROFILE.ACTIONS.LINK-NEW-ACCOUNT' | translate}}</span> <div class="col">
</div> <span class="title">{{'USER-PROFILE.ACTIONS.LINK-NEW-ACCOUNT' | translate}}</span>
<div class="col-auto p-0"> </div>
<mat-icon class="close-icon" (click)="closeDialog()">close</mat-icon> <div class="col-auto">
<mat-icon class="close-icon" (click)="closeDialog()">close</mat-icon>
</div>
</div> </div>
</div> </div>
<!-- <app-login *ngIf="hasEmail" [mergeUsers]="true" redirect="false"></app-login> --> <!-- <app-login *ngIf="hasEmail" [mergeUsers]="true" redirect="false"></app-login> -->
<!-- <div *ngIf="!hasEmail"> --> <!-- <div *ngIf="!hasEmail"> -->
<div class="row mt-2 mb-4"> <div mat-dialog-content class="mb-3">
<div class="col-12"> <div class="row mt-2 mb-4">
<mat-form-field class="w-100"> <div class="col-12">
<input required matInput [formControl]="form.get('email')" placeholder="{{'USER-PROFILE.SETTINGS.YOUR-EMAIL' | translate}}"> <mat-form-field class="w-100">
</mat-form-field> <input required matInput [formControl]="form.get('email')" placeholder="{{'USER-PROFILE.SETTINGS.YOUR-EMAIL' | translate}}">
</mat-form-field>
</div>
</div> </div>
</div> </div>
<div class="row justify-content-end">
<div class="col-auto"> <div mat-dialog-actions class="mb-2">
<button mat-raised-button type="button" class="cancel-btn ml-auto" (click)="cancel()">{{'USER-PROFILE.ACTIONS.CANCEL' | translate}}</button> <div class="container-fluid">
</div> <div class="row justify-content-center">
<div class="col-auto"> <div class="col-xl"></div>
<button mat-raised-button type="button" class="add-btn ml-4" (click)="add()" [disabled]="!form.valid">{{'USER-PROFILE.ACTIONS.ADD' | translate}}</button> <div class="col-auto">
<button mat-raised-button type="button" class="cancel-btn ml-auto" (click)="cancel()">{{'USER-PROFILE.ACTIONS.CANCEL' | translate}}</button>
</div>
<div class="col-auto">
<button mat-raised-button type="button" class="add-btn" (click)="add()" [disabled]="!form.valid">{{'USER-PROFILE.ACTIONS.ADD' | translate}}</button>
</div>
</div>
</div> </div>
</div> </div>
</div> </div>

View File

@ -1,5 +1,4 @@
.template-container { .template-container {
padding: 2.0rem;
.header { .header {
display: flex; display: flex;
@ -23,7 +22,6 @@
.close-icon { .close-icon {
cursor: pointer; cursor: pointer;
margin-right: 20px;
} }
.close-icon:hover { .close-icon:hover {

View File

@ -362,6 +362,8 @@ export class UserProfileComponent extends BaseComponent implements OnInit, OnDes
autoFocus: false, autoFocus: false,
// width: '653px', // width: '653px',
// maxHeight: '90vh', // maxHeight: '90vh',
width: '30%',
minWidth: 'fit-content',
data: { data: {
email: '' email: ''
} }