diff options
author | Fabio Berger <me@fabioberger.com> | 2018-03-04 02:55:40 +0800 |
---|---|---|
committer | Fabio Berger <me@fabioberger.com> | 2018-03-04 02:55:40 +0800 |
commit | 3592ebef0800fe3c32c9f1e4870b667a07a322bb (patch) | |
tree | efc7b8c9ef06e457b769a0244b252cdd8f3f7cc7 /packages/website/ts/pages/shared/anchor_title.tsx | |
parent | a783d21409424a5da934d5909a9238d1d08fe88b (diff) | |
download | dexon-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/anchor_title.tsx')
-rw-r--r-- | packages/website/ts/pages/shared/anchor_title.tsx | 86 |
1 files changed, 0 insertions, 86 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, - }); - } -} |