feat(nimbus-and-title-logos): use new nimbus text

src/components/General/TitleLogo.tsx

@@ -1,6 +1,8 @@
 import { Avatar, Text } from '@status-im/components'
-import { Stack, XStack, YStack } from 'tamagui'
+import { XStack, YStack } from 'tamagui'
+
 import NimbusLogoMark from '../Logos/NimbusLogoMark'
+import NimbusText from './NimbusText'
 
 type TitleLogoProps = {
   subtitle?: string
@@ -9,18 +11,16 @@ type TitleLogoProps = {
 const TitleLogo = ({ subtitle }: TitleLogoProps) => {
   return (
     <XStack space={'$2'}>
-      <Stack style={{ marginTop: '3px' }}>
-        <Avatar
-          type="icon"
-          size={48}
-          backgroundColor="white"
-          icon={<NimbusLogoMark />}
-        />
-      </Stack>
+      <Avatar
+        type="icon"
+        size={48}
+        backgroundColor="white"
+        icon={<NimbusLogoMark />}
+      />
       <YStack>
-        <Text size={27} color="#09101C" weight={'semibold'}>
-          Nimbus
-        </Text>
+        <div style={{ display: 'flex', alignItems: 'center' }}>
+          <NimbusText />
+        </div>
         <Text size={19} color="#647084">
           {subtitle}
         </Text>

src/components/Logos/NimbusLogo.css

@@ -5,5 +5,5 @@
 }
 .nimbus-logomark svg {
   width: auto;
-  height: 20px;
+  height: 21px;
 }

src/components/Logos/NimbusLogo.tsx

@@ -2,6 +2,7 @@ import { XStack } from 'tamagui'
 
 import BetaTag from './BetaTag'
 import NimbusLogoMark from './NimbusLogoMark'
+import NimbusText from '../General/NimbusText'
 import './NimbusLogo.css'
 
 const NimbusLogo = () => {
@@ -15,7 +16,7 @@ const NimbusLogo = () => {
       space={'$3'}
     >
       <NimbusLogoMark />
-      <img src={'./icons/nimbus.svg'} alt="marks" />
+      <NimbusText />
       <BetaTag />
     </XStack>
   )