feat(text): add noMargin and align props

src/components/header-logo.js

@@ -84,7 +84,9 @@ export default function HeaderLogo({ transition }) {
         <Heading withShadow noMargin noWrap>
           Abc Project Design Ltd
         </Heading>
-        <Text size="lg">Easy as ABC</Text>
+        <Text size="lg" noMargin>
+          Easy as ABC
+        </Text>
       </Middle>
       <Bottom visible={visible}>
         <LogoArrows />

src/components/text.js

@@ -3,12 +3,17 @@ import styled from "@emotion/styled";
 import { css } from "@emotion/react";
 
 const StyledText = styled.p`
-  margin-bottom: var(--spacing-y-xs);
+  margin: ${props => (props.noMargin ? 0 : `0 0 var(--spacing-y-md)`)};
   ${props =>
     props.textStyle &&
     css`
       font-style: ${props.textStyle};
     `}
+  ${props =>
+    props.align &&
+    css`
+      text-align: ${props.align};
+    `}
   font-size: ${props => `var(--font-size-${props.size})`};
   color: ${props => `var(--theme-color-${props.color})`};
 `;