styling changes

*add-description popup and fixed dashboard button
This commit is contained in:
Sofia Papacharalampous 2024-03-21 13:57:26 +02:00
parent 0dbd652cf3
commit f1f67b9790
4 changed files with 18 additions and 16 deletions

View File

@ -42,7 +42,7 @@
<button type="button" class="col-auto align-self-center normal-btn" (click)="openNewDmpDialog()">{{'DASHBOARD.START-YOUR-FIRST-DMP' | translate}}</button> <button type="button" class="col-auto align-self-center normal-btn" (click)="openNewDmpDialog()">{{'DASHBOARD.START-YOUR-FIRST-DMP' | translate}}</button>
</div> </div>
<div *ngIf="this.hasDmps()" class="new-dataset-tour add-dataset-btn col-auto d-flex"> <div *ngIf="this.hasDmps()" class="new-dataset-tour add-dataset-btn col-auto d-flex">
<button mat-raised-button type="button" class="col-auto align-self-center yellow-btn" (click)="addNewDataset()">{{'DASHBOARD.ACTIONS.ADD-DESCRIPTION' | translate}}</button> <button mat-raised-button type="button" class="col-auto align-self-center yellow-btn" (click)="addNewDescription()">{{'DASHBOARD.ACTIONS.ADD-DESCRIPTION' | translate}}</button>
</div> </div>
<span class="col-auto ml-auto"> <span class="col-auto ml-auto">
<img class="laptop-img\6" src="../../../assets/images/dashboard-popup.png"> <img class="laptop-img\6" src="../../../assets/images/dashboard-popup.png">
@ -70,7 +70,7 @@
<app-recent-edited-description-activity (totalCountDatasets)="onCountDatasets($event)" [isActive]="currentType == 'descriptions'"></app-recent-edited-description-activity> <app-recent-edited-description-activity (totalCountDatasets)="onCountDatasets($event)" [isActive]="currentType == 'descriptions'"></app-recent-edited-description-activity>
<div *ngIf="totalDatasets === 0" class="empty-list">{{'DASHBOARD.EMPTY-LIST' | translate}}</div> <div *ngIf="totalDatasets === 0" class="empty-list">{{'DASHBOARD.EMPTY-LIST' | translate}}</div>
<div *ngIf="totalDatasets === 0" class="col-auto d-flex justify-content-center"> <div *ngIf="totalDatasets === 0" class="col-auto d-flex justify-content-center">
<button mat-raised-button class="add-dataset" (click)="addNewDataset()"> <button mat-raised-button class="add-dataset" (click)="addNewDescription()">
<mat-icon>add</mat-icon> {{'DASHBOARD.ACTIONS.ADD-DESCRIPTION' | translate}} <mat-icon>add</mat-icon> {{'DASHBOARD.ACTIONS.ADD-DESCRIPTION' | translate}}
</button> </button>
</div> </div>

View File

@ -352,8 +352,6 @@ input[type="text"] {
} }
.add-dataset { .add-dataset {
width: 142px;
height: 40px;
background: var(--secondary-color) 0% 0% no-repeat padding-box; background: var(--secondary-color) 0% 0% no-repeat padding-box;
box-shadow: 0px 3px 6px #1e202029; box-shadow: 0px 3px 6px #1e202029;
border-radius: 30px; border-radius: 30px;

View File

@ -1,11 +1,15 @@
<div class="form-container"> <div class="form-container">
<div mat-dialog-title class="pl-0 pr-0 row d-flex justify-content-between m-0"> <div mat-dialog-title class="row d-flex p-0 mb-4">
<span class="title">{{'DASHBOARD.SELECT-DMP' | translate}}</span> <div class="col p-0">
<mat-icon class="close-icon" (click)="close()">close</mat-icon> <span class="title">{{'DASHBOARD.SELECT-DMP' | translate}}</span>
</div>
<div class="col-auto p-0">
<mat-icon class="close-icon" (click)="close()">close</mat-icon>
</div>
</div> </div>
<div class="row content"> <div class="row mt-2 mb-4">
<div class="col dmp-form p-0"> <div class="col-12">
<mat-form-field> <mat-form-field class="w-100">
<app-single-auto-complete [required]="true" [formControl]="formGroup.get('dmpId')" placeholder="{{'START-NEW-DESCRIPTION-DIALOG.SELECT-DMP' | translate}}" [configuration]="dmpAutoCompleteConfiguration"></app-single-auto-complete> <app-single-auto-complete [required]="true" [formControl]="formGroup.get('dmpId')" placeholder="{{'START-NEW-DESCRIPTION-DIALOG.SELECT-DMP' | translate}}" [configuration]="dmpAutoCompleteConfiguration"></app-single-auto-complete>
</mat-form-field> </mat-form-field>
</div> </div>
@ -18,7 +22,7 @@
</mat-form-field> </mat-form-field>
</div> </div>
</div> </div>
<div class="row"> <div class="row mt-2">
<div class="col-auto pb-4"> <div class="col-auto pb-4">
<span>{{'DASHBOARD.ADD-NEW-DATASET.OPTIONS-NOT-ENOUGH' | translate}}</span>&nbsp;<span class="new-dmp" (click)="startNewDmp()">{{'DASHBOARD.ADD-NEW-DATASET.START-NEW-DMP' | translate}}</span> <span>{{'DASHBOARD.ADD-NEW-DATASET.OPTIONS-NOT-ENOUGH' | translate}}</span>&nbsp;<span class="new-dmp" (click)="startNewDmp()">{{'DASHBOARD.ADD-NEW-DATASET.START-NEW-DMP' | translate}}</span>
</div> </div>

View File

@ -5,7 +5,7 @@
.form-container { .form-container {
width: 33rem; width: 33rem;
min-height: 14rem; min-height: 14rem;
padding: 1.0rem; padding: 2.0rem;
} }
.logo { .logo {
@ -66,7 +66,7 @@ min-width: 101px;
border: 1px solid var(--primary-color); border: 1px solid var(--primary-color);
border-radius: 30px; border-radius: 30px;
opacity: 1; opacity: 1;
min-width: 101px; min-width: 101px;
height: 43px; height: 43px;
color: var(--primary-color); color: var(--primary-color);
font-weight: 500; font-weight: 500;
@ -101,10 +101,10 @@ min-width: 101px;
} }
::ng-deep .dmp-form .mat-form-field-appearance-outline .mat-form-field-outline { ::ng-deep .dmp-form .mat-form-field-appearance-outline .mat-form-field-outline {
background: #fafafa !important; // background: #fafafa !important;
} }
::ng-deep .dmp-form .mat-form-field-appearance-outline .mat-form-field-infix { ::ng-deep .dmp-form .mat-form-field-appearance-outline .mat-form-field-infix {
font-size: 1rem; // font-size: 1rem;
padding: 0.6em 0 1em 0 !important; // padding: 0.6em 0 1em 0 !important;
} }