diff --git a/src/pages/ValidatorManagement/ManagementTabs.tsx b/src/pages/ValidatorManagement/ManagementTabs.tsx index b0fac356..8d4e043a 100644 --- a/src/pages/ValidatorManagement/ManagementTabs.tsx +++ b/src/pages/ValidatorManagement/ManagementTabs.tsx @@ -1,5 +1,5 @@ import { Tabs } from '@status-im/components' -import { Stack, XStack } from 'tamagui' +import { XStack } from 'tamagui' import { useEffect, useMemo, useState } from 'react' import { useDispatch, useSelector } from 'react-redux' @@ -8,6 +8,7 @@ import ManagementTable from './ManagementTable/ManagementTable' import SearchManagement from './ManagementTable/SearchManagement' import DropdownFilter from './ManagementTable/DropdownFilter' import { RootState } from '../../redux/store' +import styles from './validatorManagement.module.css' export type Validator = { name: string @@ -87,37 +88,29 @@ const ManagementTabs = () => { defaultValue={VALIDATOR_TABS_MANAGEMENT[0]} onValueChange={changeCurrentTabHandler} > -
- +
- - - {VALIDATOR_TABS_MANAGEMENT.map(tab => ( - - {`${currentTab === tab ? filteredValidators.length.toString() : ''} ${tab}`} - - ))} - - - - - - + + {VALIDATOR_TABS_MANAGEMENT.map(tab => ( + + {`${currentTab === tab ? filteredValidators.length.toString() : ''} ${tab}`} + + ))} + +
+ + +
{VALIDATOR_TABS_MANAGEMENT.map(tab => ( diff --git a/src/pages/ValidatorManagement/validatorManagement.module.css b/src/pages/ValidatorManagement/validatorManagement.module.css index 6ea6a853..5839a3bb 100644 --- a/src/pages/ValidatorManagement/validatorManagement.module.css +++ b/src/pages/ValidatorManagement/validatorManagement.module.css @@ -16,6 +16,18 @@ } } +.tabs-settings-container { + display: flex; + gap: 16px; + justify-content: space-between; + align-items: center; + border-top-left-radius: 16px; + border-top-right-radius: 16px; + border-bottom: 1px solid #e7eaee; + background-color: #fafbfc; + padding: 8px 16px; +} + @media (max-width: 600px) { .tabs { overflow-x: auto;