diff options
author | Brandon Millman <brandon.millman@gmail.com> | 2018-06-11 10:49:40 +0800 |
---|---|---|
committer | Brandon Millman <brandon.millman@gmail.com> | 2018-06-13 01:41:08 +0800 |
commit | c52d5e108434f857f79926723732522ee38f6a91 (patch) | |
tree | 66a81ba1f42102532931a166a985de941ba5e6e0 /packages/website/ts/pages/jobs | |
parent | b7bb27fa2135aa87a91667639920eb0c2db4cb85 (diff) | |
download | dexon-0x-contracts-c52d5e108434f857f79926723732522ee38f6a91.tar dexon-0x-contracts-c52d5e108434f857f79926723732522ee38f6a91.tar.gz dexon-0x-contracts-c52d5e108434f857f79926723732522ee38f6a91.tar.bz2 dexon-0x-contracts-c52d5e108434f857f79926723732522ee38f6a91.tar.lz dexon-0x-contracts-c52d5e108434f857f79926723732522ee38f6a91.tar.xz dexon-0x-contracts-c52d5e108434f857f79926723732522ee38f6a91.tar.zst dexon-0x-contracts-c52d5e108434f857f79926723732522ee38f6a91.zip |
Refactor into BulletedItemList component
Diffstat (limited to 'packages/website/ts/pages/jobs')
-rw-r--r-- | packages/website/ts/pages/jobs/bulleted_item_list.tsx | 30 | ||||
-rw-r--r-- | packages/website/ts/pages/jobs/values.tsx | 27 |
2 files changed, 33 insertions, 24 deletions
diff --git a/packages/website/ts/pages/jobs/bulleted_item_list.tsx b/packages/website/ts/pages/jobs/bulleted_item_list.tsx new file mode 100644 index 000000000..108f31e00 --- /dev/null +++ b/packages/website/ts/pages/jobs/bulleted_item_list.tsx @@ -0,0 +1,30 @@ +import { colors } from '@0xproject/react-shared'; +import * as _ from 'lodash'; +import * as React from 'react'; + +import { BulletedItem, BulletedItemProps } from 'ts/pages/jobs/bulleted_item'; + +export interface BulletedItemListProps { + headerText: string; + bulletedItems: BulletedItemProps[]; +} +export const BulletedItemList = (props: BulletedItemListProps) => { + return ( + <div className="mx-auto max-width-4"> + <div className="h2 lg-py4 md-py4 sm-py3" style={{ paddingLeft: 90, fontFamily: 'Roboto Mono' }}> + {props.headerText} + </div> + <div className="px2"> + {_.map(props.bulletedItems, bulletedItemProps => { + return ( + <BulletedItem + bulletColor={bulletedItemProps.bulletColor} + title={bulletedItemProps.title} + description={bulletedItemProps.description} + /> + ); + })} + </div> + </div> + ); +}; diff --git a/packages/website/ts/pages/jobs/values.tsx b/packages/website/ts/pages/jobs/values.tsx index 9bb98d016..37e62d23b 100644 --- a/packages/website/ts/pages/jobs/values.tsx +++ b/packages/website/ts/pages/jobs/values.tsx @@ -2,7 +2,8 @@ import { colors } from '@0xproject/react-shared'; import * as _ from 'lodash'; import * as React from 'react'; -import { BulletedItem, BulletedItemProps } from 'ts/pages/jobs/bulleted_item'; +import { BulletedItemProps } from 'ts/pages/jobs/bulleted_item'; +import { BulletedItemList } from 'ts/pages/jobs/bulleted_item_list'; const BULLETED_ITEMS: BulletedItemProps[] = [ { @@ -22,26 +23,4 @@ const BULLETED_ITEMS: BulletedItemProps[] = [ }, ]; -export const Values = () => { - const isSmallScreen = false; - return ( - <div className="clearfix" style={{ backgroundColor: colors.white }}> - <div className="mx-auto max-width-4 clearfix"> - <div className="h2 lg-py4 md-py4 sm-py3" style={{ paddingLeft: 90, fontFamily: 'Roboto Mono' }}> - Our Values - </div> - <div className="col col-12 px2"> - {_.map(BULLETED_ITEMS, bulletedItemProps => { - return ( - <BulletedItem - bulletColor={bulletedItemProps.bulletColor} - title={bulletedItemProps.title} - description={bulletedItemProps.description} - /> - ); - })} - </div> - </div> - </div> - ); -}; +export const Values = () => <BulletedItemList headerText="Our Values" bulletedItems={BULLETED_ITEMS} />; |