diff options
author | Brandon Millman <brandon.millman@gmail.com> | 2018-06-11 12:29:15 +0800 |
---|---|---|
committer | Brandon Millman <brandon.millman@gmail.com> | 2018-06-13 01:41:09 +0800 |
commit | bc36c0faed11d61164027efad5b2ad9d07f0573f (patch) | |
tree | 6f1fd8fa15652f4faf26258f0b65351edc42bc9d /packages/website/ts/pages/jobs/bulleted_item_list.tsx | |
parent | 3c073bc360f88129bd59e7e3d0d7fbcf69828da4 (diff) | |
download | dexon-sol-tools-bc36c0faed11d61164027efad5b2ad9d07f0573f.tar dexon-sol-tools-bc36c0faed11d61164027efad5b2ad9d07f0573f.tar.gz dexon-sol-tools-bc36c0faed11d61164027efad5b2ad9d07f0573f.tar.bz2 dexon-sol-tools-bc36c0faed11d61164027efad5b2ad9d07f0573f.tar.lz dexon-sol-tools-bc36c0faed11d61164027efad5b2ad9d07f0573f.tar.xz dexon-sol-tools-bc36c0faed11d61164027efad5b2ad9d07f0573f.tar.zst dexon-sol-tools-bc36c0faed11d61164027efad5b2ad9d07f0573f.zip |
Teams section
Diffstat (limited to 'packages/website/ts/pages/jobs/bulleted_item_list.tsx')
-rw-r--r-- | packages/website/ts/pages/jobs/bulleted_item_list.tsx | 47 |
1 files changed, 39 insertions, 8 deletions
diff --git a/packages/website/ts/pages/jobs/bulleted_item_list.tsx b/packages/website/ts/pages/jobs/bulleted_item_list.tsx index 30dd126d1..a00290418 100644 --- a/packages/website/ts/pages/jobs/bulleted_item_list.tsx +++ b/packages/website/ts/pages/jobs/bulleted_item_list.tsx @@ -2,20 +2,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 type BulletedItemInfo = BulletedItemProps; export interface BulletedItemListProps { - headerText: string; - bulletedItems: BulletedItemProps[]; + headerText?: string; + bulletedItemInfos: BulletedItemInfo[]; } 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> + {!_.isUndefined(props.headerText) && ( + <div + className="h2 lg-py4 md-py4 sm-py3" + style={{ + paddingLeft: 90, + fontFamily: 'Roboto Mono', + minHeight: '1.25em', + lineHeight: 1.25, + }} + > + {props.headerText} + </div> + )} + <div className="px2"> - {_.map(props.bulletedItems, bulletedItemProps => { + {_.map(props.bulletedItemInfos, bulletedItemProps => { return ( <BulletedItem key={bulletedItemProps.title} @@ -29,3 +39,24 @@ export const BulletedItemList = (props: BulletedItemListProps) => { </div> ); }; + +interface BulletedItemProps { + bulletColor: string; + title: string; + description: string; + height?: number; +} +const BulletedItem = (props: BulletedItemProps) => { + const minHeight = props.height || 150; + return ( + <div className="flex" style={{ minHeight }}> + <svg className="flex-none px2" height="26" width="26"> + <circle cx="13" cy="13" r="13" fill={props.bulletColor} /> + </svg> + <div className="flex-auto px2"> + <div style={{ paddingTop: 3, fontWeight: 'bold', fontSize: 16 }}>{props.title}</div> + <div style={{ paddingTop: 12, fontSize: 16, lineHeight: 2 }}>{props.description}</div> + </div> + </div> + ); +}; |