diff --git a/public/icons/ghost.png b/public/icons/ghost.png new file mode 100644 index 00000000..6c6e56e3 Binary files /dev/null and b/public/icons/ghost.png differ diff --git a/public/icons/pacman.png b/public/icons/pacman.png new file mode 100644 index 00000000..cfb6d5d0 Binary files /dev/null and b/public/icons/pacman.png differ diff --git a/public/icons/rubiks cube.png b/public/icons/rubiks cube.png new file mode 100644 index 00000000..61b400cd Binary files /dev/null and b/public/icons/rubiks cube.png differ diff --git a/public/icons/toaster.png b/public/icons/toaster.png new file mode 100644 index 00000000..40e2a43a Binary files /dev/null and b/public/icons/toaster.png differ diff --git a/src/pages/ValidatorManagement/ManageValidator/ManageValidator.tsx b/src/pages/ValidatorManagement/ManageValidator/ManageValidator.tsx index d0678c20..d3408ba8 100644 --- a/src/pages/ValidatorManagement/ManageValidator/ManageValidator.tsx +++ b/src/pages/ValidatorManagement/ManageValidator/ManageValidator.tsx @@ -7,7 +7,6 @@ import ValidatorInfo from './ValidatorInfo' import DepositStatus from './DepositStatus' import Header from './Header' import ValidatorBalance from './ValidatorBalance' -import ValidatorToolsCards from './ValidatorToolsCards' import ValidatorDataCards from './ValidatorDataCards' import ValidatorDataTabs from './ManageValidatorTable/ValidatorDataTabs' import ValidatorGraffiti from './ValidatorGraffiti' @@ -36,7 +35,7 @@ const ManageValidator = () => { - + diff --git a/src/pages/ValidatorManagement/ManageValidator/ValidatorSeettingsCards.tsx b/src/pages/ValidatorManagement/ManageValidator/ValidatorSeettingsCards.tsx index 6a3f2e62..07cef687 100644 --- a/src/pages/ValidatorManagement/ManageValidator/ValidatorSeettingsCards.tsx +++ b/src/pages/ValidatorManagement/ManageValidator/ValidatorSeettingsCards.tsx @@ -1,16 +1,12 @@ import { Stack } from 'tamagui' import ValidatorSettingCard from './ValidatorSettingCard' -type IconKey = - | 'Exit Validator' - | 'Migrate Validator' - | 'Top up Validator' - | 'Advanced' +type IconKey = 'Exit Validator' | 'Migrate Validator' | 'Advanced' const cardTitles: IconKey[] = [ 'Exit Validator', 'Migrate Validator', - 'Top up Validator', + 'Advanced', ] const ValidatorSettingsCards = () => { @@ -19,10 +15,10 @@ const ValidatorSettingsCards = () => { style={{ display: 'flex', flexDirection: 'row', - flexWrap: 'wrap', - gap: '1vw', width: '100%', - padding: '0 30px', + alignContent: 'center', + alignItems: 'center', + justifyContent: 'space-evenly', }} > {cardTitles.map(title => ( diff --git a/src/pages/ValidatorManagement/ManageValidator/ValidatorSettingCard.tsx b/src/pages/ValidatorManagement/ManageValidator/ValidatorSettingCard.tsx index 764673af..17e1c655 100644 --- a/src/pages/ValidatorManagement/ManageValidator/ValidatorSettingCard.tsx +++ b/src/pages/ValidatorManagement/ManageValidator/ValidatorSettingCard.tsx @@ -1,16 +1,7 @@ import { Text } from '@status-im/components' -import { - AddIcon, - DisconnectIcon, - AdvancedIcon, - ExternalIcon, -} from '@status-im/icons' -import { Stack, XStack } from 'tamagui' -type IconKey = - | 'Exit Validator' - | 'Migrate Validator' - | 'Top up Validator' - | 'Advanced' +import { DisconnectIcon, AdvancedIcon, ExternalIcon } from '@status-im/icons' +import { Stack, XStack, YStack } from 'tamagui' +type IconKey = 'Exit Validator' | 'Migrate Validator' | 'Advanced' type ValidatorSettingCardProps = { title: IconKey @@ -18,55 +9,27 @@ type ValidatorSettingCardProps = { const ValidatorSettingCard = ({ title }: ValidatorSettingCardProps) => { const getIcon = { - 'Exit Validator': () => ( - - ), - 'Migrate Validator': () => ( - - ), - 'Top up Validator': () => ( - - ), - Advanced: () => ( - - ), + 'Exit Validator': () => , + 'Migrate Validator': () => , + + Advanced: () => , } return ( - - - - {title} - - {getIcon[title]()} - - + + + {getIcon[title]()} + + + {title} + + ) }