From 71205098bd08ffcfe2c3528d13e3c20fab81e826 Mon Sep 17 00:00:00 2001
From: RadoslavDimchev <RadoslavDimchev111@gmail.com>
Date: Fri, 12 Apr 2024 17:04:11 +0300
Subject: [PATCH] feat(nimbus-logo): final style and navigation

---
 src/components/General/NimbusText.tsx |  6 ++++++
 src/components/Logos/NimbusLogo.tsx   | 11 ++++-------
 2 files changed, 10 insertions(+), 7 deletions(-)

diff --git a/src/components/General/NimbusText.tsx b/src/components/General/NimbusText.tsx
index d11e62c2..33237881 100644
--- a/src/components/General/NimbusText.tsx
+++ b/src/components/General/NimbusText.tsx
@@ -1,4 +1,8 @@
+import { useNavigate } from 'react-router-dom'
+
 const NimbusText = () => {
+  const navigate = useNavigate()
+
   return (
     <svg
       width="80"
@@ -6,6 +10,8 @@ const NimbusText = () => {
       viewBox="0 0 80 17"
       fill="none"
       xmlns="http://www.w3.org/2000/svg"
+      style={{ cursor: 'pointer', marginLeft: '1px' }}
+      onClick={() => navigate('/')}
     >
       <g id="Nimbus">
         <path
diff --git a/src/components/Logos/NimbusLogo.tsx b/src/components/Logos/NimbusLogo.tsx
index 1f3dc54a..29615d92 100644
--- a/src/components/Logos/NimbusLogo.tsx
+++ b/src/components/Logos/NimbusLogo.tsx
@@ -1,6 +1,5 @@
 import { Text } from '@status-im/components'
 import { XStack, YStack } from 'tamagui'
-import { Link } from 'react-router-dom'
 
 import NimbusLogoMark from './NimbusLogoMark'
 import NimbusText from '../General/NimbusText'
@@ -15,12 +14,10 @@ const NimbusLogo = ({ subtitle }: NimbusLogoProps) => {
     <XStack space={'$3'} className={subtitle ? '' : 'nimbus-logo'}>
       <NimbusLogoMark />
       <YStack style={{ paddingTop: '2px' }}>
-        <Link to="/" style={{ textDecoration: 'none', color: 'inherit' }}>
-          <XStack space={'$3'}>
-            <NimbusText />
-            {!subtitle && <BetaTag />}
-          </XStack>
-        </Link>
+        <XStack space={'$2'} alignItems="flex-end">
+          <NimbusText />
+          {!subtitle && <BetaTag />}
+        </XStack>
         <Text size={19} color="#647084">
           {subtitle}
         </Text>