crowetic/protocol
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Add font family to Button component and use in Join0x component

Browse Source
This commit is contained in:
Brandon Millman 2018-06-12 14:23:03 -07:00
parent eba8b4bf00
commit d206d0a3ae
2 changed files with 16 additions and 13 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
packages/website/ts/components/ui/button.tsx
View File

@ -7,6 +7,7 @@ export interface ButtonProps {
className?: string; className?: string;
fontSize?: string; fontSize?: string;
fontColor?: string; fontColor?: string;
fontFamily?: string;
backgroundColor?: string; backgroundColor?: string;
borderColor?: string; borderColor?: string;
width?: string; width?: string;
@ -28,7 +29,7 @@ export const Button = styled(PlainButton)`
border-radius: 6px; border-radius: 6px;
box-shadow: 0px 0px 4px rgba(0, 0, 0, 0.25); box-shadow: 0px 0px 4px rgba(0, 0, 0, 0.25);
font-weight: 500; font-weight: 500;
font-family: 'Roboto'; font-family: ${props => props.fontFamily};
width: ${props => props.width}; width: ${props => props.width};
background-color: ${props => props.backgroundColor}; background-color: ${props => props.backgroundColor};
border: ${props => (props.borderColor ? `1px solid ${props.borderColor}` : 'none')}; border: ${props => (props.borderColor ? `1px solid ${props.borderColor}` : 'none')};
@ -44,6 +45,7 @@ Button.defaultProps = {
fontSize: '12px', fontSize: '12px',
backgroundColor: colors.white, backgroundColor: colors.white,
width: 'auto', width: 'auto',
fontFamily: 'Roboto',
}; };
Button.displayName = 'Button'; Button.displayName = 'Button';

25
packages/website/ts/pages/jobs/join_0x.tsx
View File

@ -1,8 +1,11 @@
import { colors } from '@0xproject/react-shared'; import { colors } from '@0xproject/react-shared';
import FlatButton from 'material-ui/FlatButton';
import * as React from 'react'; import * as React from 'react';
import { Button } from 'ts/components/ui/button';
const BUTTON_TEXT = 'view open positions';
export interface Join0xProps { export interface Join0xProps {
onCallToActionClick: () => void; 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. work remotely anywhere in the world to help create the infrastructure of a new tokenized economy.
</div> </div>
<div className="py3"> <div className="py3">
<FlatButton <Button
label={'view open positions'} type="button"
backgroundColor={colors.black} backgroundColor={colors.black}
labelStyle={{ width="290px"
fontSize: 18, fontColor={colors.white}
fontFamily: 'Roboto Mono', fontSize="18px"
fontWeight: 'lighter', fontFamily="Roboto Mono"
color: colors.white,
textTransform: 'lowercase',
}}
style={{ width: 280, height: 62, borderRadius: 5 }}
onClick={props.onCallToActionClick} onClick={props.onCallToActionClick}
/> >
{BUTTON_TEXT}
</Button>
</div> </div>
</div> </div>
</div> </div>