Merge branch 'develop' of https://github.com/aragon/govern into develop

aragon · Jul 7, 2021 · c53d1cf · c53d1cf
2 parents 8898b39 + e661f10
commit c53d1cf
Show file tree

Hide file tree

Showing 2 changed files with 27 additions and 1 deletion.
diff --git a/packages/govern-console/src/components/Header/Header.tsx b/packages/govern-console/src/components/Header/Header.tsx
@@ -1,7 +1,8 @@
 import governIcon from 'images/svgs/aragon-icon.svg';
 import Wallet from 'components/Wallet/Wallet';
+import { BetaLabel } from 'components/Labels/BetaLabel';
 import { useHistory } from 'react-router-dom';
-import { Button, StyledText, IconEdit, useLayout } from '@aragon/ui';
+import { Button, StyledText, IconEdit, useLayout, GU } from '@aragon/ui';
 import styled from 'styled-components';
 import { networkEnvironment } from 'environment';
 
@@ -16,6 +17,8 @@ const Title = styled.div`
   display: flex;
   width: fit-content;
   cursor: pointer;
+  align-items: center;
+  column-gap: ${GU}px;
 `;
 
 const RigtSideContainer = styled.div`
@@ -45,6 +48,7 @@ const Header = () => {
     <NavBar>
       <Title id="navbar_title" onClick={redirectToHomePage}>
         <img src={governIcon} width={layoutName !== 'small' ? '182px' : '162px'} />
+        <BetaLabel>Beta</BetaLabel>
       </Title>
       <RigtSideContainer id="account">
         {layoutName !== 'small' && (

diff --git a/packages/govern-console/src/components/Labels/BetaLabel.tsx b/packages/govern-console/src/components/Labels/BetaLabel.tsx
@@ -0,0 +1,22 @@
+import styled from 'styled-components';
+
+export const BetaLabel = styled.div`
+  display: flex;
+  flex-direction: row;
+  justify-content: center;
+  align-items: center;
+
+  width: 43px;
+  height: 19px;
+  left: calc(50% - 43px / 2 - 549.5px);
+  top: calc(50% - 19px / 2 - 750px);
+
+  font-family: Manrope;
+  font-size: 12px;
+  font-weight: 600;
+
+  border-radius: 40px;
+  color: white;
+  margin-top: 5px;
+  background: linear-gradient(107.79deg, #00c2ff, #01e8f7);
+`;