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

View File

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

View File

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