From 80e09355f0acc3008773c711f9be56e7eabecabc Mon Sep 17 00:00:00 2001
From: Fitrah Munir <fitrahmunir@outlook.com>
Date: Fri, 17 Nov 2023 19:20:37 +0000
Subject: [PATCH] fix(card): use primary when filter is active

Signed-off-by: Fitrah Munir <fitrahmunir@outlook.com>
---
 src/components/Controls.vue | 9 ++++++---
 1 file changed, 6 insertions(+), 3 deletions(-)

diff --git a/src/components/Controls.vue b/src/components/Controls.vue
index 5517df64e..c39c5ca28 100644
--- a/src/components/Controls.vue
+++ b/src/components/Controls.vue
@@ -90,7 +90,7 @@
 						<NcButton slot="trigger"
 							:title="t('deck', 'Apply filter')"
 							class="filter-button"
-							type="tertiary-no-background">
+							:type="isFilterActive ? 'primary' : 'tertiary'">
 							<template #icon>
 								<FilterIcon v-if="isFilterActive" :size="20" decorative />
 								<FilterOffIcon v-else :size="20" decorative />
@@ -509,8 +509,11 @@ export default {
 		width: 44px;
 		height: 44px;
 
-		&:hover, &:focus {
-			background-color: rgba(127,127,127,0.25) !important;
+		&[data-popper-shown] {
+			background-color: var(--color-background-hover);
+			&.button-vue--vue-primary {
+				background-color: var(--color-primary-element);
+			}
 		}
 	}
 </style>