clear filter hover

main
Said Gedik 2024-05-14 18:04:02 +02:00
parent f30b6e9881
commit c2416ccfe5
2 changed files with 9 additions and 6 deletions

View File

@ -196,8 +196,7 @@
align-items: center; align-items: center;
justify-content: center; justify-content: center;
height: 70%; height: 70%;
background-color: rgba(255, 255, 255, 0.175);
background-color: rgb(255, 255, 255);
cursor: pointer; cursor: pointer;
padding-left: 15px; padding-left: 15px;
padding-right: 15px; padding-right: 15px;
@ -205,12 +204,15 @@
border-radius: 8px; border-radius: 8px;
font-weight: 500; font-weight: 500;
gap: 3px; gap: 3px;
transition: background-color 0.3s ease; /* Add this line for smooth transition */
} }
.clearFilter:hover { .clearFilter:hover {
background-color: #ff370016; background-color: rgba(255, 255, 255, 0.729);
} }
.filterButton:hover { .filterButton:hover {
background-color: rgb(240, 240, 240); background-color: rgb(240, 240, 240);
} }
@ -220,7 +222,7 @@
display: flex; display: flex;
flex-direction: row; flex-direction: row;
align-items: center; align-items: center;
background-color: #f5f5f5; background-color: rgba(245, 245, 245, 0.528); /* Semi-transparent background */
border: solid rgba(0, 0, 0, 0.1) 1px; border: solid rgba(0, 0, 0, 0.1) 1px;
border-bottom: none; border-bottom: none;
border-radius: 10px 10px 0px 0px; border-radius: 10px 10px 0px 0px;
@ -233,8 +235,10 @@
top: 0; top: 0;
z-index: 1000; /* Ensure it is above other content */ z-index: 1000; /* Ensure it is above other content */
border-bottom: 0.5px solid rgba(0, 0, 0, 0.1); border-bottom: 0.5px solid rgba(0, 0, 0, 0.1);
backdrop-filter: blur(2px); /* Blur effect */
} }
.filterContainer.sticky { .filterContainer.sticky {
border-radius: 0; border-radius: 0;
} }

View File

@ -64,8 +64,7 @@
{{languageService.lMap.get('nttGanttFilterButton')}} <mat-icon style="color: #00a79d;">filter_alt</mat-icon> {{languageService.lMap.get('nttGanttFilterButton')}} <mat-icon style="color: #00a79d;">filter_alt</mat-icon>
</button> </button>
<button [disabled]="!filterEnabled" aria-label="clear Filters and Sort" class="clearFilter" <button [disabled]="!filterEnabled" aria-label="clear Filters and Sort" class="clearFilter" (click)="clearFilter()">
style="background-color: transparent;" (click)="clearFilter()">
{{languageService.lMap.get('clearFilter')}} <mat-icon>close</mat-icon> {{languageService.lMap.get('clearFilter')}} <mat-icon>close</mat-icon>
</button> </button>