1 files changed, 12 insertions, 3 deletions
diff --git a/packages/website/ts/@next/components/button.tsx b/packages/website/ts/@next/components/button.tsx
index bbb6b7935..e67f8a8e1 100644
--- a/packages/website/ts/@next/components/button.tsx
+++ b/packages/website/ts/@next/components/button.tsx
@@ -5,15 +5,20 @@ import { colors } from 'ts/style/colors';
 
 export interface ButtonInterface {
     text: string;
+    transparent?: any;
 }
 
-const StyledButton = styled.button`
+const StyledButton = styled.button<ButtonInterface>`
     appearance: none;
     border: 0;
     background-color: ${colors.brandLight};
     color: ${colors.white};
     text-align: center;
     padding: 13px 22px 14px;
+
+    ${props => props.transparent && `
+        border: 1px solid #6A6A6A;
+    `}
 `;
 
 const Text = styled.span`
@@ -22,8 +27,12 @@ const Text = styled.span`
     line-height: 1.375rem;
 `;
 
-export const Button: React.StatelessComponent<ButtonInterface> = ({ text }) => (
-    <StyledButton>
+export const Button: React.StatelessComponent<ButtonInterface> = ({ text, transparent }) => (
+    <StyledButton transparent>
         <Text>{text}</Text>
     </StyledButton>
 );
+
+Button.defaultProps = {
+    transparent: false,
+};