From dc60f3c97051ac87301999e4029ba57b93d201d1 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Tr=C3=A8sAbhi?= <43380238+tresabhi@users.noreply.github.com>
Date: Wed, 28 Aug 2024 17:38:23 -0500
Subject: [PATCH] feat: better branch label

---
 src/app/components/Hero/index.tsx | 17 ++++++++++-------
 src/components/Navbar/index.tsx   | 13 ++++++-------
 2 files changed, 16 insertions(+), 14 deletions(-)

diff --git a/src/app/components/Hero/index.tsx b/src/app/components/Hero/index.tsx
index d4115d096..a76b84f56 100644
--- a/src/app/components/Hero/index.tsx
+++ b/src/app/components/Hero/index.tsx
@@ -43,15 +43,18 @@ export function Hero() {
       >
         <Flex direction="column" align="center" gap="1">
           <Heading size="9" weight="bold" align="center">
-            BlitzKit
-            {isBranchNamed && (
-              <>
-                {' '}
-                <Code color="gray" highContrast variant="solid">
+            <Flex
+              align="center"
+              gap={{ initial: '1', xs: '4' }}
+              direction={{ initial: 'column', xs: 'row' }}
+            >
+              BlitzKit
+              {isBranchNamed && (
+                <Code size="8" color="gray" highContrast variant="outline">
                   {BRANCH_NAMES[process.env.NEXT_PUBLIC_ASSET_BRANCH!]}
                 </Code>
-              </>
-            )}
+              )}
+            </Flex>
           </Heading>
 
           {!isBranchNamed && (
diff --git a/src/components/Navbar/index.tsx b/src/components/Navbar/index.tsx
index 404486075..1b767cab5 100644
--- a/src/components/Navbar/index.tsx
+++ b/src/components/Navbar/index.tsx
@@ -78,15 +78,14 @@ export default function Navbar() {
                 weight="bold"
                 onClick={() => setShowHamburgerMenu(false)}
               >
-                BlitzKit
-                {isBranchNamed && (
-                  <>
-                    {' '}
-                    <Code color="gray" highContrast variant="solid">
+                <Flex align="center" gap="1">
+                  BlitzKit
+                  {isBranchNamed && (
+                    <Code color="gray" size="1" highContrast variant="outline">
                       {BRANCH_NAMES[process.env.NEXT_PUBLIC_ASSET_BRANCH!]}
                     </Code>
-                  </>
-                )}
+                  )}
+                </Flex>
               </Link>
             </Flex>