aboutsummaryrefslogtreecommitdiffstats
path: root/packages/website/ts
diff options
context:
space:
mode:
authorBrandon Millman <brandon.millman@gmail.com>2018-06-13 05:23:03 +0800
committerBrandon Millman <brandon.millman@gmail.com>2018-06-13 05:23:03 +0800
commitd206d0a3aea86612a274427bcf2eaa590f46c6e7 (patch)
tree36bf9100d4fd5f2efdad3799118fcc253c30aab0 /packages/website/ts
parenteba8b4bf00f6e1794a8642a8972585f062c58d3b (diff)
downloaddexon-sol-tools-d206d0a3aea86612a274427bcf2eaa590f46c6e7.tar
dexon-sol-tools-d206d0a3aea86612a274427bcf2eaa590f46c6e7.tar.gz
dexon-sol-tools-d206d0a3aea86612a274427bcf2eaa590f46c6e7.tar.bz2
dexon-sol-tools-d206d0a3aea86612a274427bcf2eaa590f46c6e7.tar.lz
dexon-sol-tools-d206d0a3aea86612a274427bcf2eaa590f46c6e7.tar.xz
dexon-sol-tools-d206d0a3aea86612a274427bcf2eaa590f46c6e7.tar.zst
dexon-sol-tools-d206d0a3aea86612a274427bcf2eaa590f46c6e7.zip
Add font family to Button component and use in Join0x component
Diffstat (limited to 'packages/website/ts')
-rw-r--r--packages/website/ts/components/ui/button.tsx4
-rw-r--r--packages/website/ts/pages/jobs/join_0x.tsx25
2 files changed, 16 insertions, 13 deletions
diff --git a/packages/website/ts/components/ui/button.tsx b/packages/website/ts/components/ui/button.tsx
index 4c7d59839..1f88297de 100644
--- a/packages/website/ts/components/ui/button.tsx
+++ b/packages/website/ts/components/ui/button.tsx
@@ -7,6 +7,7 @@ export interface ButtonProps {
className?: string;
fontSize?: string;
fontColor?: string;
+ fontFamily?: string;
backgroundColor?: string;
borderColor?: string;
width?: string;
@@ -28,7 +29,7 @@ export const Button = styled(PlainButton)`
border-radius: 6px;
box-shadow: 0px 0px 4px rgba(0, 0, 0, 0.25);
font-weight: 500;
- font-family: 'Roboto';
+ font-family: ${props => props.fontFamily};
width: ${props => props.width};
background-color: ${props => props.backgroundColor};
border: ${props => (props.borderColor ? `1px solid ${props.borderColor}` : 'none')};
@@ -44,6 +45,7 @@ Button.defaultProps = {
fontSize: '12px',
backgroundColor: colors.white,
width: 'auto',
+ fontFamily: 'Roboto',
};
Button.displayName = 'Button';
diff --git a/packages/website/ts/pages/jobs/join_0x.tsx b/packages/website/ts/pages/jobs/join_0x.tsx
index e7fdf3ce1..72cce3b89 100644
--- a/packages/website/ts/pages/jobs/join_0x.tsx
+++ b/packages/website/ts/pages/jobs/join_0x.tsx
@@ -1,8 +1,11 @@
import { colors } from '@0xproject/react-shared';
-import FlatButton from 'material-ui/FlatButton';
import * as React from 'react';
+import { Button } from 'ts/components/ui/button';
+
+const BUTTON_TEXT = 'view open positions';
+
export interface Join0xProps {
onCallToActionClick: () => void;
}
@@ -21,19 +24,17 @@ export const Join0x = (props: Join0xProps) => (
work remotely anywhere in the world to help create the infrastructure of a new tokenized economy.
</div>
<div className="py3">
- <FlatButton
- label={'view open positions'}
+ <Button
+ type="button"
backgroundColor={colors.black}
- labelStyle={{
- fontSize: 18,
- fontFamily: 'Roboto Mono',
- fontWeight: 'lighter',
- color: colors.white,
- textTransform: 'lowercase',
- }}
- style={{ width: 280, height: 62, borderRadius: 5 }}
+ width="290px"
+ fontColor={colors.white}
+ fontSize="18px"
+ fontFamily="Roboto Mono"
onClick={props.onCallToActionClick}
- />
+ >
+ {BUTTON_TEXT}
+ </Button>
</div>
</div>
</div>