aboutsummaryrefslogtreecommitdiffstats
path: root/packages/website/ts/pages/shared
diff options
context:
space:
mode:
authorLeonid Logvinov <logvinov.leon@gmail.com>2017-12-22 22:05:32 +0800
committerLeonid Logvinov <logvinov.leon@gmail.com>2018-01-03 18:37:38 +0800
commite744e4cd989bd3ae1070c59f7baa8097f18b8b06 (patch)
treea7fde03873f3c1b8689d3991edbb362f8022e5f0 /packages/website/ts/pages/shared
parent9a96e8c704b6f84e00bbe848159a4819844cf09d (diff)
downloaddexon-0x-contracts-e744e4cd989bd3ae1070c59f7baa8097f18b8b06.tar.gz
dexon-0x-contracts-e744e4cd989bd3ae1070c59f7baa8097f18b8b06.tar.zst
dexon-0x-contracts-e744e4cd989bd3ae1070c59f7baa8097f18b8b06.zip
Apply prettier config
Diffstat (limited to 'packages/website/ts/pages/shared')
-rw-r--r--packages/website/ts/pages/shared/anchor_title.tsx21
-rw-r--r--packages/website/ts/pages/shared/markdown_code_block.tsx8
-rw-r--r--packages/website/ts/pages/shared/markdown_section.tsx23
-rw-r--r--packages/website/ts/pages/shared/nested_sidebar_menu.tsx107
-rw-r--r--packages/website/ts/pages/shared/section_header.tsx10
-rw-r--r--packages/website/ts/pages/shared/version_drop_down.tsx10
6 files changed, 77 insertions, 102 deletions
diff --git a/packages/website/ts/pages/shared/anchor_title.tsx b/packages/website/ts/pages/shared/anchor_title.tsx
index 0c1e8f4b7..db5be1f59 100644
--- a/packages/website/ts/pages/shared/anchor_title.tsx
+++ b/packages/website/ts/pages/shared/anchor_title.tsx
@@ -1,16 +1,16 @@
import * as React from 'react';
-import {Link as ScrollLink} from 'react-scroll';
-import {HeaderSizes, Styles} from 'ts/types';
-import {constants} from 'ts/utils/constants';
-import {utils} from 'ts/utils/utils';
+import { Link as ScrollLink } from 'react-scroll';
+import { HeaderSizes, Styles } from 'ts/types';
+import { constants } from 'ts/utils/constants';
+import { utils } from 'ts/utils/utils';
-const headerSizeToScrollOffset: {[headerSize: string]: number} = {
+const headerSizeToScrollOffset: { [headerSize: string]: number } = {
h2: -20,
h3: 0,
};
interface AnchorTitleProps {
- title: string|React.ReactNode;
+ title: string | React.ReactNode;
id: string;
headerSize: HeaderSizes;
shouldShowAnchor: boolean;
@@ -62,11 +62,8 @@ export class AnchorTitle extends React.Component<AnchorTitleProps, AnchorTitleSt
opacity = this.state.isHovering ? 0.6 : 1;
}
return (
- <div className="relative flex" style={{...styles[this.props.headerSize], ...styles.headers}}>
- <div
- className="inline-block"
- style={{paddingRight: 4}}
- >
+ <div className="relative flex" style={{ ...styles[this.props.headerSize], ...styles.headers }}>
+ <div className="inline-block" style={{ paddingRight: 4 }}>
{this.props.title}
</div>
<ScrollLink
@@ -78,7 +75,7 @@ export class AnchorTitle extends React.Component<AnchorTitleProps, AnchorTitleSt
<i
className="zmdi zmdi-link"
onClick={utils.setUrlHash.bind(utils, this.props.id)}
- style={{...styles.anchor, opacity}}
+ style={{ ...styles.anchor, opacity }}
onMouseOver={this._setHoverState.bind(this, true)}
onMouseOut={this._setHoverState.bind(this, false)}
/>
diff --git a/packages/website/ts/pages/shared/markdown_code_block.tsx b/packages/website/ts/pages/shared/markdown_code_block.tsx
index aded15f0c..be96fda16 100644
--- a/packages/website/ts/pages/shared/markdown_code_block.tsx
+++ b/packages/website/ts/pages/shared/markdown_code_block.tsx
@@ -17,12 +17,8 @@ export class MarkdownCodeBlock extends React.Component<MarkdownCodeBlockProps, M
}
public render() {
return (
- <span style={{fontSize: 16}}>
- <HighLight
- className={this.props.language || 'javascript'}
- >
- {this.props.literal}
- </HighLight>
+ <span style={{ fontSize: 16 }}>
+ <HighLight className={this.props.language || 'javascript'}>{this.props.literal}</HighLight>
</span>
);
}
diff --git a/packages/website/ts/pages/shared/markdown_section.tsx b/packages/website/ts/pages/shared/markdown_section.tsx
index e81920fc3..5487dc8cc 100644
--- a/packages/website/ts/pages/shared/markdown_section.tsx
+++ b/packages/website/ts/pages/shared/markdown_section.tsx
@@ -2,11 +2,11 @@ import * as _ from 'lodash';
import RaisedButton from 'material-ui/RaisedButton';
import * as React from 'react';
import * as ReactMarkdown from 'react-markdown';
-import {Element as ScrollElement} from 'react-scroll';
-import {AnchorTitle} from 'ts/pages/shared/anchor_title';
-import {MarkdownCodeBlock} from 'ts/pages/shared/markdown_code_block';
-import {HeaderSizes} from 'ts/types';
-import {utils} from 'ts/utils/utils';
+import { Element as ScrollElement } from 'react-scroll';
+import { AnchorTitle } from 'ts/pages/shared/anchor_title';
+import { MarkdownCodeBlock } from 'ts/pages/shared/markdown_code_block';
+import { HeaderSizes } from 'ts/types';
+import { utils } from 'ts/utils/utils';
interface MarkdownSectionProps {
sectionName: string;
@@ -41,7 +41,7 @@ export class MarkdownSection extends React.Component<MarkdownSectionProps, Markd
<ScrollElement name={id}>
<div className="clearfix">
<div className="col lg-col-8 md-col-8 sm-col-12">
- <span style={{textTransform: 'capitalize'}}>
+ <span style={{ textTransform: 'capitalize' }}>
<AnchorTitle
headerSize={this.props.headerSize}
title={sectionName}
@@ -51,20 +51,17 @@ export class MarkdownSection extends React.Component<MarkdownSectionProps, Markd
</span>
</div>
<div className="col col-4 sm-hide xs-hide py2 right-align">
- {!_.isUndefined(this.props.githubLink) &&
+ {!_.isUndefined(this.props.githubLink) && (
<RaisedButton
href={this.props.githubLink}
target="_blank"
label="Edit on Github"
- icon={<i className="zmdi zmdi-github" style={{fontSize: 23}} />}
+ icon={<i className="zmdi zmdi-github" style={{ fontSize: 23 }} />}
/>
- }
+ )}
</div>
</div>
- <ReactMarkdown
- source={this.props.markdownContent}
- renderers={{CodeBlock: MarkdownCodeBlock}}
- />
+ <ReactMarkdown source={this.props.markdownContent} renderers={{ CodeBlock: MarkdownCodeBlock }} />
</ScrollElement>
</div>
);
diff --git a/packages/website/ts/pages/shared/nested_sidebar_menu.tsx b/packages/website/ts/pages/shared/nested_sidebar_menu.tsx
index 6dc194010..849c33504 100644
--- a/packages/website/ts/pages/shared/nested_sidebar_menu.tsx
+++ b/packages/website/ts/pages/shared/nested_sidebar_menu.tsx
@@ -1,15 +1,15 @@
import * as _ from 'lodash';
import MenuItem from 'material-ui/MenuItem';
import * as React from 'react';
-import {Link as ScrollLink} from 'react-scroll';
-import {VersionDropDown} from 'ts/pages/shared/version_drop_down';
-import {MenuSubsectionsBySection, Styles} from 'ts/types';
-import {colors} from 'ts/utils/colors';
-import {constants} from 'ts/utils/constants';
-import {utils} from 'ts/utils/utils';
+import { Link as ScrollLink } from 'react-scroll';
+import { VersionDropDown } from 'ts/pages/shared/version_drop_down';
+import { MenuSubsectionsBySection, Styles } from 'ts/types';
+import { colors } from 'ts/utils/colors';
+import { constants } from 'ts/utils/constants';
+import { utils } from 'ts/utils/utils';
interface NestedSidebarMenuProps {
- topLevelMenu: {[topLevel: string]: string[]};
+ topLevelMenu: { [topLevel: string]: string[] };
menuSubsectionsBySection: MenuSubsectionsBySection;
shouldDisplaySectionHeaders?: boolean;
onMenuItemClick?: () => void;
@@ -44,20 +44,14 @@ export class NestedSidebarMenu extends React.Component<NestedSidebarMenuProps, N
if (this.props.shouldDisplaySectionHeaders) {
const id = utils.getIdFromName(sectionName);
return (
- <div
- key={`section-${sectionName}`}
- className="py1"
- >
+ <div key={`section-${sectionName}`} className="py1">
<ScrollLink
to={id}
offset={-20}
duration={constants.DOCS_SCROLL_DURATION_MS}
containerId={constants.DOCS_CONTAINER_ID}
>
- <div
- style={{color: colors.grey, cursor: 'pointer'}}
- className="pb1"
- >
+ <div style={{ color: colors.grey, cursor: 'pointer' }} className="pb1">
{finalSectionName.toUpperCase()}
</div>
</ScrollLink>
@@ -65,34 +59,29 @@ export class NestedSidebarMenu extends React.Component<NestedSidebarMenuProps, N
</div>
);
} else {
- return (
- <div key={`section-${sectionName}`} >
- {this._renderMenuItems(menuItems)}
- </div>
- );
+ return <div key={`section-${sectionName}`}>{this._renderMenuItems(menuItems)}</div>;
}
});
return (
<div>
{!_.isUndefined(this.props.versions) &&
- !_.isUndefined(this.props.selectedVersion) &&
- !_.isUndefined(this.props.docPath) &&
- <VersionDropDown
- selectedVersion={this.props.selectedVersion}
- versions={this.props.versions}
- docPath={this.props.docPath}
- />
- }
+ !_.isUndefined(this.props.selectedVersion) &&
+ !_.isUndefined(this.props.docPath) && (
+ <VersionDropDown
+ selectedVersion={this.props.selectedVersion}
+ versions={this.props.versions}
+ docPath={this.props.docPath}
+ />
+ )}
{navigation}
</div>
);
}
private _renderMenuItems(menuItemNames: string[]): React.ReactNode[] {
- const menuItemStyles = this.props.shouldDisplaySectionHeaders ?
- styles.menuItemWithHeaders :
- styles.menuItemWithoutHeaders;
- const menuItemInnerDivStyles = this.props.shouldDisplaySectionHeaders ?
- styles.menuItemInnerDivWithHeaders : {};
+ const menuItemStyles = this.props.shouldDisplaySectionHeaders
+ ? styles.menuItemWithHeaders
+ : styles.menuItemWithoutHeaders;
+ const menuItemInnerDivStyles = this.props.shouldDisplaySectionHeaders ? styles.menuItemInnerDivWithHeaders : {};
const menuItems = _.map(menuItemNames, menuItemName => {
const id = utils.getIdFromName(menuItemName);
return (
@@ -109,9 +98,7 @@ export class NestedSidebarMenu extends React.Component<NestedSidebarMenuProps, N
style={menuItemStyles}
innerDivStyle={menuItemInnerDivStyles}
>
- <span style={{textTransform: 'capitalize'}}>
- {menuItemName}
- </span>
+ <span style={{ textTransform: 'capitalize' }}>{menuItemName}</span>
</MenuItem>
</ScrollLink>
{this._renderMenuItemSubsections(menuItemName)}
@@ -128,30 +115,34 @@ export class NestedSidebarMenu extends React.Component<NestedSidebarMenuProps, N
}
private _renderMenuSubsectionsBySection(menuItemName: string, entityNames: string[]): React.ReactNode {
return (
- <ul style={{margin: 0, listStyleType: 'none', paddingLeft: 0}} key={menuItemName}>
- {_.map(entityNames, entityName => {
- const name = `${menuItemName}-${entityName}`;
- const id = utils.getIdFromName(name);
- return (
- <li key={`menuItem-${entityName}`}>
- <ScrollLink
- to={id}
- offset={0}
- duration={constants.DOCS_SCROLL_DURATION_MS}
- containerId={constants.DOCS_CONTAINER_ID}
- onTouchTap={this._onMenuItemClick.bind(this, name)}
- >
- <MenuItem
+ <ul style={{ margin: 0, listStyleType: 'none', paddingLeft: 0 }} key={menuItemName}>
+ {_.map(entityNames, entityName => {
+ const name = `${menuItemName}-${entityName}`;
+ const id = utils.getIdFromName(name);
+ return (
+ <li key={`menuItem-${entityName}`}>
+ <ScrollLink
+ to={id}
+ offset={0}
+ duration={constants.DOCS_SCROLL_DURATION_MS}
+ containerId={constants.DOCS_CONTAINER_ID}
onTouchTap={this._onMenuItemClick.bind(this, name)}
- style={{minHeight: 35}}
- innerDivStyle={{paddingLeft: 36, fontSize: 14, lineHeight: '35px'}}
>
- {entityName}
- </MenuItem>
- </ScrollLink>
- </li>
- );
- })}
+ <MenuItem
+ onTouchTap={this._onMenuItemClick.bind(this, name)}
+ style={{ minHeight: 35 }}
+ innerDivStyle={{
+ paddingLeft: 36,
+ fontSize: 14,
+ lineHeight: '35px',
+ }}
+ >
+ {entityName}
+ </MenuItem>
+ </ScrollLink>
+ </li>
+ );
+ })}
</ul>
);
}
diff --git a/packages/website/ts/pages/shared/section_header.tsx b/packages/website/ts/pages/shared/section_header.tsx
index 5ea9fc681..a5f5f52cf 100644
--- a/packages/website/ts/pages/shared/section_header.tsx
+++ b/packages/website/ts/pages/shared/section_header.tsx
@@ -1,8 +1,8 @@
import * as React from 'react';
-import {Element as ScrollElement} from 'react-scroll';
-import {AnchorTitle} from 'ts/pages/shared/anchor_title';
-import {HeaderSizes} from 'ts/types';
-import {utils} from 'ts/utils/utils';
+import { Element as ScrollElement } from 'react-scroll';
+import { AnchorTitle } from 'ts/pages/shared/anchor_title';
+import { HeaderSizes } from 'ts/types';
+import { utils } from 'ts/utils/utils';
interface SectionHeaderProps {
sectionName: string;
@@ -34,7 +34,7 @@ export class SectionHeader extends React.Component<SectionHeaderProps, SectionHe
<ScrollElement name={id}>
<AnchorTitle
headerSize={this.props.headerSize}
- title={<span style={{textTransform: 'capitalize'}}>{sectionName}</span>}
+ title={<span style={{ textTransform: 'capitalize' }}>{sectionName}</span>}
id={id}
shouldShowAnchor={this.state.shouldShowAnchor}
/>
diff --git a/packages/website/ts/pages/shared/version_drop_down.tsx b/packages/website/ts/pages/shared/version_drop_down.tsx
index 8d3322d72..b922e1048 100644
--- a/packages/website/ts/pages/shared/version_drop_down.tsx
+++ b/packages/website/ts/pages/shared/version_drop_down.tsx
@@ -14,7 +14,7 @@ interface VersionDropDownState {}
export class VersionDropDown extends React.Component<VersionDropDownProps, VersionDropDownState> {
public render() {
return (
- <div className="mx-auto" style={{width: 120}}>
+ <div className="mx-auto" style={{ width: 120 }}>
<DropDownMenu
maxHeight={300}
value={this.props.selectedVersion}
@@ -27,13 +27,7 @@ export class VersionDropDown extends React.Component<VersionDropDownProps, Versi
}
private _renderDropDownItems() {
const items = _.map(this.props.versions, version => {
- return (
- <MenuItem
- key={version}
- value={version}
- primaryText={`v${version}`}
- />
- );
+ return <MenuItem key={version} value={version} primaryText={`v${version}`} />;
});
return items;
}