diff options
Diffstat (limited to 'packages/website/ts/components/footer.tsx')
| -rw-r--r-- | packages/website/ts/components/footer.tsx | 87 |
1 files changed, 36 insertions, 51 deletions
diff --git a/packages/website/ts/components/footer.tsx b/packages/website/ts/components/footer.tsx index 4b9942276..3346f2545 100644 --- a/packages/website/ts/components/footer.tsx +++ b/packages/website/ts/components/footer.tsx @@ -1,11 +1,9 @@ import * as _ from 'lodash'; import * as React from 'react'; -import { - Link, -} from 'react-router-dom'; -import {WebsitePaths} from 'ts/types'; -import {colors} from 'ts/utils/colors'; -import {constants} from 'ts/utils/constants'; +import { Link } from 'react-router-dom'; +import { WebsitePaths } from 'ts/types'; +import { colors } from 'ts/utils/colors'; +import { constants } from 'ts/utils/constants'; interface MenuItemsBySection { [sectionName: string]: FooterMenuItem[]; @@ -102,11 +100,11 @@ const linkStyle = { cursor: 'pointer', }; -const titleToIcon: {[title: string]: string} = { +const titleToIcon: { [title: string]: string } = { 'Rocket.chat': 'rocketchat.png', - 'Blog': 'medium.png', - 'Twitter': 'twitter.png', - 'Reddit': 'reddit.png', + Blog: 'medium.png', + Twitter: 'twitter.png', + Reddit: 'reddit.png', }; export interface FooterProps {} @@ -116,15 +114,20 @@ interface FooterState {} export class Footer extends React.Component<FooterProps, FooterState> { public render() { return ( - <div className="relative pb4 pt2" style={{backgroundColor: colors.darkerGrey}}> - <div className="mx-auto max-width-4 md-px2 lg-px0 py4 clearfix" style={{color: colors.white}}> + <div className="relative pb4 pt2" style={{ backgroundColor: colors.darkerGrey }}> + <div className="mx-auto max-width-4 md-px2 lg-px0 py4 clearfix" style={{ color: colors.white }}> <div className="col lg-col-4 md-col-4 col-12 left"> - <div className="sm-mx-auto" style={{width: 148}}> + <div className="sm-mx-auto" style={{ width: 148 }}> <div> <img src="/images/protocol_logo_white.png" height="30" /> </div> <div - style={{fontSize: 11, color: colors.grey, paddingLeft: 37, paddingTop: 2}} + style={{ + fontSize: 11, + color: colors.grey, + paddingLeft: 37, + paddingTop: 2, + }} > © ZeroEx, Intl. </div> @@ -156,53 +159,38 @@ export class Footer extends React.Component<FooterProps, FooterState> { } private _renderIcon(fileName: string) { return ( - <div style={{height: ICON_DIMENSION, width: ICON_DIMENSION}}> - <img src={`/images/social/${fileName}`} style={{width: ICON_DIMENSION}} /> + <div style={{ height: ICON_DIMENSION, width: ICON_DIMENSION }}> + <img src={`/images/social/${fileName}`} style={{ width: ICON_DIMENSION }} /> </div> ); } private _renderMenuItem(item: FooterMenuItem) { const iconIfExists = titleToIcon[item.title]; return ( - <div - key={item.title} - className="sm-center" - style={{fontSize: 13, paddingTop: 25}} - > - {item.isExternal ? - <a - className="text-decoration-none" - style={linkStyle} - target="_blank" - href={item.path} - > - {!_.isUndefined(iconIfExists) ? - <div className="sm-mx-auto" style={{width: 65}}> + <div key={item.title} className="sm-center" style={{ fontSize: 13, paddingTop: 25 }}> + {item.isExternal ? ( + <a className="text-decoration-none" style={linkStyle} target="_blank" href={item.path}> + {!_.isUndefined(iconIfExists) ? ( + <div className="sm-mx-auto" style={{ width: 65 }}> <div className="flex"> - <div className="pr1"> - {this._renderIcon(iconIfExists)} - </div> + <div className="pr1">{this._renderIcon(iconIfExists)}</div> <div>{item.title}</div> </div> - </div> : + </div> + ) : ( item.title - } - </a> : - <Link - to={item.path} - style={linkStyle} - className="text-decoration-none" - > + )} + </a> + ) : ( + <Link to={item.path} style={linkStyle} className="text-decoration-none"> <div> - {!_.isUndefined(iconIfExists) && - <div className="pr1"> - {this._renderIcon(iconIfExists)} - </div> - } + {!_.isUndefined(iconIfExists) && ( + <div className="pr1">{this._renderIcon(iconIfExists)}</div> + )} {item.title} </div> </Link> - } + )} </div> ); } @@ -215,10 +203,7 @@ export class Footer extends React.Component<FooterProps, FooterState> { fontSize: 13, }; return ( - <div - className="lg-pb2 md-pb2 sm-pt4" - style={headerStyle} - > + <div className="lg-pb2 md-pb2 sm-pt4" style={headerStyle}> {title} </div> ); |