Style fix: add hover on dialog close button

This commit is contained in:
apapachristou 2020-11-12 10:39:41 +02:00
parent 7973e04090
commit 188fcd539f
5 changed files with 32 additions and 3 deletions

View File

@ -1,7 +1,7 @@
<div class="dataset-copy-dialog">
<div mat-dialog-title class="row d-flex flex-row">
<div mat-dialog-title class="col-auto">{{'DATASET-WIZARD.DIALOGUE.TITLE' | translate}}</div>
<div class="col-auto ml-auto close-btn" (click)="close()"><mat-icon>close</mat-icon></div>
<div class="col-auto ml-auto close-btn" (click)="close()"><mat-icon class="close-icon">close</mat-icon></div>
</div>
<div mat-dialog-content class="confirmation-message">
<mat-form-field class="col-12">

View File

@ -35,3 +35,16 @@
background-color: #129d99;
color: #ffffff;
}
.close-icon {
cursor: pointer;
// margin-right: 20px;
padding: .4rem;
width: auto !important;
height: auto !important;
}
.close-icon:hover {
background-color: #ECECED !important;
border-radius: 50%;
}

View File

@ -1,7 +1,9 @@
<div class="form-container">
<div class="row d-flex justify-content-between m-0">
<a class="logo"><img src="../../../assets/splash/assets/img/argos-logo.svg"></a>
<mat-icon class="close-icon" (click)="close()">close</mat-icon>
<div class="col-auto ml-auto close-btn" (click)="close()">
<mat-icon class="close-icon">close</mat-icon>
</div>
</div>
<div class="row content">
<h1 mat-dialog-title class="title">{{'NAV-BAR.START-NEW-DMP' | translate}}</h1>

View File

@ -4,7 +4,7 @@
{{'FAQ.TITLE' | translate}}
</div>
<div class="col-auto ml-auto close-btn" (click)="close()">
<mat-icon>close</mat-icon>
<mat-icon class="clear-icon">close</mat-icon>
</div>
</div>
<div mat-dialog-content class="row">

View File

@ -12,6 +12,20 @@
cursor: pointer;
}
.clear-icon {
cursor: pointer;
color: #212121;
padding: 0.4rem;
width: auto !important;
height: auto !important;
}
.clear-icon:hover {
background-color: #ececec !important;
border-radius: 50%;
padding: 0.4rem;
}
.faq {
margin-bottom: 1.125rem;
}