From dfcbe5aa36ac4ed8c2bfbe89b20c6b847a0b3904 Mon Sep 17 00:00:00 2001
From: mchouliara <mchouliara@cite.gr>
Date: Mon, 14 Oct 2024 17:40:57 +0300
Subject: [PATCH] fix toggle button styling

---
 .../plan-blueprint-listing-filters.component.html   |  6 +++---
 .../plan-blueprint-listing-filters.component.scss   |  1 +
 .../listing/filtering/plan-filter.component.html    |  6 ++----
 frontend/src/styles.scss                            | 13 +++++++++++++
 4 files changed, 19 insertions(+), 7 deletions(-)

diff --git a/frontend/src/app/ui/admin/plan-blueprint/listing/filters/plan-blueprint-listing-filters.component.html b/frontend/src/app/ui/admin/plan-blueprint/listing/filters/plan-blueprint-listing-filters.component.html
index d21162ce8..de65b53c0 100644
--- a/frontend/src/app/ui/admin/plan-blueprint/listing/filters/plan-blueprint-listing-filters.component.html
+++ b/frontend/src/app/ui/admin/plan-blueprint/listing/filters/plan-blueprint-listing-filters.component.html
@@ -1,19 +1,19 @@
 <div class="d-flex align-items-center gap-1-rem">
 
-	<button mat-flat-button [matMenuTriggerFor]="filterMenu" #filterMenuTrigger="matMenuTrigger" (click)="updateFilters()" class="filter-button">
+	<button mat-button [matMenuTriggerFor]="filterMenu" #filterMenuTrigger="matMenuTrigger" (click)="updateFilters()" class="filter-button">
 		<mat-icon aria-hidden="false" [matBadgeHidden]="!appliedFilterCount" [matBadge]="appliedFilterCount" matBadgeColor="warn" matBadgeSize="small">filter_alt</mat-icon>
 		{{'COMMONS.LISTING-COMPONENT.SEARCH-FILTER-BTN' | translate}}
 	</button>
 
 
 	<mat-menu #filterMenu>
-		<div class="container-fluid" [class.accessibility-theme]="accessibilityTheme()" (click)="$event?.stopPropagation?.()">
+		<div class="container-fluid pt-2 pb-2" [class.accessibility-theme]="accessibilityTheme()" (click)="$event?.stopPropagation?.()">
 			<div class="row justify-content-between">
 				<div class="col-auto mt-2">
 					<h4>{{'PLAN-BLUEPRINT-LISTING.FILTER.TITLE' | translate}}</h4>
 				</div>
 				<div class="col-auto">
-					<button color="accent" mat-button (click)="clearFilters()">
+					<button mat-button (click)="clearFilters()">
 						{{'COMMONS.LISTING-COMPONENT.CLEAR-ALL-FILTERS' | translate}}
 					</button>
 				</div>
diff --git a/frontend/src/app/ui/admin/plan-blueprint/listing/filters/plan-blueprint-listing-filters.component.scss b/frontend/src/app/ui/admin/plan-blueprint/listing/filters/plan-blueprint-listing-filters.component.scss
index 92f62796d..ec3501cdd 100644
--- a/frontend/src/app/ui/admin/plan-blueprint/listing/filters/plan-blueprint-listing-filters.component.scss
+++ b/frontend/src/app/ui/admin/plan-blueprint/listing/filters/plan-blueprint-listing-filters.component.scss
@@ -15,6 +15,7 @@
 .filter-button{
 	padding-top: .6rem;
 	padding-bottom: .6rem;
+    color: #000000;
 }
 
 ::ng-deep .mdc-form-field {
diff --git a/frontend/src/app/ui/plan/listing/filtering/plan-filter.component.html b/frontend/src/app/ui/plan/listing/filtering/plan-filter.component.html
index ef4553a42..bf8dd3112 100644
--- a/frontend/src/app/ui/plan/listing/filtering/plan-filter.component.html
+++ b/frontend/src/app/ui/plan/listing/filtering/plan-filter.component.html
@@ -92,12 +92,10 @@
 
 				<div class="col-10">
 					<div class="row align-items-center">
-						<button mat-icon-button color="primary" [disabled]="false" (click)="addReferenceType()">
+						<button mat-button color="primary" [disabled]="false" (click)="addReferenceType()">
 							<mat-icon>add_circle</mat-icon>
+                            <span class="mt-1">{{'DESCRIPTION-LISTING.ACTIONS.ADD-REFERENCE-TYPE' | translate}}</span>
 						</button>
-						<span>
-							<span class="mt-1">{{'DESCRIPTION-LISTING.ACTIONS.ADD-REFERENCE-TYPE' | translate}}</span>
-						</span>
 					</div>
 				</div>
 			</div>
diff --git a/frontend/src/styles.scss b/frontend/src/styles.scss
index 46dceac18..313f5c86a 100644
--- a/frontend/src/styles.scss
+++ b/frontend/src/styles.scss
@@ -110,6 +110,9 @@
 
 @import './material-theme.scss';
 
+.mat-mdc-menu-panel{
+    background-color: #ffffff !important;
+}
 //m3 styles overwrites
 .mat-mdc-mini-fab {
     border-radius: 50% !important;
@@ -133,6 +136,16 @@
 .mat-divider:not(.mat-divider-vertical){
     border-top-color: rgba(0, 0, 0, .12) !important;
 }
+.mdc-switch.mdc-switch--checked{
+    .mdc-switch__handle {
+        .mdc-switch__shadow{
+            background-color: var(--sys-on-tertiary-fixed-variant);
+        }
+        .mdc-switch__icon--on{
+            fill: var(--sys-tertiary);
+        }
+    }
+}
 // $mat-accessibility-theme: mat.m2-define-light-theme((color: (primary: $mat-theme-primary,
 //         accent: $mat-theme-accent,
 //         warn: $mat-theme-warn),