aboutsummaryrefslogtreecommitdiffstats
path: root/packages/website/ts/pages/shared
diff options
context:
space:
mode:
authorFabio Berger <me@fabioberger.com>2018-03-04 02:55:40 +0800
committerFabio Berger <me@fabioberger.com>2018-03-04 02:55:40 +0800
commit3592ebef0800fe3c32c9f1e4870b667a07a322bb (patch)
treeefc7b8c9ef06e457b769a0244b252cdd8f3f7cc7 /packages/website/ts/pages/shared
parenta783d21409424a5da934d5909a9238d1d08fe88b (diff)
downloaddexon-sol-tools-3592ebef0800fe3c32c9f1e4870b667a07a322bb.tar
dexon-sol-tools-3592ebef0800fe3c32c9f1e4870b667a07a322bb.tar.gz
dexon-sol-tools-3592ebef0800fe3c32c9f1e4870b667a07a322bb.tar.bz2
dexon-sol-tools-3592ebef0800fe3c32c9f1e4870b667a07a322bb.tar.lz
dexon-sol-tools-3592ebef0800fe3c32c9f1e4870b667a07a322bb.tar.xz
dexon-sol-tools-3592ebef0800fe3c32c9f1e4870b667a07a322bb.tar.zst
dexon-sol-tools-3592ebef0800fe3c32c9f1e4870b667a07a322bb.zip
Move over AnchorTitle and associated elements
Diffstat (limited to 'packages/website/ts/pages/shared')
-rw-r--r--packages/website/ts/pages/shared/anchor_title.tsx86
-rw-r--r--packages/website/ts/pages/shared/markdown_link_block.tsx3
-rw-r--r--packages/website/ts/pages/shared/markdown_section.tsx3
-rw-r--r--packages/website/ts/pages/shared/nested_sidebar_menu.tsx6
-rw-r--r--packages/website/ts/pages/shared/section_header.tsx3
5 files changed, 7 insertions, 94 deletions
diff --git a/packages/website/ts/pages/shared/anchor_title.tsx b/packages/website/ts/pages/shared/anchor_title.tsx
deleted file mode 100644
index 0270618a0..000000000
--- a/packages/website/ts/pages/shared/anchor_title.tsx
+++ /dev/null
@@ -1,86 +0,0 @@
-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';
-
-const headerSizeToScrollOffset: { [headerSize: string]: number } = {
- h2: -20,
- h3: 0,
-};
-
-interface AnchorTitleProps {
- title: string | React.ReactNode;
- id: string;
- headerSize: HeaderSizes;
- shouldShowAnchor: boolean;
-}
-
-interface AnchorTitleState {
- isHovering: boolean;
-}
-
-const styles: Styles = {
- anchor: {
- fontSize: 20,
- transform: 'rotate(45deg)',
- cursor: 'pointer',
- },
- headers: {
- WebkitMarginStart: 0,
- WebkitMarginEnd: 0,
- fontWeight: 'bold',
- display: 'block',
- },
- h1: {
- fontSize: '1.8em',
- },
- h2: {
- fontSize: '1.5em',
- fontWeight: 400,
- },
- h3: {
- fontSize: '1.17em',
- },
-};
-
-export class AnchorTitle extends React.Component<AnchorTitleProps, AnchorTitleState> {
- constructor(props: AnchorTitleProps) {
- super(props);
- this.state = {
- isHovering: false,
- };
- }
- public render() {
- let opacity = 0;
- if (this.props.shouldShowAnchor) {
- 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 }}>
- {this.props.title}
- </div>
- <ScrollLink
- to={this.props.id}
- offset={headerSizeToScrollOffset[this.props.headerSize]}
- duration={constants.DOCS_SCROLL_DURATION_MS}
- containerId={constants.DOCS_CONTAINER_ID}
- >
- <i
- className="zmdi zmdi-link"
- onClick={utils.setUrlHash.bind(utils, this.props.id)}
- style={{ ...styles.anchor, opacity }}
- onMouseOver={this._setHoverState.bind(this, true)}
- onMouseOut={this._setHoverState.bind(this, false)}
- />
- </ScrollLink>
- </div>
- );
- }
- private _setHoverState(isHovering: boolean) {
- this.setState({
- isHovering,
- });
- }
-}
diff --git a/packages/website/ts/pages/shared/markdown_link_block.tsx b/packages/website/ts/pages/shared/markdown_link_block.tsx
index e4553c87f..b1f68c915 100644
--- a/packages/website/ts/pages/shared/markdown_link_block.tsx
+++ b/packages/website/ts/pages/shared/markdown_link_block.tsx
@@ -1,3 +1,4 @@
+import { utils as sharedUtils } from '@0xproject/react-shared';
import * as _ from 'lodash';
import * as React from 'react';
import { configs } from 'ts/utils/configs';
@@ -41,6 +42,6 @@ export class MarkdownLinkBlock extends React.Component<MarkdownLinkBlockProps, M
private _onHashUrlClick(href: string) {
const hash = href.split('#')[1];
utils.scrollToHash(hash, configs.SCROLL_CONTAINER_ID);
- utils.setUrlHash(hash);
+ sharedUtils.setUrlHash(hash);
}
}
diff --git a/packages/website/ts/pages/shared/markdown_section.tsx b/packages/website/ts/pages/shared/markdown_section.tsx
index 7253072d9..18cbf70c0 100644
--- a/packages/website/ts/pages/shared/markdown_section.tsx
+++ b/packages/website/ts/pages/shared/markdown_section.tsx
@@ -1,12 +1,11 @@
+import { AnchorTitle, HeaderSizes } from '@0xproject/react-shared/anchor_title';
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 { MarkdownLinkBlock } from 'ts/pages/shared/markdown_link_block';
-import { HeaderSizes } from 'ts/types';
import { colors } from 'ts/utils/colors';
import { utils } from 'ts/utils/utils';
diff --git a/packages/website/ts/pages/shared/nested_sidebar_menu.tsx b/packages/website/ts/pages/shared/nested_sidebar_menu.tsx
index 82a40eb7e..abbd34c98 100644
--- a/packages/website/ts/pages/shared/nested_sidebar_menu.tsx
+++ b/packages/website/ts/pages/shared/nested_sidebar_menu.tsx
@@ -1,11 +1,11 @@
+import { constants, Styles, utils as sharedUtils } from '@0xproject/react-shared';
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 { MenuSubsectionsBySection } from 'ts/types';
import { colors } from 'ts/utils/colors';
-import { constants } from 'ts/utils/constants';
import { utils } from 'ts/utils/utils';
interface NestedSidebarMenuProps {
@@ -171,7 +171,7 @@ export class NestedSidebarMenu extends React.Component<NestedSidebarMenuProps, N
}
private _onMenuItemClick(name: string): void {
const id = utils.getIdFromName(name);
- utils.setUrlHash(id);
+ sharedUtils.setUrlHash(id);
this.props.onMenuItemClick();
}
}
diff --git a/packages/website/ts/pages/shared/section_header.tsx b/packages/website/ts/pages/shared/section_header.tsx
index 52a1f30d9..758aec574 100644
--- a/packages/website/ts/pages/shared/section_header.tsx
+++ b/packages/website/ts/pages/shared/section_header.tsx
@@ -1,7 +1,6 @@
+import { AnchorTitle, HeaderSizes } from '@0xproject/react-shared/anchor_title';
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 { colors } from 'ts/utils/colors';
import { utils } from 'ts/utils/utils';