From c0d81d7ac145ce1bfe6402aec11d8142e50e366b Mon Sep 17 00:00:00 2001
From: kyranjamie <kyran.burraston@gmail.com>
Date: Wed, 6 Jan 2021 10:21:44 +0100
Subject: [PATCH] fix: title bar centre alignment, beta notice, closes #439

---
 app/components/beta-notice.tsx         | 22 ++++++++++++++--------
 app/components/title-bar/title-bar.tsx | 10 +++++++++-
 2 files changed, 23 insertions(+), 9 deletions(-)

diff --git a/app/components/beta-notice.tsx b/app/components/beta-notice.tsx
index 15673f8a1..290bfaee4 100644
--- a/app/components/beta-notice.tsx
+++ b/app/components/beta-notice.tsx
@@ -1,7 +1,8 @@
 import React, { FC } from 'react';
 import { Flex, Text } from '@blockstack/ui';
-import { openExternalLink } from '@utils/external-links';
 
+import { openExternalLink } from '@utils/external-links';
+import { NETWORK } from '@constants/index';
 import packageJson from '../../package.json';
 
 const sha = process.env.SHA;
@@ -12,12 +13,12 @@ const version = packageJson.version;
 
 const issueParams = new URLSearchParams();
 const issueTitle = `[${String(packageJson.version)}] Bug: <describe issue>`;
-const issueLabels = 'bug,reported-from-ui';
+const issueLabels = `bug,reported-from-ui,4.x,${NETWORK}`;
 const issueBody = `
 <!--
 
   Thanks for creating an issue. Please include as much detail as possible,
-  including screenshots, operating system, and steps to recreate.
+  including screenshots, operating system, and steps to recreate the problem.
 
   If you have any questions, ask @kyranjamie on Github, Discord and Twitter.
 
@@ -43,13 +44,18 @@ export const BetaNotice: FC = () => {
   return (
     <Flex
       textStyle="caption.medium"
+      fontSize="11px"
       color="ink.400"
       position="fixed"
-      right={0}
-      bottom="base"
-      flexDirection={['column', 'row']}
+      right="8px"
+      bottom="8px"
+      border="1px solid #F0F0F0"
+      borderRadius="24px"
+      bg="white"
+      py="4px"
+      px="base-tight"
     >
-      <Text mr="base-tight" onClick={openIssueLink} textDecoration="underline" cursor="pointer">
+      <Text mr="tight" onClick={openIssueLink} textDecoration="underline" cursor="pointer">
         Found a bug? Open an issue
       </Text>
       {pullRequest && branchName && (
@@ -76,7 +82,7 @@ export const BetaNotice: FC = () => {
           </Text>
         </Text>
       )}
-      <Text mr="base">[{packageJson.version}]</Text>
+      <Text>[{packageJson.version}]</Text>
     </Flex>
   );
 };
diff --git a/app/components/title-bar/title-bar.tsx b/app/components/title-bar/title-bar.tsx
index de0476471..7b28619e4 100644
--- a/app/components/title-bar/title-bar.tsx
+++ b/app/components/title-bar/title-bar.tsx
@@ -41,7 +41,15 @@ export const TitleBar: FC = () => {
       backgroundColor={winState === 'focused' ? 'white' : '#FAFAFC'}
     >
       <BackButton backUrl={backUrl} hasFocus={winState === 'focused'} onClick={handleHistoryBack} />
-      <Flex justifyContent="space-around" flex={1}>
+      <Flex
+        justifyContent="space-around"
+        flex={1}
+        // Manages absolute centre alignment of content
+        position={['relative', 'absolute']}
+        width={[null, '100%']}
+        left={[null, 0]}
+        height="100%"
+      >
         <Flex>
           {isNewerReleaseAvailable && latestRelease && (
             <UpdateAvailableButton