From 6255be0751037637d9a8882a0109a349ba82c778 Mon Sep 17 00:00:00 2001
From: RadoslavDimchev <RadoslavDimchev111@gmail.com>
Date: Tue, 9 Apr 2024 21:53:49 +0300
Subject: [PATCH] feat(management-tabs): responsive search and filters

---
 src/pages/ValidatorManagement/ManagementTabs.tsx | 15 ++++++++++++---
 1 file changed, 12 insertions(+), 3 deletions(-)

diff --git a/src/pages/ValidatorManagement/ManagementTabs.tsx b/src/pages/ValidatorManagement/ManagementTabs.tsx
index 082bf968..2cb7d095 100644
--- a/src/pages/ValidatorManagement/ManagementTabs.tsx
+++ b/src/pages/ValidatorManagement/ManagementTabs.tsx
@@ -1,5 +1,4 @@
 import { Tabs } from '@status-im/components'
-import { XStack } from 'tamagui'
 import { useEffect, useMemo, useState } from 'react'
 import { useDispatch, useSelector } from 'react-redux'
 
@@ -107,13 +106,23 @@ const ManagementTabs = () => {
               ))}
             </Tabs.List>
           </div>
-          <XStack space={'$3'} alignItems="center">
+          <div
+            className="transparent-scrollbar"
+            style={{
+              display: 'flex',
+              alignItems: 'center',
+              justifyContent: 'start',
+              gap: '8px',
+              overflowX: 'auto',
+              width: '100%',
+            }}
+          >
             <SearchManagement
               searchValue={searchValue}
               changeSearchValue={changeSearchValue}
             />
             <DropdownFilter />
-          </XStack>
+          </div>
         </div>
         {VALIDATOR_TABS_MANAGEMENT.map(tab => (
           <Tabs.Content key={tab} value={tab} style={{ marginTop: '8px' }}>