From ba9303de1ec41eb420ac3de3d91e3a966d841b69 Mon Sep 17 00:00:00 2001
From: RadoslavDimchev <RadoslavDimchev111@gmail.com>
Date: Tue, 24 Oct 2023 06:37:23 +0300
Subject: [PATCH] feat: create exec client cards component

---
 .../ValidatorSetup/ExecClientCards.tsx        | 25 +++++++++++++++++++
 1 file changed, 25 insertions(+)
 create mode 100644 src/pages/ValidatorOnboarding/ValidatorSetup/ValidatorSetup/ExecClientCards.tsx

diff --git a/src/pages/ValidatorOnboarding/ValidatorSetup/ValidatorSetup/ExecClientCards.tsx b/src/pages/ValidatorOnboarding/ValidatorSetup/ValidatorSetup/ExecClientCards.tsx
new file mode 100644
index 00000000..4932bad2
--- /dev/null
+++ b/src/pages/ValidatorOnboarding/ValidatorSetup/ValidatorSetup/ExecClientCards.tsx
@@ -0,0 +1,25 @@
+import { Stack, XStack, YStack } from 'tamagui'
+import { Text } from '@status-im/components'
+
+import ExecClientCard from './ExecClientCard'
+import { DOCUMENTATION } from '../../../../constants'
+
+const ExecClientCards = () => {
+  return (
+    <YStack space={'$2'}>
+      <Stack style={{ marginTop: '15px', marginLeft: 0, marginBottom: '15px' }}>
+        <Text size={27}>Select Execution client</Text>
+      </Stack>
+      <XStack justifyContent={'space-between'}>
+        {DOCUMENTATION}
+        <ExecClientCard name={'Nethermind'} icon={'/icons/nethermind-circle.png'} />
+        <ExecClientCard name={'Besu'} icon={'/icons/hyperledger-besu-circle.png'} />
+        <ExecClientCard name={'Geth'} icon={'/icons/gethereum-mascot-circle.png'} />
+        <ExecClientCard name={'Erigon'} icon={'/icons/erigon-circle.png'} />
+        <ExecClientCard name={'Nimbus'} icon={'/icons/NimbusDisabled.svg'} isComingSoon={true} />
+      </XStack>
+    </YStack>
+  )
+}
+
+export default ExecClientCards