diff options
Diffstat (limited to 'packages/website/ts/pages/documentation')
3 files changed, 13 insertions, 20 deletions
diff --git a/packages/website/ts/pages/documentation/comment.tsx b/packages/website/ts/pages/documentation/comment.tsx index 23cfd96bd..5f177e97e 100644 --- a/packages/website/ts/pages/documentation/comment.tsx +++ b/packages/website/ts/pages/documentation/comment.tsx @@ -15,7 +15,7 @@ const defaultProps = { export const Comment: React.SFC<CommentProps> = (props: CommentProps) => { return ( <div className={`${props.className} comment`}> - <ReactMarkdown source={props.comment} renderers={{ CodeBlock: MarkdownCodeBlock }} /> + <ReactMarkdown source={props.comment} renderers={{ code: MarkdownCodeBlock }} /> </div> ); }; diff --git a/packages/website/ts/pages/documentation/documentation.tsx b/packages/website/ts/pages/documentation/documentation.tsx index 7eed78fc3..699bef7a8 100644 --- a/packages/website/ts/pages/documentation/documentation.tsx +++ b/packages/website/ts/pages/documentation/documentation.tsx @@ -29,11 +29,11 @@ import { TypescriptMethod, } from 'ts/types'; import { colors } from 'ts/utils/colors'; +import { configs } from 'ts/utils/configs'; import { constants } from 'ts/utils/constants'; import { utils } from 'ts/utils/utils'; const TOP_BAR_HEIGHT = 60; -const SCROLL_TOP_ID = 'docsScrollTop'; const networkNameToColor: { [network: string]: string } = { [Networks.Kovan]: colors.purple, @@ -76,7 +76,8 @@ const styles: Styles = { export class Documentation extends React.Component<DocumentationProps, DocumentationState> { public componentDidUpdate(prevProps: DocumentationProps, prevState: DocumentationState) { if (!_.isEqual(prevProps.docAgnosticFormat, this.props.docAgnosticFormat)) { - this._scrollToHash(); + const hash = this.props.location.hash.slice(1); + utils.scrollToHash(hash, configs.SCROLL_CONTAINER_ID); } } public render() { @@ -115,8 +116,12 @@ export class Documentation extends React.Component<DocumentationProps, Documenta className="relative col lg-col-9 md-col-9 sm-col-12 col-12" style={{ backgroundColor: colors.white }} > - <div id="documentation" style={styles.mainContainers} className="absolute px1"> - <div id={SCROLL_TOP_ID} /> + <div + id={configs.SCROLL_CONTAINER_ID} + style={styles.mainContainers} + className="absolute px1" + > + <div id={configs.SCROLL_TOP_ID} /> {this._renderDocumentation()} </div> </div> @@ -325,17 +330,4 @@ export class Documentation extends React.Component<DocumentationProps, Documenta /> ); } - private _scrollToHash(): void { - const hashWithPrefix = this.props.location.hash; - let hash = hashWithPrefix.slice(1); - if (_.isEmpty(hash)) { - hash = SCROLL_TOP_ID; // scroll to the top - } - - scroller.scrollTo(hash, { - duration: 0, - offset: 0, - containerId: 'documentation', - }); - } } diff --git a/packages/website/ts/pages/documentation/event_definition.tsx b/packages/website/ts/pages/documentation/event_definition.tsx index 0e53e38e7..e62c9ecbd 100644 --- a/packages/website/ts/pages/documentation/event_definition.tsx +++ b/packages/website/ts/pages/documentation/event_definition.tsx @@ -25,9 +25,10 @@ export class EventDefinition extends React.Component<EventDefinitionProps, Event } public render() { const event = this.props.event; + const id = `${this.props.sectionName}-${event.name}`; return ( <div - id={`${this.props.sectionName}-${event.name}`} + id={id} className="pb2" style={{ overflow: 'hidden', width: '100%' }} onMouseOver={this._setAnchorVisibility.bind(this, true)} @@ -36,7 +37,7 @@ export class EventDefinition extends React.Component<EventDefinitionProps, Event <AnchorTitle headerSize={HeaderSizes.H3} title={`Event ${event.name}`} - id={event.name} + id={id} shouldShowAnchor={this.state.shouldShowAnchor} /> <div style={{ fontSize: 16 }}> |