From 24ae9859d83eb5bf5cd696595e08193f6f0df696 Mon Sep 17 00:00:00 2001
From: lorenzo venneri <lorenzo.venneri@smc.it>
Date: Mon, 9 Oct 2023 13:53:48 +0200
Subject: [PATCH] Issue #631: fix style active filters

---
 .../src/components/ActiveFilters.tsx          | 45 +++++++++----------
 1 file changed, 21 insertions(+), 24 deletions(-)

diff --git a/js-packages/search-frontend/src/components/ActiveFilters.tsx b/js-packages/search-frontend/src/components/ActiveFilters.tsx
index 535d5fdf5..d6021f8f6 100644
--- a/js-packages/search-frontend/src/components/ActiveFilters.tsx
+++ b/js-packages/search-frontend/src/components/ActiveFilters.tsx
@@ -38,7 +38,6 @@ export function ActiveFilter({
         css={css`
           display: flex;
           justify-content: space-between;
-          width: 100%;
           position: absolute;
         `}
       >
@@ -91,30 +90,28 @@ export function ActiveFilter({
             );
           })}
         </div>
-
         {searchQuery.length !== 0 && (
-          <button
-            className="openk9-active-filter"
-            css={css`
-              border: none;
-              background: inherit;
-              padding: 3px 12px;
-              border-radius: 50px;
-              text-decoration: underline;
-              line-height: 24px;
-              display: flex;
-              align-items: center;
-              gap: 10px;
-              white-space: nowrap;
-              cursor: pointer;
-              @media (max-width: 480px) {
-                display: none;
-              }
-            `}
-            onClick={() => onConfigurationChange({ filterTokens: [] })}
-          >
-            {t("remove-filters")}
-          </button>
+          <div>
+            <button
+              className="openk9-active-filter"
+              css={css`
+                border: none;
+                background: inherit;
+                padding: 3px 12px;
+                border-radius: 50px;
+                text-decoration: underline;
+                line-height: 24px;
+                display: flex;
+                align-items: center;
+                gap: 10px;
+                white-space: nowrap;
+                cursor: pointer;
+              `}
+              onClick={() => onConfigurationChange({ filterTokens: [] })}
+            >
+              {t("remove-filters")}
+            </button>
+          </div>
         )}
       </div>
     </OverlayScrollbarsComponentDockerFix>