From 1ce37d3b40dd722597bcdae1f953750bab4abfea Mon Sep 17 00:00:00 2001
From: Hristo Nedelkov <hristo.nedelkow@gmail.com>
Date: Thu, 31 Aug 2023 14:56:10 +0300
Subject: [PATCH] style: tweaks

---
 src/components/General/LinkWithArrow.tsx             | 12 ++++++++++--
 .../ValidatorSetup/ConsensusSelection.tsx            |  7 ++++---
 2 files changed, 14 insertions(+), 5 deletions(-)

diff --git a/src/components/General/LinkWithArrow.tsx b/src/components/General/LinkWithArrow.tsx
index 6f9dcce9..c547caea 100644
--- a/src/components/General/LinkWithArrow.tsx
+++ b/src/components/General/LinkWithArrow.tsx
@@ -8,9 +8,17 @@ type LinkWithArrowProps = {
   arrowLeft?: boolean
   arrowRight?: boolean
   style?: React.CSSProperties
+  textColor?: string
 }
 
-const LinkWithArrow = ({ text, to, arrowLeft, arrowRight, style }: LinkWithArrowProps) => {
+const LinkWithArrow = ({
+  text,
+  to,
+  arrowLeft,
+  arrowRight,
+  style,
+  textColor,
+}: LinkWithArrowProps) => {
   const navigate = useNavigate()
 
   const navigateHandler = () => {
@@ -29,7 +37,7 @@ const LinkWithArrow = ({ text, to, arrowLeft, arrowRight, style }: LinkWithArrow
       onClick={navigateHandler}
     >
       {arrowLeft && <ArrowLeftIcon size={20} color="#2A4CF4" />}
-      <Link style={{ color: '#2A4CF4', marginBottom: '2px' }} to={to}>
+      <Link style={{ color: textColor || '#2A4CF4', marginBottom: '2px' }} to={to}>
         {text}
       </Link>
       {arrowRight && <ArrowRightIcon size={20} color="#2A4CF4" />}
diff --git a/src/pages/ValidatorOnboarding/ValidatorSetup/ConsensusSelection.tsx b/src/pages/ValidatorOnboarding/ValidatorSetup/ConsensusSelection.tsx
index b3aa9752..db2658e8 100644
--- a/src/pages/ValidatorOnboarding/ValidatorSetup/ConsensusSelection.tsx
+++ b/src/pages/ValidatorOnboarding/ValidatorSetup/ConsensusSelection.tsx
@@ -50,16 +50,17 @@ const ConsensusSelection = () => {
 
       <XStack space={'$8'}>
         <ConsensusClientCard name={a[0].name} icon={a[0].icon} />
-        <YStack width={'67%'} space={'$2'}>
-          <Text size={19}>The resource efficient Ethereum Clients.</Text>
+        <YStack width={'67%'} space={'$4'}>
+          <Text size={27}>The resource efficient Ethereum Clients.</Text>
           <Text size={15}>
             Nimbus is a client implementation for both execution and consensus layers that strives
             to be as lightweight as possible in terms of resources used. This allows it to perform
             well on embedded systems, resource-restricted devices -- including Raspberry Pis -- and
             multi-purpose servers.
           </Text>
-          <Text size={15}>
+          <Text size={19} weight={'semibold'}>
             <LinkWithArrow
+              textColor="black"
               text="Nimbus Documentation"
               arrowRight={true}
               to="https://www.youtube.com/watch?v=dQw4w9WgXcQ"